Colorblind mode - #1257
Open
sferik wants to merge 3 commits into
Open
Conversation
Red and green are the report's core signal, covered versus missed, and they are the pairing most colorblind viewers cannot tell apart. This adds two independent ways to read coverage without relying on that distinction. A Colorblind toggle sits to the left of the Dark toggle in the toolbar. It swaps the covered and missed colors, and the coverage bands, for blue versus orange, the standard colorblind-safe pairing, in both the light and dark themes. Skipped stays yellow and the branch and method misses keep their orange and purple, since those already read as distinct hues. The choice persists in localStorage and is applied before first paint so there is no flash, mirroring the Dark toggle. The source view now also carries a non-color marker in a left gutter on every line: plus for covered, minus for missed, tilde for skipped, plus or minus for a missed branch, and an f for an uncalled method. The same glyphs appear on the legend swatches, so the mapping is legible in greyscale and to assistive tech regardless of the palette. This is on in every mode, not just colorblind, and was the maintainers' suggestion on the issue. Accessibility touch-ups alongside: both toggles report state with aria-pressed, the dark toggle gains an aria-label, and a visible focus-visible ring is drawn on keyboard-focused controls. Resolves #534.
Two fixes from the PR review. The dark toggle carried aria-pressed while its accessible name flipped with state (Switch to dark mode / Switch to light mode). aria-pressed needs a stable name to be meaningful, so drop it: the button is an action button whose label names the action, and the label stays in sync with the visible text (which also satisfies WCAG 2.5.3 Label in Name, where a fixed name would not). The colorblind toggle, whose label never changes, keeps aria-pressed. The dark colorblind overrides outrank the print reset that forces a light palette, so a report printed in dark plus colorblind mode kept dark covered/missed backgrounds while the rest of the page went light. Scope the dark colorblind values to screen so they never reach paper, and re-assert the light colorblind values inside the print reset so a colorblind report prints blue and orange rather than reverting to the green and red its reader configured away.
The colorblind and dark toggles lived only in the report's toolbar, which the source dialog covers while it is open, so a reader could not switch modes without closing the file first. Add both toggles to the dialog header as well. The two copies are wired by a data-toggle attribute rather than an id, and each kind shares one click handler with all its buttons synced, so toggling from either place updates the palette and both buttons at once. The dialog copies are hidden in print like the toolbar.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR adds a “Colorblind” button next to the “Dark” button in the toolbar. It swaps the covered/missed colors and the coverage bands from green/red to blue (covered) / orange (missed), the standard colorblind-safe pairing, in both the light and dark themes. Skipped stays yellow and the branch/method misses keep their orange and purple, since those already read as distinct hues. The choice persists in
localStorageand is applied before first paint (no flash), mirroring the existing Dark toggle.