Keyboard-operable accordion with disclosure buttons and arrow navigation
One task across 30 published runs. Inspect the scores and outputs together, with each run's execution method shown.
- Task
- AYGAT-0005
- Domain
- UI components
- Difficulty
- hard
Leading published run: claude-opus-4-8 (low reasoning) at 100.0% composite. Lowest: deepseek-v4-flash at 0.0%. 30 published runs shown on this task.
How this task was evaluated
Results are ordered by this task's published score. API runs use one prompt and one completion; agent runs use a coding harness with tools and iteration. Inspect the execution method when comparing results.
Objective scores use the benchmark's execution checks. Judge scores use a vision panel's fixed rubric; the published score leaves out a model's own family. Missing values are labelled rather than treated as zero.
Read the brief
Build a single self-contained page as one HTML file (`index.html`) that renders with no build step and no network calls (inline all CSS and JS, no external fonts or scripts). Build an accordion FAQ following the WAI-ARIA accordion pattern. Requirements: - At least three accordion items. Each header is a real <button> with the ids acc-shipping, acc-returns, acc-billing, each carrying aria-expanded (all "false" on load) and aria-controls pointing at its panel. - Each panel (ids panel-shipping, panel-returns, panel-billing) starts hidden. Activating a header button with Enter or Space flips its aria-expanded to "true" and reveals its panel; activating again collapses it. - When a header button has focus, ArrowDown moves focus to the next header and ArrowUp to the previous (wrapping at the ends). The accordion must be fully operable with the keyboard alone. Use plain, accessible markup.
