Skip to content

a11y(2.1.1): fake-button widgets — replace deprecated onkeypress with onkeydown handling Enter and Space#3528

Merged
ardiewen merged 2 commits into
mainfrom
wcag/2.1.1-fake-button-keypress-to-keydown
Jun 17, 2026
Merged

a11y(2.1.1): fake-button widgets — replace deprecated onkeypress with onkeydown handling Enter and Space#3528
ardiewen merged 2 commits into
mainfrom
wcag/2.1.1-fake-button-keypress-to-keydown

Conversation

@rosanusi

@rosanusi rosanusi commented Jun 10, 2026

Copy link
Copy Markdown
Contributor

Description & motivation 💭

Three fake-button widgets (<div role="button"> / <g role="button">) used the deprecated onkeypress event to activate on keyboard input. Two problems:

  1. keypress is deprecated — unreliable for Space in Firefox; modern guidance is keydown with explicit key matching.
  2. No preventDefault() on Space — pressing Space activates the widget and scrolls the page (or scrollable SVG ancestor), causing a jarring jump before the action fires.

This PR replaces all three call sites with onkeydown handlers that match Enter and ' ' (Space), call preventDefault() to suppress scroll, and invoke the existing click handler. The mouse onclick/on:click paths are untouched.

Files changed (3):

  • src/lib/holocene/navigation/navigation-button.svelte — bottom-nav settings/namespace-picker/feedback buttons (finding #2b)
  • src/lib/components/lines-and-dots/svg/timeline-graph-row.svelte — interactive timeline-graph event row; closes matrix defect (c) (finding [Styling] Font Change #8)
  • src/lib/components/workflow/relationships/workflow-family-node-tree.svelte — two <g role="button"> family-tree nodes (finding Show workflows in UI #9)

SC: 2.1.1 Keyboard (Level A) — current verdict: Fails → Supports (for these three widgets)

Screenshots (if applicable) 📸

No visual change. Keyboard behaviour change only.

Design Considerations 🎨

None — no design tokens or layout affected.

Testing 🧪

How was this tested 👻

  • Manual testing

Steps for others to test: 🚶🏽‍♂️🚶🏽‍♀️

  1. navigation-button — Tab to the settings / namespace-picker / feedback button in the bottom nav. Press Enter: confirm activation. Press Space: confirm activation without page scroll.
  2. timeline-graph-row — Open a workflow with a timeline graph (xl viewport). Tab into the SVG and onto a graph row. Press Enter: confirm the active-group selection expands. Press Space: confirm activation without scrolling the graph container.
  3. workflow-family-node-tree — Open a workflow relationships view. Tab through family-tree nodes. Press Enter and Space on each: confirm node selection fires. Confirm Space does not scroll the ZoomSvg pan container.
  4. Mouse regression — click each widget with the mouse; confirm activation still works identically.
  5. Firefox — repeat steps 1–3 in Firefox, where keypress-on-Space was previously inconsistent. Both Enter and Space should now activate reliably.
  6. VoiceOver smoke test — focus each widget, confirm announcement is {name}, button; activate with VO+Space and Enter; both should fire.
  7. axe-core — run on workflow detail and family-tree relationships pages; zero new violations.

Checklists

Draft Checklist

  • Firefox cross-browser check for Space activation
  • VoiceOver smoke test on all three widgets

Merge Checklist

  • Tested in Firefox (Space previously unreliable via keypress)
  • axe-core: zero new violations
  • Mouse regression confirmed on all three widgets

Issue(s) closed

Closes findings #2b, #8, #9 from audit-output/issues/2.1.1-keyboard-audit.md.
Closes matrix defect (c) recorded at audit-output/vpat-matrix.md:119.

Docs

Any docs updates needed?

No doc changes needed.

A11y-Audit-Ref: 2.1.1-fake-button-keypress-to-keydown

@rosanusi @claude
a11y(2.1.1): replace deprecated onkeypress with onkeydown on fake-but…
622e0b4 
…ton widgets

keypress is deprecated and does not reliably fire for Space in Firefox;
pressing Space also scrolled the page before activating the widget. Replace
all three call sites with onkeydown handlers that match Enter and ' ',
call preventDefault() to suppress page scroll, and invoke the existing
click handler. Closes matrix defect (c).

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
@vercel

vercel Bot commented Jun 10, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
holocene Ready Ready Preview, Comment Jun 17, 2026 7:17pm

Request Review

@CLAassistant

CLAassistant commented Jun 10, 2026 •
edited
Loading

Copy link
Copy Markdown

CLA assistant check
All committers have signed the CLA.

@github-actions github-actions Bot added a11y Accessibility audit PR a11y:bucket-3 Bucket 3: engineer required a11y:sc-2.1.1 labels Jun 10, 2026
@temporal-cicd

temporal-cicd Bot commented Jun 10, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor
Warnings
⚠️

📊 Strict Mode: 10 errors in 2 files (1.1% of 906 total)

src/lib/components/lines-and-dots/svg/timeline-graph-row.svelte (5)
  • L105:20: 'distance' is possibly 'null'.
  • L105:31: 'workflowDistance' is possibly 'null'.
  • L116:20: 'distance' is possibly 'null'.
  • L116:31: 'workflowDistance' is possibly 'null'.
  • L259:12: 'pendingActivity.attempt' is possibly 'null' or 'undefined'.
src/lib/components/workflow/relationships/workflow-family-node-tree.svelte (5)
  • L79:21: Parameter 'e' implicitly has an 'any' type.
  • L171:6: Type 'string | null' is not assignable to type 'string | number'.
  • L232:8: Type 'false | "[writing-mode:vertical-lr]"' is not assignable to type 'ClassValue | null | undefined'.
  • L239:25: 'child.siblingCount' is possibly 'undefined'.
  • L300:6: Type 'string | null' is not assignable to type 'string | number'.

Generated by 🚫 dangerJS against 4fedc74

@rosanusi
rosanusi marked this pull request as ready for review June 11, 2026 15:15
@rosanusi
rosanusi requested a review from a team as a code owner June 11, 2026 15:15
@ardiewen
ardiewen merged commit 1fea5d5 into main Jun 17, 2026
19 checks passed
@ardiewen
ardiewen deleted the wcag/2.1.1-fake-button-keypress-to-keydown branch June 17, 2026 19:53
This was referenced Jun 22, 2026
Closed
Merged
laurakwhit added a commit that referenced this pull request Jun 23, 2026
@temporal-cicd @laurakwhit
chore: bump version to 2.51.1 (#3587)
1444580 
Auto-generated version bump from 2.51.0 to 2.51.1

Specific version: 2.51.1

Changes included:
- [`c848ec54`](c848ec5) fix(a11y): announce workflow / event status on timeline graph nodes (WCAG 1.4.1) (#3443)
- [`af6b12a9`](af6b12a) fix(deployments): align version/status/compute badges in worker deployments table (#3489)
- [`df86587c`](df86587) Add SDK version to standalone activity details (#3447)
- [`59695290`](5969529) Use shared FilterBar component for workflows (#3448)
- [`ded94469`](ded9446) Set display contents in wrapper div if no afterLabel in Input component (#3513)
- [`d7e5eb43`](d7e5eb4) fix(standalone-activities): decode failure encodedAttributes in activity detail (#3507)
- [`81a255a9`](81a255a) fix(DT-4151): fix bottom nav scrollability and double-menu on mobile (#3514)
- [`368f646e`](368f646) Fix exports to work properly with vite8 (#3519)
- [`231bdaff`](231bdaf) chore(deps-dev): bump vitest from 3.2.4 to 3.2.6 (#3509)
- [`1de44ea6`](1de44ea) fix(workers): soften no-workers-polling alert for serverless worker deployments (#3524)
- [`689955a8`](689955a) fix(DT-4080): surface error when validate connection has no compute config, warn on set current (#3516)
- [`93323db9`](93323db) feat(DT-4078): Add Set Ramping Version to Worker Deployment Versions (#3508)
- [`9d3450c0`](9d3450c) fix(DT-4081): surface task queue not registered error in validate connection modal (#3517)
- [`b7f56237`](b7f5623) feat(DT-4079): miscellaneous WD UI fixes (#3511)
- [`83b2d4ec`](83b2d4e) feat(deployments): simplify create worker deployment UX (#3518)
- [`ccb4cb73`](ccb4cb7) Standalone Activity write guards (#3534)
- [`ab20ef03`](ab20ef0) Worker insights UI updates (#3520)
- [`aaf63bdc`](aaf63bd) [wcag] Replace text-[12px] with text-xs in DatePicker action buttons (SC 1.4.4) (#3525)
- [`743be902`](743be90) a11y(2.4.3): replace flex-wrap-reverse with flex-wrap on workflow history toolbar (#3527)
- [`41b73e87`](41b73e8) a11y(2.4.2): ui-main — set distinct, descriptive titles on login/signin, task-queues list, and activity-workers sub-tab (#3535)
- [`3d64cdbf`](3d64cdb) [WCAG 2.4.3] group-details-row — remove redundant outer focus stop on <g> wrapper (#3537)
- [`883e5db1`](883e5db) a11y(2.4.6): datepicker — replace empty label with translate('common.start') (#3543)
- [`9da915e2`](9da915e) a11y(2.4.5): import history — add back-link to Import landing page (#3542)
- [`ca4c1d61`](ca4c1d6) Cache new Intl.DateTimeFormat (#3565)
- [`38376e4d`](38376e4) Fix required activity timeout inputs on Start a Standalone Activity form (#3567)
- [`49d7c9e4`](49d7c9e) Use separate copy for title vs menu item (#3568)
- [`3c7dcdc3`](3c7dcdc) a11y(2.5.8): pagination — grow caret buttons from 12×12 to 24×24 CSS px (#3547)
- [`b5171825`](b517182) a11y(2.5.8): chip — pad remove button to 24×24 CSS px minimum (#3544)
- [`1fea5d5c`](1fea5d5) a11y(2.1.1): fake-button widgets — replace deprecated onkeypress with onkeydown handling Enter and Space (#3528)
- [`5bf09000`](5bf0900) a11y(2.1.1): navigation primitives — replace hover-only CSS :after label tooltip with focusable Tooltip (#3529)
- [`deed43f0`](deed43f) a11y(2.1.1): event summary row — add keyboard-accessible expand control alongside the mouse-only <tr onclick> (#3526)
- [`d401123e`](d401123) a11y(2.5.8): checkbox — add min-h-6 min-w-6 to Label for 24×24 hit area (#3545)
- [`aef4166f`](aef4166) [a11y] Expose toggled state via aria-pressed on ToggleButton (#3559)
- [`797f8831`](797f883) Show single attempt in Standalone Activity details (#3572)
- [`893bc58c`](893bc58) feat(DT-4183): Add Tabs (Primitive) (#3574)
- [`323c1993`](323c199) Date picker input field bug/kt (#3522)
- [`3ac34ce2`](3ac34ce) Various serverless UI updates (#3573)
- [`f365416a`](f365416) a11y(2.1.1): ZoomSvg — add keyboard pan/zoom controls so the workflow family tree is operable without a mouse (#3530)
- [`feb6897e`](feb6897) Fix gaps in slot cards on worker details page (#3580)
- [`b3c80072`](b3c8007) Remove font weight on cache size (#3583)
- [`0e7337ea`](0e7337e) Bump API to v1.62.14 (#3575)

Co-authored-by: laurakwhit <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ardiewen ardiewen ardiewen approved these changes

Assignees

No one assigned

Labels

a11y:bucket-3 Bucket 3: engineer required a11y:sc-2.1.1 a11y Accessibility audit PR

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@rosanusi @CLAassistant @ardiewen