Skip to main content

Test results

Pick a model to see how accessible its components are, with the accessibility skill off and on.

Claude Sonnet 5.5

Skill version 2.3

Totals for the whole run, across 3 generations of each of the 22 components
MeasureSkill offSkill on
Failed acceptance criteria521
of which WCAG330
of which Best practice191
Total cost (US dollars)$2.98$10.67
Input tokens443,8597.4 million
Output tokens231,117536,693

Tooltip

Results, totals across all generations

Cost in USD

Failed acceptance criteria

Skill off
2 fails
WCAG
2 fails
Best practice
0 fails
Skill on
0 fails
WCAG
0 fails
Best practice
0 fails

Total cost

Skill off
$0.11
Skill on
$0.36

Efficiency, average per generation

Input tokens include cache reads.

Input tokens

Skill off
6,162 tokens
Skill on
88,207 tokens

Output tokens

Skill off
2,743 tokens
Skill on
5,327 tokens

Turns

Skill off
2 turns
Skill on
6 turns

Time

Skill off
17 seconds
Skill on
38 seconds

Cost

Skill off
$0.04
Skill on
$0.12
Prompt given to the model
Build a page with one button labelled "Shipping details" in a single self-contained HTML file (inline CSS and JS, no build step, no external libraries). Hovering over or focusing the button shows a small pop-up box next to it containing the text "Orders ship within 2 business days." The pop-up is not shown when the page first loads. Output the complete code in one HTML code block.

Generated code

Skill off
Skill on
Show

Showing 11 of 11 criteria

Semantic markup5 criteria

  • The tooltip content's role of tooltip is included in the accessibility tree.WCAG 4.1.2Automated
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content's accessible name is included in the accessibility tree.WCAG 4.1.2Automated
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • When the tooltip content is visible, it is in the accessibility tree.WCAG 1.3.1Automated
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content is programmatically associated with its trigger using aria-describedby.WCAG 1.3.1Automated
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content does not contain interactive elements (for example, links, buttons, or form fields).Best practiceAutomated
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass

Keyboard3 criteria

  • The tooltip content is visible when the interactive control has focus.WCAG 2.1.1Browser
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content is visible when the interactive control is hovered over.WCAG 1.4.13Browser
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content is dismissible by pressing the Escape key or clicking outside of it.WCAG 1.4.13Browser
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass

Visual design2 criteria

  • The tooltip content remains visible when the mouse cursor moves from the trigger to the tooltip content itself.WCAG 1.4.13Browser
    Skill off

    1/3 failed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Fail
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
  • The tooltip content remains visible until the trigger loses hover or focus, the user dismisses it, or the information it contains becomes invalid. It does not disappear automatically after a fixed time while the trigger still has hover or focus.WCAG 1.4.13Browser
    Skill off

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass

Adaptive UI1 criterion

  • The tooltip content can be viewed at smaller screen widths (320px) without loss of content or functionality, and without requiring horizontal scrolling.WCAG 1.4.10Browser
    Skill off

    1/3 failed

    • Generation 1: Pass
    • Generation 2: Fail
    • Generation 3: Pass
    Skill on

    3/3 passed

    • Generation 1: Pass
    • Generation 2: Pass
    • Generation 3: Pass

Back to top