Skip to content

feat(forms): open the field of a lint finding from its path - #279

Merged
erkamyaman merged 2 commits into
mainfrom
forms/lint-show-field
Oct 11, 2026
Merged

erkamyaman merged 2 commits into
mainfrom
forms/lint-show-field

Conversation

@erkamyaman

@erkamyaman erkamyaman commented Oct 11, 2026 •

Copy link
Copy Markdown
Member

What and why

Forms Lint findings showed their field path as plain text, so a finding could not take you to its field. The path is now a "Show field " button that reuses the Error summary behaviour: it switches to the Fields view, clears filters only when they hide the row, opens the field detail and moves focus to its heading. Findings about the whole form have no path and stay plain text.

  • FormsLint emits a showField output, wired to the existing FormsInspector.showField(path).
  • .summary-link styles move into the shared forms styles so the Error summary and Lint share one definition; the focus style now uses the m.focus-ring mixin.
  • The Lint view section of the Forms docs page describes the link.

How it was verified

  • pnpm format:check
  • pnpm typecheck (and ngc -p app/tsconfig.json --noEmit: 0 errors)
  • pnpm test:panel (244 passed; two tests added that fail without the change)
  • pnpm docs:build
  • pnpm extension:build, extension/ui committed
  • pnpm commit:check
  • scripts/panel-axe.mjs on the static report: 29/29 views, 0 violations
  • Live demo, Forms > Lint, dark and light at 1280px and 360px: 0 axe violations, no horizontal overflow, visible focus ring, Enter opens the field on the Fields tab with focus on the detail heading

Screenshots

None attached.

Notes for reviewers

  • No RPC names, data shapes or server behaviour changed. Lint finding paths already use the same format as the field rows (node.path), and root findings send no path.
  • The old hard-coded .path code color is gone; the path now uses the shared accent link style.
  • The live check needed lint findings, so the test script removed label names from the demo's inputs during the run (no repo files changed).
  • Touches forms-inspector.ts like fix(ui): keep focus on the filter box after Clear filters #278 (Escape on the fields filter), so whichever merges second needs a small merge.

Summary by CodeRabbit

  • New Features
    • Field-specific lint findings now include a link that opens the field’s details in the Fields view and focuses them. Form-level findings remain without a field link.
  • Documentation
    • Clarified how field-specific and form-level lint findings appear and how field links work.

A lint finding showed its field path as plain text, so there was no
way to get from a finding to the field it is about. The path is now a
Show field button, named "Show field <path>", that opens the field the
same way an Error summary entry does: it switches to the Fields view,
clears filters only when they hide the row, opens the field detail and
focuses its heading. Findings about the whole form stay plain text.

The lint component emits a showField output that the Forms page wires
to its existing showField(path). The summary-link styles move into the
shared forms styles so both lists use one definition, and their focus
style uses the m.focus-ring mixin instead of a hand-written outline.

The Lint section of the Forms docs page describes the new link.
@github-actions github-actions Bot added area: panel The devtools panel app (app/) area: extension The Chrome extension area: docs The documentation site labels Oct 11, 2026
@coderabbitai

coderabbitai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

Note

Currently processing new changes in this PR. This may take a few minutes, please wait...

⚙️ Run configuration
  • Configuration used: defaults
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: c7d075ba-f59a-4483-80e3-86a12599d5e9

📥 Commits

Reviewing files that changed from the base of the PR and between 10a8d5a and f11e0f1.


⛔ Files ignored due to path filters (1)
  • extension/ui/assets/index-DXC3boOi.js is excluded by !**/assets/index-[0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-].js

📒 Files selected for processing (4)
  • app/src/__tests__/forms-panels.test.ts
  • app/src/pages/forms-inspector.ts
  • extension/ui/assets/browser-agent-rpc-BXhoSh1z-m2f3iI1o.js
  • extension/ui/index.html

 ___________________________________________________________________________
< In Vino Veritas, In Codice Bugas. In wine, there is truth; in code, bugs. >
 ---------------------------------------------------------------------------
  \
   \   (\__/)
       (•ㅅ•)
       /   づ

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: defaults
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 8bcff2f8-d69d-4d72-b59c-e3ad05473692


📥 Commits

Reviewing files that changed from the base of the PR and between 58273c6 and 10a8d5a.



⛔ Files ignored due to path filters (1)
  • extension/ui/assets/index-Bu2QP0tv.js is excluded by !**/assets/index-[0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-].js


📒 Files selected for processing (7)
  • app/src/__tests__/forms-panels.test.ts
  • app/src/pages/forms-inspector.ts
  • app/src/pages/forms-report.ts
  • app/src/pages/forms-types.ts
  • apps/docs/src/content/inspectors/forms.md
  • extension/ui/assets/browser-agent-rpc-BXhoSh1z-uMKjpgxH.js
  • extension/ui/index.html


Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 0 remain after this review.




📝 Walkthrough
📝 Walkthrough

Walkthrough

Field-specific lint findings now have a button that emits the field path. FormsInspector uses that path to open the field in the Fields view. The change also updates the related documentation, tests, and extension UI bundle references.

Changes

Forms field navigation

Layer / File(s) Summary
Lint field-path action
app/src/pages/forms-report.ts, app/src/pages/forms-types.ts, app/src/pages/forms-inspector.ts, app/src/__tests__/forms-panels.test.ts
FormsLint renders field paths as buttons and emits the selected path. Styles define the button appearance. Tests cover field-specific and form-level findings.
Inspector field navigation
app/src/pages/forms-inspector.ts, app/src/__tests__/forms-panels.test.ts, apps/docs/src/content/inspectors/forms.md
FormsInspector forwards the path to its field-navigation handler. The test covers tab switching, filter clearing, field detail opening, and heading focus. The documentation describes navigation from field-specific findings.
Extension UI bundle references
extension/ui/assets/browser-agent-rpc-BXhoSh1z-uMKjpgxH.js, extension/ui/index.html
The browser-agent RPC import and UI module script now reference index-Bu2QP0tv.js.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~12 minutes

Change: Feature

Sequence Diagram(s)

sequenceDiagram
  participant FormsLint
  participant FormsInspector
  participant FieldsView
  FormsLint->>FormsInspector: Emit field path
  FormsInspector->>FieldsView: Switch tab, clear filter, and open field
  FormsInspector->>FieldsView: Focus field detail heading
Loading


Merge Risk: ⚪ Minimal · up to 10a8d

Field findings navigate to their details, and the updated bundle references are consistent. No actionable merge risk remains beyond normal checks.

Pre-merge checks | Passed 4 | Failed 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 5 files. (2 skipped: 2 … Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed The title clearly and concisely describes the main change: opening the field associated with a Forms lint finding from its path.
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.


Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 5 files. (2 skipped: 2 unsupported.)




  • Fix all pre-merge checks with AI
✨ Finishing Touches
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR




🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Comment @coderabbitai help to get the list of available commands.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

🚀 Deploying Preview to Cloudflare 🚀

Preview Deployments by commit

Status Deployment URL Commit Updated (UTC) See this deployment's details
  • Build: Failed ❌

View logs ↗
f11e0f1 2026-10-11T05:34:50.258Z View logs ↗
  • Build: Failed ❌

View logs ↗
10a8d5a 2026-10-11T03:08:09.796Z View logs ↗

# Conflicts:
#	extension/ui/assets/browser-agent-rpc-BXhoSh1z-CFmADKyK.js
#	extension/ui/assets/browser-agent-rpc-BXhoSh1z-CQUbrXfP.js
#	extension/ui/assets/browser-agent-rpc-BXhoSh1z-uMKjpgxH.js
#	extension/ui/assets/index-Bu2QP0tv.js
#	extension/ui/assets/index-CgvJVwtz.js
#	extension/ui/assets/index-RHlVGXjX.js
#	extension/ui/index.html
@erkamyaman
erkamyaman merged commit f7ee66c into main Oct 11, 2026
6 of 8 checks passed
@erkamyaman
erkamyaman deleted the forms/lint-show-field branch October 11, 2026 05:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: docs The documentation site area: extension The Chrome extension area: panel The devtools panel app (app/)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant