VoiceOver cursor does not follow keyboard focus when Shift+Tab moves to a focusable parent

Accessibility & Inclusion General
kingaguspiel OP
Created
Replies 2
Boosts 0
Views 2.3k
Participants 2

On macOS, when navigating backwards with Shift+Tab from a focusable descendant to its focusable parent container, browser keyboard focus moves correctly, but the VoiceOver cursor remains on the descendant. document.activeElement confirms that the parent container has received focus, and the browser displays its focus indicator. However, VoiceOver continues to announce and visually indicate the previously focused descendant. The issue is reproducible:

The same navigation works correctly with NVDA on Windows: both keyboard focus and the screen reader cursor move to the parent.

Expected result: When Shift+Tab moves keyboard focus to the parent container, the VoiceOver cursor should follow and announce that container.

Actual result: Keyboard focus moves to the parent, but the VoiceOver cursor remains on the previously focused descendant.

Environment:

  • macOS 27.0.1 (26A434)
  • Safari 27.0.1
  • Chrome 155.0.8059.80
  • Firefox 133.0

Reported through Feedback Assistant as FB25212861

Replies  2
Boosts 0
Views  2.3k
Participants  2
Pokpong OP

Thanks for the detailed repro, especially confirming it with the ARIA APG Feed example. Since document.activeElement and the visible focus ring move but VoiceOver's cursor doesn't, this looks like a mismatch between web focus and VoiceOver's reading cursor.

I don't know of a supported web API to move VoiceOver's cursor, so I wouldn't try to force it from page script. A minimal HTML repro from the APG example, including the parent markup and whether Quick Nav changes the result, would be useful alongside FB25212861. That can help show whether this is tied to one focus pattern or reproduces more generally.
kingaguspiel OP

Thanks for confirming that there is no supported web API for moving the VoiceOver cursor. I agree that forcing another focus change from page script would be unreliable and could introduce additional accessibility issues.

Below is a minimal HTML reproduction containing only the focusable parent and child elements. Testing this example confirms that, after Shift+Tab, keyboard focus moves to the parent but the VoiceOver cursor remains on the child. The issue reproduces with Quick Nav both disabled and enabled.

I’ll also add the reproduction to FB25212861, along with a screen recording.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>VoiceOver reverse focus reproduction</title>
        <style>
            body {
                max-width: 48rem;
                margin: 2rem auto;
                padding: 0 1rem;
                font: 1rem/1.5 system-ui, sans-serif;
            }

            article {
                margin: 2rem 0;
                padding: 1rem;
                border: 2px solid #777;
            }

            :focus-visible {
                outline: 4px solid #075ad7;
                outline-offset: 4px;
            }
        </style>
    </head>
    <body>
        <main>
            <h1>VoiceOver reverse focus reproduction</h1>

            <button type="button">Element before the example</button>

            <article id="focusable-parent" tabindex="0" aria-labelledby="parent-heading">
                <h2 id="parent-heading">Focusable parent</h2>
                <p>This article has <code>tabindex="0"</code> and contains a focusable link.</p>
                <a id="child-link" href="#after-example">Skip to after the example</a>
            </article>

            <button id="after-example" type="button">Element after the example</button>
        </main>
    </body>
</html>