test: act on review — and correct an overstated claim about the toast bug

I said all four toast kinds were "the same pixel" in night.  They were not.
Planting a reversion to hue names left the new distinctness test GREEN, because
in night `--blue`, `--green`, `--yellow` and `--red` are four different values
(2.29, 3.14, 4.52, 5.64 against a panel).  What they are is cramped and badly
ranked, with info at 2.29:1 -- below the 3:1 floor, present and invisible.

The byte-identical pairs are real but elsewhere: `--orange` is `--text` and
`--yellow` is `--amber`, which bites a call site that reaches for those names,
not the toast mapping.  The PR body has been corrected too.

So the distinctness assertion is not the one with teeth; the legibility floor
is.  The monochrome toast test now measures every kind against the toast's own
surface, and the hue reversion fails it naming the number: 2.29:1.

Also from review:

`.wrolpi-message-error` still forced `border: 1.5px dashed var(--red)` while its
accent and icon had moved to roles -- nearly the same pixel in night, so no
colour test could see it.  It follows `--message-color` now.  Six more library
rules were naming a hue for a thing that means danger: the night danger button,
invalid form fields, invalid paths, path error text, danger panels and failed
table rows.  All roles now, with a source guard that fails any rule whose
SELECTOR means severity and whose body names a hue.  Focus rings and active-tab
accents deliberately keep `--blue`: those are the primary accent, not severity.

The tokens.css note claimed the brightness ramp held "in every theme" when the
tests deliberately limit it to monochrome.  Narrowed, with the reason spelled
out, because the next person to read it would otherwise have "fixed" light to
match the prose -- which would mean reordering light's hues to satisfy a test.

Added the end-of-chain cases the review asked for: four toasts and four Messages
in night and amber, measured rather than inferred from variable names.

Colour reads now go through a strict `toRgb` that refuses anything not already
resolved.  The reviewer's concern that `getPropertyValue('--info')` returns an
unresolved `var(--blue)` does not hold -- custom properties are substituted at
computed-value time and it returns `#20629c` -- but feeding an unresolved value
to a luminance calculation yields NaN, and `expect(NaN).to.not.equal(x)` passes.
Worth refusing loudly.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Roland 2026-08-01 17:46:33 -06:00 • committed by lrnselfreliance
parent 08c5c233c8
commit c7fddc55af
4 changed files with 155 additions and 27 deletions

View file

@ -92,8 +92,8 @@
*/
html[data-theme="night"] .wrolpi-button-danger {
background: transparent;
color: var(--red);
border: 1.5px dashed var(--red);
color: var(--danger);
border: 1.5px dashed var(--danger);
}
html[data-theme="night"] .wrolpi-button-danger:hover:not(:disabled) {
@ -431,7 +431,7 @@ html[data-theme="amber"] .wrolpi-form-field input:focus {
/* An invalid field is dashed, matching every other failure state in the interface. */
.wrolpi-form-field[data-error] input {
border: 1.5px dashed var(--red);
border: 1.5px dashed var(--danger);
}
.wrolpi-form-field input:disabled {
@ -471,7 +471,7 @@ html[data-theme="amber"] .wrolpi-path-input-control:focus-within {
}
.wrolpi-path-input-control[data-error] {
border: 1.5px dashed var(--red);
border: 1.5px dashed var(--danger);
}
.wrolpi-path-input-control[data-disabled] {
@ -533,7 +533,7 @@ html[data-theme="amber"] .wrolpi-path-input-control:focus-within {
.wrolpi-path-input-error {
font-size: 12px;
color: var(--red);
color: var(--danger);
margin-top: 3px;
}
@ -925,8 +925,13 @@ html .mantine-Notification-closeButton:hover {
}
/* Errors take the danger treatment in every theme, so "dashed" stays one rule. */
/*
* The dashed frame tracks the role the message was given, exactly as its accent and
* icon already do. Naming a hue here meant the frame and the accent could disagree --
* invisible in night, where they are nearly the same pixel, but still wrong.
*/
.wrolpi-message-error {
border: 1.5px dashed var(--red);
border: 1.5px dashed var(--message-color);
}
/* --------------------------------------------------------------- Progress */
@ -1019,7 +1024,7 @@ html[data-theme="amber"] .wrolpi-progress-fill {
/* Danger zones are dashed in every theme; it doubles as a colorblind-safe cue. */
.wrolpi-panel-danger {
border: 1.5px dashed var(--red);
border: 1.5px dashed var(--danger);
}
/* ----------------------------------------------------------- Card posters */
@ -1245,16 +1250,16 @@ html[data-theme="amber"] .wrolpi-th-sort:focus-visible {
/* A failed row carries the danger border, matching failed messages. */
.wrolpi-row-failed > td {
border-top: 1.5px dashed var(--red);
border-bottom: 1.5px dashed var(--red);
border-top: 1.5px dashed var(--danger);
border-bottom: 1.5px dashed var(--danger);
}
.wrolpi-row-failed > td:first-child {
border-left: 1.5px dashed var(--red);
border-left: 1.5px dashed var(--danger);
}
.wrolpi-row-failed > td:last-child {
border-right: 1.5px dashed var(--red);
border-right: 1.5px dashed var(--danger);
}
/* Wide tables scroll inside their own container; the page never scrolls sideways. */