Keyboard-operable tabs with roving tabindex and arrow-key activation
One task across 30 published runs. Inspect the scores and outputs together, with each run's execution method shown.
- Task
- AYGAT-0004
- Domain
- UI components
- Difficulty
- hard
Leading published run: claude-opus-4-8 (max 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 a tabbed interface following the WAI-ARIA tabs pattern with roving tabindex. Requirements: - A role="tablist" containing exactly three role="tab" buttons with the ids tab-profile, tab-security, tab-billing. Exactly one tab is selected on load (aria-selected="true") and only the selected tab has tabindex="0"; the others have tabindex="-1" (roving tabindex). - Three role="tabpanel" elements with ids panel-profile, panel-security, panel-billing; only the selected tab's panel is visible, the others are hidden. - When a tab has focus, ArrowRight moves focus to the next tab and ArrowLeft to the previous (wrapping at the ends). Moving to a tab activates it: its aria-selected becomes "true" (the previous tab's becomes "false"), its tabindex becomes 0, and its panel is shown while the others are hidden (automatic activation). The tabs must be fully operable with the keyboard alone. Use plain, accessible markup.
