Focus State Contrast Failure (WCAG 4.5:1 not met, got 2.82) #18

Open
opened 2026-02-14 02:03:43 +00:00 by santhoshj · 0 comments
Owner

Automated regression reported this failure from Playwright artifacts.

Defect Details

  • Case key: contrast.spec.ts:160:6 focus state maintains sufficient contrast
  • Suite: capabilities\accessibility\contrast.spec.ts
  • Test: Interactive State Contrast › focus state maintains sufficient contrast @smoke
  • Failure frequency: 8

Error Message

[smoke-chromium] › capabilities\accessibility\contrast.spec.ts:160:6 › Interactive State Contrast › focus state maintains sufficient contrast @smoke       Error: expect(received).toBeGreaterThanOrEqual(expected)      Expected: >= 4.5     Received:    2.820601091277978        185 | 		);       186 |     > 187 | 		expect(normalRatio).toBeGreaterThanOrEqual(WCAG_CONTRAST.normalText);           | 		                    ^       188 | 		expect(focusRatio).toBeGreaterThanOrEqual(WCAG_CONTRAST.normalText);       189 | 	});       190 | });

Evidence (Screenshots/Error Context)

  • e2e/test-results/capabilities-accessibility-f2974-s-sufficient-contrast-smoke-smoke-chromium\test-failed-1.png
  • e2e/test-results/capabilities-accessibility-f2974-s-sufficient-contrast-smoke-smoke-chromium\error-context.md

Root Cause Analysis

Focus ring/text color combination fails WCAG AA contrast in current theme tokens.

Automated regression reported this failure from Playwright artifacts. ## Defect Details - Case key: `contrast.spec.ts:160:6 focus state maintains sufficient contrast` - Suite: `capabilities\accessibility\contrast.spec.ts` - Test: `Interactive State Contrast › focus state maintains sufficient contrast @smoke` - Failure frequency: 8 ## Error Message ```text [smoke-chromium] › capabilities\accessibility\contrast.spec.ts:160:6 › Interactive State Contrast › focus state maintains sufficient contrast @smoke Error: expect(received).toBeGreaterThanOrEqual(expected) Expected: >= 4.5 Received: 2.820601091277978 185 | ); 186 | > 187 | expect(normalRatio).toBeGreaterThanOrEqual(WCAG_CONTRAST.normalText); | ^ 188 | expect(focusRatio).toBeGreaterThanOrEqual(WCAG_CONTRAST.normalText); 189 | }); 190 | }); ``` ## Evidence (Screenshots/Error Context) - `e2e/test-results/capabilities-accessibility-f2974-s-sufficient-contrast-smoke-smoke-chromium\test-failed-1.png` - `e2e/test-results/capabilities-accessibility-f2974-s-sufficient-contrast-smoke-smoke-chromium\error-context.md` ## Root Cause Analysis Focus ring/text color combination fails WCAG AA contrast in current theme tokens.
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: santhoshj/clawfort#18