• Success Criterion 3.2.1
  • Conformance level A

Keyboard Focus Triggering an Unexpected Scroll Jump

3.2.1 — On Focus

Scenario

Setting

A podcast app's episode list

What’s wrong

Focus triggering scroll-jacking that relocates the user to a different section (context change).

Example 

episodeLink.addEventListener('focus', () => {
  document.getElementById('now-playing').scrollIntoView();
});

Why it matters

Tabbing to any episode link yanks the whole page down to the Now Playing bar, so a listener browsing episodes loses their place in the list on every tab press.

How to test

Tab to an element and stop: if the page scroll-jacks to a different section automatically, it fails.

How to fix

Remove the focus-triggered scrollIntoView entirely, or only scroll on an explicit user action like clicking "Now Playing". Scroll position changes on focus count as a context change; reserve scrollIntoView for deliberate navigation, not passive tabbing.

Outcome

A listener tabs through the full episode list without the page jumping away from them.

Who is affected

Keyboard users trying to scan a long episode list get repeatedly relocated and can't build a mental map of where they are.

Learn more

Related scenarios