a11y(2.1.1): event summary row — add keyboard-accessible expand control alongside the mouse-only <tr onclick> by rosanusi · Pull Request #3526 · temporalio/ui

rosanusi · 2026-06-10T21:03:43Z

Description & motivation 💭

In the workflow event history, each event row toggles an inline EventDetailsFull panel via a click handler on the <tr>. The only focusable elements inside the row were <Link> components that call stopPropagation, making the expand toggle unreachable by keyboard.

This PR adds a dedicated expand <button> (via IconButton) as the row's leading cell, wired to the same onLinkClick handler with aria-expanded and aria-controls semantics. Keyboard users now have full feature parity with mouse: Tab to the chevron button, press Enter/Space to expand/collapse EventDetailsFull inline without losing surrounding history context.

The <tr onclick> mouse path is fully preserved — this PR adds the keyboard path, it does not remove the mouse path.

SC: 2.1.1 Keyboard (Level A) — current verdict: Fails → Supports

Screenshots (if applicable) 📸

No visual change at default state. Chevron button appears as the first cell of each event row; icon flips between chevron-down (collapsed) and chevron-up (expanded).

Design Considerations 🎨

The 8px leading <td> is consistent with the existing table cell sizing. Uses the existing IconButton Holocene primitive — no new design tokens.

Testing 🧪

How was this tested 👻

Manual testing

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

Open any workflow's event history view.
Tab into the table — confirm the first focus stop per row is the chevron expand button.
Press Enter on a focused expand button — confirm EventDetailsFull renders below and focus stays on the button.
Press Space on the focused button — confirm the panel collapses and focus stays on the button.
Tab again — confirm the next stop is the event-ID <Link> inside the same row, not the next row's button.
Click the row body (not the button or a link) — confirm the panel still toggles via the <tr onclick> mouse path.
Click the expand button with the mouse — confirm the panel toggles exactly once (no double-fire from the stopPropagation logic).
VoiceOver smoke test: focus the button, confirm announcement is Expand details, collapsed, button; after Enter, confirm Collapse details, expanded, button.
axe-core on a workflow detail page: zero new violations; aria-controls reference resolves when expanded.

Checklists

Draft Checklist

VoiceOver / NVDA smoke test
axe-core run on workflow event history page

Merge Checklist

Screen reader announcement verified
axe-core: zero new violations
Regression: onRowClick still fires for both mouse-on-row and keyboard-on-button paths

Issue(s) closed

Closes finding #6 from the 2.1.1 audit (audit-output/issues/2.1.1-keyboard-audit.md).

Docs

Any docs updates needed?

No doc changes needed.

A11y-Audit-Ref: 2.1.1-event-summary-row-expand

vercel · 2026-06-10T21:03:50Z

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

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

CLAassistant · 2026-06-10T21:03:50Z

All committers have signed the CLA.

temporal-cicd · 2026-06-10T21:05:13Z

@@ -169,11 +170,14 @@
    $timestamp(currentEvent?.eventTime, { format: 'short' }),
  );



⚠️ Parameter 'event' implicitly has an 'any' type.

temporal-cicd · 2026-06-10T21:05:14Z

	Warnings
⚠️	📊 Strict Mode: 5 errors in 1 file (0.6% of 906 total) src/lib/components/event/event-summary-row.svelte (5) L135:6: Argument of type 'string \| undefined' is not assignable to parameter of type 'string'. L172:23: Parameter 'event' implicitly has an 'any' type. L187:30: Parameter 'group' implicitly has an 'any' type. L187:37: Parameter 'hoveredEventId' implicitly has an 'any' type. L337:16: Type 'ITimestamp \| null \| undefined' is not assignable to type 'ITimestamp'.

Generated by 🚫 dangerJS against 3f7ce2a

ardiewen · 2026-06-17T18:42:26Z

@rosanusi There's significant layout shift as a result of this:

Are you intending for the expand carat to be a permanent visible fixture for sighted users as well?

ardiewen · 2026-06-17T18:48:35Z

Is this perhaps better? Instead of adding a column for the new expand button, we're could insert the button into the existing column for Event ID with 4px gap:

The <tr onclick> was the only path to toggle EventDetailsFull; keyboard users had no way to expand a row in place without leaving the event history. Adds a leading IconButton (chevron) per row wired to the same handler with aria-expanded / aria-controls semantics, giving keyboard and mouse parity. Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

…olumn The initial approach added a dedicated leading <td> for the chevron, but the event summary table's header (event-summary-table columns array) and its pending-activity/pending-nexus row components were not given a matching column, so every column misaligned and the expanded-row colspan had to be bumped. Per design, move the chevron IconButton into the existing first (Event ID) cell via a shared {#snippet}, used by both the event-group and single-event branches. This adds no column, so the header, pending rows, and colspan are all unchanged (colspan reverted to the original $isCloud ? 5 : 4). Keyboard semantics (aria-expanded/aria-controls + Enter/Space via IconButton) are preserved, and the button is sized h-6 w-6 so it doesn't grow the compact row height. Co-Authored-By: Claude Opus 4.8 (1M context) <[email protected]>

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]>

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

vercel Bot deployed to Preview June 10, 2026 21:04 View deployment

temporal-cicd Bot reviewed Jun 10, 2026

View reviewed changes

rosanusi marked this pull request as ready for review June 11, 2026 15:00

rosanusi requested a review from a team as a code owner June 11, 2026 15:00

vercel Bot deployed to Preview June 17, 2026 21:18 View deployment

ardiewen approved these changes Jun 17, 2026

View reviewed changes

rosanusi and others added 2 commits June 17, 2026 17:22

ardiewen force-pushed the wcag/2.1.1-event-summary-row-expand branch from a43a71c to 3f7ce2a Compare June 17, 2026 21:22

vercel Bot deployed to Preview June 17, 2026 21:23 View deployment

ardiewen merged commit deed43f into main Jun 17, 2026
18 checks passed

ardiewen deleted the wcag/2.1.1-event-summary-row-expand branch June 17, 2026 22:16

This was referenced Jun 22, 2026

chore: bump version to 2.52.0 #3586

Closed

chore: bump version to 2.51.1 #3587

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

a11y(2.1.1): event summary row — add keyboard-accessible expand control alongside the mouse-only <tr onclick>#3526

a11y(2.1.1): event summary row — add keyboard-accessible expand control alongside the mouse-only <tr onclick>#3526
ardiewen merged 2 commits into
mainfrom
wcag/2.1.1-event-summary-row-expand

rosanusi commented Jun 10, 2026

Uh oh!

vercel Bot commented Jun 10, 2026 •

edited

Loading

Uh oh!

CLAassistant commented Jun 10, 2026 •

edited

Loading

Uh oh!

temporal-cicd Bot Jun 10, 2026

Uh oh!

temporal-cicd Bot commented Jun 10, 2026 •

edited

Loading

Uh oh!

ardiewen commented Jun 17, 2026

Uh oh!

ardiewen commented Jun 17, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		@@ -169,11 +170,14 @@
		$timestamp(currentEvent?.eventTime, { format: 'short' }),
		);

Uh oh!

Conversation

rosanusi commented Jun 10, 2026

Description & motivation 💭

Screenshots (if applicable) 📸

Design Considerations 🎨

Testing 🧪

How was this tested 👻

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

Checklists

Draft Checklist

Merge Checklist

Issue(s) closed

Docs

Any docs updates needed?

Uh oh!

vercel Bot commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

CLAassistant commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

temporal-cicd Bot Jun 10, 2026

Choose a reason for hiding this comment

Uh oh!

temporal-cicd Bot commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ardiewen commented Jun 17, 2026

Uh oh!

ardiewen commented Jun 17, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

vercel Bot commented Jun 10, 2026 •

edited

Loading

CLAassistant commented Jun 10, 2026 •

edited

Loading

temporal-cicd Bot commented Jun 10, 2026 •

edited

Loading