Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The contrast checker should be triggered when colors are changed. #67035

Closed
juanfra opened this issue Nov 15, 2024 · 4 comments · Fixed by #68799
Closed

The contrast checker should be triggered when colors are changed. #67035

juanfra opened this issue Nov 15, 2024 · 4 comments · Fixed by #68799
Assignees
Labels
[Feature] Colors Color management [Feature] Inspector Controls The interface showing block settings and the controls available for each block [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.

Comments

@juanfra
Copy link
Member

juanfra commented Nov 15, 2024

What problem does this address?

While working on TT5, I noticed that the contrast checker only runs when you change the block focus. This means if you’re adjusting colors for a block, the contrast issue message only appears after you switch to another element and then come back to the block controls. As a result, many users might miss the contrast warning entirely, defeating its purpose.

At the same time, the notice is still there when you update colors that would pass the contrast checker (for the same reason).

Screen.Recording.2024-11-15.at.15.21.25.mov

What is your proposed solution?

It would be ideal if the notice updated in real-time with color changes, providing a clear message for the current color selection.

@juanfra juanfra added [Feature] Colors Color management [Feature] Inspector Controls The interface showing block settings and the controls available for each block [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Enhancement A suggestion for improvement. labels Nov 15, 2024
@github-actions github-actions bot added the [Status] In Progress Tracking issues with work in progress label Nov 15, 2024
@Mamaduka
Copy link
Member

Here's a similar report, #60825. The cause might be the same, or the previous bug might have evolved 🐛

@juanfra
Copy link
Member Author

juanfra commented Nov 15, 2024

Thank you, George! Apologies for not catching that earlier. The issue does seem very similar, if not identical. It’s possible it evolved, as it wasn’t working for me at all—not even on a second attempt.

@Mamaduka
Copy link
Member

No worries, @juanfra!

I think the bug described in the old issue is no longer reproducible after #63799. It introduced the dependencies to contrast the checker effect, so it no longer runs on every render, as the top comment suggests.

@afercia
Copy link
Contributor

afercia commented Nov 18, 2024

so it no longer runs on every render

@Mamaduka does that mean #63799 made things worse, in a way? If so, this issue should be marked as a regression.

In general, the contrast checker not being reliable is a long standing issue that originates even before the original report on #60825. I would greatly appreciate some more priority on reviewing the contrast checker implementation. Ideally, there should be a solid mechanism to signal to other components when the block colors have been changed.

I would love to see this considered under an architectural perspective. On #33079 there's an ongoing conversation about a similar issue, where other components and plugins need to know when a block content has been updated. Similarly, I'd tend to think other components and plugins need to know when a block attributes have been updated. Cc @WordPress/gutenberg-core

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Colors Color management [Feature] Inspector Controls The interface showing block settings and the controls available for each block [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.
Projects
None yet
3 participants