feat(web): link the component and vulnerability lists to each other - #678
Merged
Conversation
Investigating a finding meant retyping a name into the other section's search box: a CVE names its package, a component row shows a severity, and neither reached the other. A component's expanded detail now opens the vulnerability list filtered to that component, and a vulnerability's detail opens the component list filtered to its package. Both reuse the seeding the Overview jump cards already use. The links sit in the expanded detail rather than on the row's cells because each row is itself the expand control, and a control nested in a control is not announced reliably. axe rejected the first placement on that rule. The same axe run reported a real contrast defect next to it: the fixed-version column measured 3.77:1 against the light background, so it moves one shade darker. The visual baselines are unchanged. The two shades sit within Playwright's per-pixel colour threshold, so the comparison counts no differing pixels and a reseed regenerates nothing. Modal and section animations are now settled before an accessibility check runs, through a shared test helper. A check taken mid-fade reads blended colours and reported a 4.6:1 pair as 4.23:1.
haksungjang
force-pushed
the
feat/ui-cross-section-links
branch
from
August 14, 2026 13:57
d5fbace to
15b3a06
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What changed
A component's expanded detail opens the Vulnerabilities section filtered to
that component, and a vulnerability's detail opens the Components section
filtered to its package. Both reuse the seed mechanism the Overview jump cards
already use, so this is routing plus a seeded filter, not a new state path.
Placement is deliberate. The links sit in the expanded detail rather than on
the row's cells because each row carries
role="button"(it is the expandcontrol), and axe rejects a control nested in a control on
nested-interactive.The first attempt put them on the package cell and the risk badge; that is what
the rule caught.
Two findings the new axe run surfaced
text-emerald-600, which measures 3.77:1against the light surface, under the 4.5:1 minimum. It moves to
-700(5.48:1). Dark mode was already fine at 10.2:1.
and reported a genuine 4.6:1 pair as 4.23:1. A shared
waitForSettledhelpernow waits for the element's animations before any axe assertion, and the
dialog spec added in the previous change uses it too.
Visual baselines
Unchanged, and verified rather than assumed. The contrast fix looked like it
would move the Vulnerabilities snapshots, so a reseed run was dispatched: it
regenerated nothing and all 33 baselines came back byte-identical, and the
strict job passes. The reason is that
maxDiffPixels: 0bounds how manypixels may differ, while whether a pixel differs at all is decided by
Playwright's per-pixel colour threshold, and the two shades sit inside it.
The rendered colour does change: the browser reports
rgb(4, 120, 87), and alocally regenerated snapshot contains 0 pixels of the old shade against 65 of
the new one.
Verification
sections; the accessibility spec was re-run repeatedly to confirm the fade
flake is gone