marcel/familienarchiv
1
0
Fork 0
Code Issues 120 Pull Requests 1 Actions 1 Packages Projects Releases Wiki Activity

fix(journey-editor): clear liveAnnounce 500ms after move; document svelte-ignore suppressions
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 3m26s
Details
CI / OCR Service Tests (pull_request) Successful in 22s
Details
CI / Backend Unit Tests (pull_request) Successful in 3m49s
Details
CI / fail2ban Regex (pull_request) Successful in 45s
Details
CI / Semgrep Security Scan (pull_request) Successful in 23s
Details
CI / Compose Bucket Idempotency (pull_request) Successful in 1m5s
Details

Browse Source 
NVDA+Chrome and VoiceOver+Safari can re-announce a persistent non-empty
aria-live region when adjacent DOM mutations occur. Clearing with a
500ms delay gives the announcement time to fire once before going quiet.

The two svelte-ignore a11y_no_static_element_interactions suppressions are
given preceding comments explaining the keyboard accessibility contract so
they are not mistaken for unaddressed tech debt.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-06-09 16:47:30 +02:00
parent dfc065b727
commit 4572572c94
1 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/lib/geschichte/JourneyEditor.svelte
View File

@@ -155,6 +155,10 @@ async function handleMoveUp(index: number) {
newPosition: index newPosition: index
}); });
await handleReorder(ids); await handleReorder(ids);
// Clear so the live region does not re-announce on unrelated DOM mutations
setTimeout(() => {
liveAnnounce = '';
}, 500);
} }
async function handleMoveDown(index: number) { async function handleMoveDown(index: number) {
@@ -167,6 +171,10 @@ async function handleMoveDown(index: number) {
newPosition: index + 2 newPosition: index + 2
}); });
await handleReorder(ids); await handleReorder(ids);
// Clear so the live region does not re-announce on unrelated DOM mutations
setTimeout(() => {
liveAnnounce = '';
}, 500);
} }
async function save(nextStatus: 'DRAFT' | 'PUBLISHED') { async function save(nextStatus: 'DRAFT' | 'PUBLISHED') {
@@ -237,6 +245,7 @@ async function save(nextStatus: 'DRAFT' | 'PUBLISHED') {
</p> </p>
{/if} {/if}
<!-- pointer events managed by createBlockDragDrop; keyboard reorder available via move-up/down buttons on each item -->
<!-- svelte-ignore a11y_no_static_element_interactions --> <!-- svelte-ignore a11y_no_static_element_interactions -->
<div <div
bind:this={listEl} bind:this={listEl}
@@ -248,6 +257,7 @@ async function save(nextStatus: 'DRAFT' | 'PUBLISHED') {
<p class="font-sans text-sm text-ink-3">{m.journey_empty_state()}</p> <p class="font-sans text-sm text-ink-3">{m.journey_empty_state()}</p>
{/if} {/if}
{#each items as item, i (item.id)} {#each items as item, i (item.id)}
<!-- pointerdown initiates drag; the drag handle button inside is the semantic interactive element -->
<!-- svelte-ignore a11y_no_static_element_interactions --> <!-- svelte-ignore a11y_no_static_element_interactions -->
<div <div
data-block-wrapper data-block-wrapper