Skip to content

Buttons: No color contrast warning, regardless of chosen colors #39226

@ryelle

Description

@ryelle

Description

On the Button block, you can set a text & link color. Regardless of the colors chosen, then contrast warning does not appear. This seems to be because the node used in ColorPanel to get the color data is getting .wp-block-button, when the colors are actually applied to the child div .wp-block-button__link. So it's never getting the set colors, just whatever happens to be set on the container element.

Step-by-step reproduction instructions

  1. Add a Buttons block
  2. Select the Button
  3. In the sidebar, edit the text & background colors
  4. No color combo, even using the same color for both, will show the contrast warning

Doing the same with a paragraph block shows the contrast warning.

Screenshots, screen recording, code snippet

The contrast warning shows correctly on Paragraphs, but not on Buttons:

Paragraph Button

Environment info

  • WordPress 5.9.1
  • Gutenberg 12.7.0 (also reproduced on GB trunk, core without Gutenberg, and in GB 11.9.0, trying to see when this was introduced)
  • MacOS, Chrome & Firefox

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Block] ButtonsAffects the Buttons Block[Focus] Accessibility (a11y)Changes that impact accessibility and need corresponding review (e.g. markup changes).

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions