Site Editor: Edit view initial focus: tab sequence should start from the document root

[afercia]

Description

In the Site editor, when switching from the 'view' mode to the 'edit' mode, initial focus is still on the editor canvas iframe. At this point, pressing the Tab key starts the tab sequence from the first block in the editor.

I'm not sure this is a good experience for keyboard users. The Tab sequence should start from the document root, as that's the most expected behavior.

Worth noting that in WordPress 6.1, before the introduction of the 'view' mode, initial focus was programmatically set on the 'Toggle navigation' site icon button.

Step-by-step reproduction instructions

• Go to the Site editor.
• Navigate the UI with the Tab key.
• Once the editor canvas iframe is focused, press Enter.
• The editor switches to 'edit' mode.
• Press the Tab key.
• Observe that focus lands on the first block within the editor.

Screenshot:

Test dumping the activeElement to the console:

• Go to the Site editor.
• Open your browser dev tools console.
• Navigate the UI with the Tab key.
• Once the editor canvas iframe is focused, enter document.activeElement in the console.
• Observe the active element is the iframe.
• Enter document.activeElement.click() in the console.
• The editor switches to 'edit' mode.
• Enter document.activeElement in the console.
• Observe the active element is still the iframe.

However, at this point new sections of the UI are rendered around the iframe e.g.: the top bar, the sidebar... as such:

• sighted keyboard users will need to tab backwards to go to the top bar.
• screen reader users may not be aware that there's now a new UI section before the currently focused element.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[afercia]

In WordPress 6.1., initial focus was set to the 'Toggle navigation' button, which was the first focusable control in the UI: