fix: color contrast fails for oklch and oklab with none#4959
fix: color contrast fails for oklch and oklab with none#4959chutchins25 merged 11 commits intodevelopfrom
Conversation
…e parsed into a color
…e to be parsed into a color
…arse issue but was not being caught for foreground color
|
|
There was a problem hiding this comment.
Pull request overview
This PR fixes a bug where color contrast checks fail when encountering OKLCH or OKLAB colors with none values. The fix adds error handling to gracefully report parsing failures as incomplete results rather than crashing the check.
- Wraps color parsing operations in try-catch blocks to handle parsing errors
- Updates the Color class to throw errors with structured cause information
- Adds new "colorParse" message key to report unparseable color strings across all locales
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| lib/commons/color/color.js | Enhanced error throwing to include cause with color string value |
| lib/commons/color/get-foreground-color.js | Added try-catch to handle foreground color parsing failures |
| lib/commons/color/get-background-color.js | Added try-catch to handle background color parsing failures |
| lib/checks/color/color-contrast-evaluate.js | Added logic to detect and report colorParse errors from incomplete data |
| lib/checks/color/color-contrast.json | Added colorParse error message template |
| lib/checks/color/color-contrast-enhanced.json | Added colorParse error message template |
| locales/_template.json | Added colorParse error message template to both color-contrast and color-contrast-enhanced |
| test/checks/color/color-contrast.js | Added three test cases validating error handling for unparseable colors in foreground, background, and text-shadow |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
…tured caolor parse error for foreground and background
There was a problem hiding this comment.
Great first pass. Other than the comments below, we'll also want to add integration tests that show that the rule itself returns incomplete for the bad color parse. The way that file works is you add the HTML to the .html file that will produce the error and give it an ID. Then in the companion .json file you add the ID to the appropriate result type (in this case incomplete array). We typically try to group the HTML code by type, so you can add the new HTML right after the #canttell20 elements.
… incompleteData object in color.js. Updated catches in foreground and background getters.
straker
left a comment
There was a problem hiding this comment.
LGTM. Adding incompleteData to the Color class simplifies the handling of the error. Otherwise we'd have to find every instance of new Color throughout all the nested background / foreground functions that may already have incompleteData and catch and handle the error in them.
|
Would like @dbjorge or @WilcoFiers to review as well |
Do you think they may have opinions on the introduction of the incompleteData to color.js? I know when I presented this idea to you, you had mentioned they may have historical reasoning to either do so or not do so. I had bounced this off them in Slack and they seemed ok with it at a glance and deferred to your judgement. I am ok either way. Just making sure you are. |
### [4.11.1](v4.11.0...v4.11.1) (2026-01-06) ### Bug Fixes - allow shadow roots in axe.run contexts ([#4952](#4952)) ([d4aee16](d4aee16)), closes [#4941](#4941) - color contrast fails for oklch and oklab with none ([#4959](#4959)) ([8f249fd](8f249fd)) - **color-contrast:** do not incomplete on textarea ([#4968](#4968)) ([d271788](d271788)), closes [#4947](#4947) - **commons/color:** Match browser behavior for out-of-gamut oklch colors ([#4908](#4908)) ([5036be8](5036be8)) - don't runs rules that select `html` on nested `html` elements ([#4969](#4969)) ([1e9a5c3](1e9a5c3)) - replaced luminance threshold constant 0.03928 with 0.04045 ([#4934](#4934)) ([316967d](316967d)), closes [#4933](#4933) - **rgaa:** adjust mapping of aria-hidden-\* and valid-lang ([#4935](#4935)) ([77571f2](77571f2)) - **valid-lang:** update valid-langs for newer language codes ([#4966](#4966)) ([c3f5446](c3f5446)), closes [#4963](#4963) This PR was opened by a robot 🤖 🎉
Adds error handling for color-contrast checks. This now will report an 'incomplete' error message when the foreground and/or background color strings were not able to be parsed into an actual color.
Tests also verify that text-shadow color is handled should that occur.
fixes: 4894
Developer Notes:
I was not able to have a test case trigger the colorParse error on text-shadow colorParse issues. This case was getting caught already but in the form of the 'complexTextShadows' error.