WCAG 2.2 AA accessibility audit — deduplication queue
epic-duplicate-activity-detection-ui-task-013 — Audit and remediate DeduplicationQueueScreen and its detail view for WCAG 2.2 AA compliance. Ensure list items have descriptive semantic labels including both activity dates and participant names, filter controls are keyboard and screen-reader navigable, resolution action buttons announce their outcomes, and the badge count is announced as a live region when it changes.
Acceptance Criteria
Technical Requirements
Execution Context
Tier 7 - 84 tasks
Can start after Tier 6 completes
Implementation Notes
For list item semantics, wrap each DuplicateQueueListItemCard in a Semantics widget with a hand-crafted label string built from the pair data: avoid MergeSemantics if child widgets contain redundant or confusing text that should be excluded — explicit label is more reliable. Use a value callback pattern: semanticsLabel: _buildPairLabel(pair) where _buildPairLabel is a pure function testable in isolation. For filter controls, add a Semantics value: parameter reflecting the current selection alongside the label — e.g., Semantics(label: 'Status filter', value: 'Unresolved', child: ...). For the result count live region, emit count updates through a Riverpod/BLoC state field and render it in a visually hidden (zero-size) Semantics widget with liveRegion: true positioned at the top of the list.
For non-color diff indicators in DuplicateComparisonPanel, add a small Icon(Icons.edit, size: 12) or FontWeight.bold to differing fields — this satisfies WCAG 1.4.1 Use of Color without being visually intrusive. Coordinate with the task-009 implementer to ensure the badge liveRegion is already in place before this task marks the badge audit as complete.
Testing Requirements
Flutter widget tests must: assert each list item's merged semantics node contains date strings and participant name strings; assert filter chip semantics includes current selected value; assert resolution buttons contain consequence phrases in their labels; assert badge semantics node has liveRegion flag and label includes count. Use tester.pumpWidget, tester.getSemantics, and find.bySemanticsLabel for coverage. Verify MergeSemantics suppresses child nodes using SemanticsController.nodesWith. For non-color diff: golden test or widget test confirming a non-color indicator (icon or font weight) is present on differing fields.
Manual checklist must include: linear navigation order test (swipe through entire list without losing context); filter result count announcement test; badge change announcement test; full resolution flow narration test from list item to action confirmation.
The merge resolution path requires identifying which fields from the draft differ from the existing record, applying those differences to the existing record, and cancelling the draft — all as an atomic operation. Partial failures (e.g., update succeeds but draft cancellation fails) could leave the system in an inconsistent state.
Mitigation & Contingency
Mitigation: Implement the merge path as a Supabase RPC transaction that updates the existing record and soft-deletes the draft in a single atomic call. The DuplicateResolutionHandler should never attempt field-level merge at the application layer.
Contingency: If the atomic RPC approach proves too complex for the initial release, simplify the merge path to: mark existing record as the canonical record and cancel the new submission without field merging, displaying a message to the user to manually verify the existing record's fields. Log a follow-up ticket for full field-merge in a later sprint.
The DuplicateWarningBottomSheet must intercept the activity wizard's save action without disrupting the wizard's existing navigation stack. If the bottom sheet is implemented as a separate route rather than an overlay, back navigation could break the wizard's step state.
Mitigation & Contingency
Mitigation: Use a `showModalBottomSheet` overlay pattern so the bottom sheet sits above the wizard route without pushing a new route onto the Navigator stack. The wizard's CuBit/BLoC retains all draft state while the sheet is visible. Test this integration with the existing activity-registration-cubit before merging.
Contingency: If the overlay approach causes Z-order or focus issues with the wizard's keyboard-aware layout, route the duplicate check result back to the wizard as a state event (DuplicateDetected), and let the wizard render a local inline warning banner instead of a bottom sheet.
The bottom sheet and comparison panel involve complex layouts with multiple interactive elements. Screen reader users (particularly relevant for Blindeforbundet) may struggle with the side-by-side comparison layout if semantics are not carefully ordered.
Mitigation & Contingency
Mitigation: Design the comparison panel with a single-column semantic order (read record A fully, then record B fully) regardless of visual layout. Use Flutter's `Semantics` widget with `sortKey` to enforce correct traversal order. Test with TalkBack and VoiceOver against the WCAG 2.2 AA reading order criteria.
Contingency: If side-by-side layout cannot achieve acceptable screen reader ordering, switch to a stacked tab layout (Tab A / Tab B) for the comparison panel that is semantically simple even if less visually immediate for sighted users.