Create a tool to help blind or partially sighted users do first pass of visual WCAG tests in an audit.

[zoltan-dulac]

The idea is to create a tool to help blind or partially sighted users do first pass of visual WCAG tests in an audit. It may not be perfect, but it speed up an audit by having this auditor do a lot of the initial work so it can be then handed over to a sighted auditor for verification.

Easy

• 1.4.3 Contrast (Minimum) and 1.4.6 Contrast (Enhanced) - Axe or pa11y
• 1.4.5 Images of Text and 1.4.9 Images of Text (No Exception) - can use tesseract on all images on page to get a good idea if there are text in images.
• 1.4.10 Reflow - would require to detect horizontally scrollable elements using info in Check whether HTML element has scrollbars using JavaScript
• 2.4.7 Focus Visible and 2.4.13 Focus Appearance - use existing focus related Enable unit test to do a diff on the currentStyle object when focused and not focused. See if it adheres to best practices about a good focus state (colour contrast, visibility in High Contast Mode, etc)>
• 2.5.5 Target Size (Enhanced) and 2.5.8 Target Size (Minimum) - reuse code in Enable unit test

Medium

• 1.4.4 Resize Text - detect rems/ems used in font-size CSS, check if a DOM element has a smaller height or width than parent (which would detect text being cut off).
• 1.4.12 Text Spacing - similar to Resize Text, but need to apply the text spacing bookmarklet on the code and repeat the test for Resize Test.
• 1.4.11 Non-text Contrast - test borders on interactive elements for proper contrast, SVG and font icon colour contrast.
• 2.5.2 Pointer Cancellation - detect pointer down event without pointer up event - warning.
• 2.3.3 Animation from Interactions - detect if there are transition or animation events (or requestAnimationFrame calls) without using prefers-reduced-motion styles.
• 2.5.4 Motion Actuation - detect Detecting device orientation and/or DeviceMotionEvent APIs used in JS code

Difficult

• 2.5.1 Pointer Gestures - detect multitouch events or complex touch code.
• 2.5.7 Dragging Movements - test for HTML5 pointer events and drag events in code an issue a warning.
• 2.3.1 Three Flashes or Below Threshold and 2.3.2 Three Flashes - would require recreating PEAT with JS and canvas. Need an algorithm for this. Need to be careful about infringing on IP of the Harding test.

May Be Impossible

• 1.4.8 Visual Presentation

Note that events related tests may use code that is described in the article Javascript - Listing active event listeners on a Web page