Skip to content

Fix visited link color for ai-primary and ai-secondary buttons - #23567

Open
JorPV wants to merge 1 commit into
trunkfrom
1319-fix-ai-button-link-visited-color
Open

Fix visited link color for ai-primary and ai-secondary buttons#23567
JorPV wants to merge 1 commit into
trunkfrom
1319-fix-ai-button-link-visited-color

Conversation

@JorPV

@JorPV JorPV commented Aug 25, 2026

Copy link
Copy Markdown
Contributor

Context

The ai-primary and ai-secondary Button variants in @yoast/ui-library didn't account for the browser's default :visited link styling when rendered link tag. Once clicked, the anchor's text color fell back to the browser's default visited-link color.

Summary

  • [@yoast/ui-library 0.0.1] Fixes a bug where the text color of the ai-primary and ai-secondary button variants would change to the browser's default visited-link color when the button was rendered as a link.

Relevant technical choices

  • Added visited: and visited:hover: Tailwind utilities to both AI variants: mirrors the pattern already used by every other button variant, keeping AI buttons consistent when rendered as links.

Test instructions for the acceptance test before the PR gets merged

  1. Run yarn storybook and open http://localhost:6006.
  2. Navigate to 1) Elements > Button > Factory.
  3. In the Controls panel, set as to a and variant to ai-primary.
  4. Click the rendered link once (so the browser marks it as visited), then reload the page.
  5. Confirm the button text stays white, not the browser's default visited-link color.
  6. Hover over the visited link and confirm the text stays white (only the background darkens).
  7. Repeat steps 3–6 with variant set to ai-secondary, confirming the text stays dark slate instead of white.

Relevant test scenarios

  • Changes should be tested with the browser console open
  • Changes should be tested on different posts/pages/taxonomies/custom post types/custom taxonomies
  • Changes should be tested on different editors (Default Block/Gutenberg/Classic/Elementor/other)
  • Changes should be tested on different browsers
  • Changes should be tested on multisite

Test instructions for QA when the code is in the RC

  • QA should use the same steps as above.

Impact check

Affects the Button component in @yoast/ui-library (ai-primary and ai-secondary variants), used anywhere these buttons render as links across Free/Premium.

Documentation

  • I have written documentation for this change.

Quality assurance

  • I have tested this code to the best of my abilities.
  • During testing, I had activated all plugins that Yoast SEO provides integrations for.
  • I have added unit tests to verify the code works as intended.
  • If any part of the code is behind a feature flag, my test instructions also cover cases where the feature flag is switched off.
  • I have written this PR in accordance with my team's definition of done.
  • I have checked that the base branch is correctly set.
  • I have run grunt build:images and committed the results, if my PR introduces new images or SVGs.

Innovation

  • No innovation project is applicable for this PR.
  • This PR falls under an innovation project. I have attached the innovation label.
  • I have added my hours to the WBSO document.

Fixes Yoast/reserved-tasks#1319

@JorPV
JorPV requested a review from a team as a code owner August 25, 2026 10:43
@JorPV JorPV added the changelog: bugfix Needs to be included in the 'Bugfixes' category in the changelog label Aug 25, 2026
@JorPV JorPV added this to the 28.5 milestone Aug 25, 2026
@coveralls-official

Copy link
Copy Markdown

Coverage Report for CI Build 0

Coverage remained the same at 56.632%

Details

  • Coverage remained the same as the base build.
  • Patch coverage: No coverable lines changed in this PR.
  • No coverage regressions found.

Uncovered Changes

No uncovered changes found.

Coverage Regressions

No coverage regressions found.


Coverage Stats

Coverage Status
Relevant Lines: 72849
Covered Lines: 41189
Line Coverage: 56.54%
Relevant Branches: 19219
Covered Branches: 10951
Branch Coverage: 56.98%
Branches in Coverage %: Yes
Coverage Strength: 41313.72 hits per line

💛 - Coveralls

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

changelog: bugfix Needs to be included in the 'Bugfixes' category in the changelog

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant