chore(link): add link vrt coverage

[aramos-adobe]

Description

Adds visual regression test (VRT) coverage for the 2nd-gen Link component (components/link). Link is a CSS-only utility (a native <a> styled by link.css's .swc-Link BEM modifiers, imported page-level in preview.ts), so it has no custom element and no shadow root. Coverage is delivered as two new .vrt.ts files, following the existing VRT patterns in the package. No component, behavior, or DOM changes — test-only.

test/vrt/link.vrt.ts — permutations

Two snapshots off a shared permutationContent():

• Permutations (rendered light/ltr + dark/rtl in one story): inline variants (default / secondary), standalone, quiet standalone (rest + forced-hover, to show the underline returning), all four interaction states (rest / hover / active / focus-visible) for both default and secondary, CJK line-height (ja / ko / zh), and static white/black variants + states on their matching contrast backgrounds via staticColorBackground.
• ForcedColors: same content under forced-colors: active (its own snapshot, since it repaints the whole page palette).

Forced pseudo-states are mirrored from document.styleSheets via forcePseudoStates('.swc-Link[data-force-state]') (the plain-element path — no shadow root), matching the button global-styles VRT.

test/vrt/link-custom-properties.vrt.ts — custom properties

One reference-vs-override row per documented --swc-link-* custom property (magenta overrides, obviously distinct from the default tokens), with the state-scoped color properties forced into the interaction state they resolve in (hover / active / focus-visible).

Reviewer note — coverage guard is manual, not manifest-driven. The component custom-property VRTs (accordion, button, card, dropzone) assert coverage with verifyCustomPropertyCoverage(), which reads the cssProperties list off the component's custom-elements-manifest declaration. Link is CSS-only and has no manifest declaration (confirmed absent from both .storybook/custom-elements.json and dist/custom-elements.json), so that helper can't be used. Instead, verifyLinkCustomPropertyCoverage() asserts the covered set exactly matches a hardcoded DOCUMENTED_LINK_PROPERTIES list that mirrors the "CSS custom properties" table in link.mdx. This preserves the "did we forget one?" safety net (a new/renamed --swc-link-* property fails the test until covered), but the list must be kept in sync with link.mdx by hand — there's no manifest to enforce it automatically.

Reviewer note — global styles intentionally not covered. stylesheets/global/global-link.css exists (a plain-element a:where(:not([class])) baseline), so per the VRT authoring guidance a *-global-styles.vrt.ts would normally accompany this. It is intentionally omitted: unlike global-button.css (imported by global-elements.css, so live in preview.ts), global-link.css is not loaded — it's documented as opt-in and deliberately excluded from swc.css. Covering it would require either importing it into preview.ts (contradicts its opt-in design) or importing it inside the VRT file (a page-global a:where(:not([class])) rule that would restyle bare anchors in every other component's stories and cause unrelated diffs). Its declarations are near-identical to .swc-Link, which link.vrt.ts already covers. Happy to add it as a follow-up via the isolated-import route if reviewers prefer.

Motivation and context

The Link component shipped without dedicated VRT stories. This closes that gap so regressions in link color variants, standalone/quiet modifiers, interaction states, CJK line-height, static colors, forced-colors, and the documented custom properties are caught by Chromatic.

Related issue(s)

• fixes SWC-2400

Screenshots (if appropriate)

N/A — the visual coverage this PR adds is captured as Chromatic VRT snapshots rather than static screenshots.

---

Author's checklist

• I have read the CONTRIBUTING and PULL_REQUESTS documents.
• I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
• I have added automated tests to cover my changes.
• I have included a well-written changeset if my change needs to be published. — N/A, test-only change; nothing published.
• I have included updated documentation if my change required it. — N/A, no API or behavior change.

---

Reviewer's checklist

• Includes a Github Issue with appropriate flag or Jira ticket number without a link
• Includes thoughtfully written changeset if changes suggested include patch, minor, or major features
• Automated tests cover all use cases and follow best practices for writing
• Validated on all supported browsers
• All VRTs are approved before the author can update Golden Hash

Manual review test cases

• New Link VRT stories render correctly across themes and states

  1. Run Storybook locally and open the Link / Link VRT group in the sidebar.
  2. Open the Permutations story and confirm every row renders: variants (default / secondary), standalone, quiet standalone (rest + hover), states (rest / hover / active / focus-visible) for default and secondary, CJK line-height, and static white/black on their contrast backgrounds — in both the light/ltr and dark/rtl halves.
  3. Expect no missing rows, no unstyled anchors, and the forced states to visibly differ from rest.

• Forced-colors and custom-property coverage

  1. Open the Forced colors story and confirm the palette renders under forced-colors: active.
  2. Open the Custom properties story; for each --swc-link-* row, confirm the override cell is visibly magenta and clearly different from the reference cell.
  3. Expect the Custom properties story play function to pass (coverage assertion green).

Device review

• Did it pass in Desktop?
• Did it pass in (emulated) Mobile?
• Did it pass in (emulated) iPad?

Accessibility testing checklist

This is a test-only PR that adds VRT stories; it does not change the Link component's markup, semantics, or behavior. The steps below verify the added stories rather than new component behavior.

• Keyboard (required — document steps below) — What to test for: focus indicator is visible; no focus traps.

  1. In Storybook, open Link / Link VRT → Permutations.
  2. Tab through the rendered anchors.
  3. Expect a visible focus ring on each link (matching the focus-visible VRT row); no focus traps; tab order follows document order.

• Screen reader (required — document steps below) — What to test for: role and name announced correctly.

  1. With a screen reader active, navigate the anchors in the Permutations story.
  2. Move focus to a link and read it.
  3. Expect each to be announced as a link with its visible text as the accessible name; no duplicate or spurious announcements.

[changeset-bot]

⚠️ No Changeset found

Latest commit: e42e286

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

📚 Branch Preview Links

• Storybook (Gen2, dev mode)
• Storybook (Gen2, prod mode)
• Documentation Site (Gen1)
• Storybook (Gen1)

🔍 Gen1 Visual Regression Test Results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

• Spectrum | Light | Medium | LTR
• Spectrum | Dark | Large | RTL
• Express | Light | Medium | LTR
• Express | Dark | Large | RTL
• Spectrum-two | Light | Medium | LTR
• Spectrum-two | Dark | Large | RTL
• High Contrast Mode | Medium | LTR

Deployed to Azure Blob Storage: pr-6582

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

[cdransf]

Looks great! ✨

[rise-erpelding]

The VRTs look good!

One tiny thing we might also consider, the migration plan included checklist items for VRTs that we could check off (although... how useful is the migration plan at this point really?):

• VRT: default / secondary / quiet / static black / static white × hover / focus-visible (per link.css + prose / wrapper stories)
• VRT: links inside running text vs section / quiet stories (paired modifiers per plan)

I think all of this is covered except for the links inside running text, which seems more like typography's responsibility?