Iframe: Body tag can receive negative tabindex impacting screen reader A11Y

[alexstine]

Description

When I enter the block toolbar and return from it, the screen reader reads all blocks in the block list until it reaches the focus point of the selected block. This is because the focus passes through a tabindex="-1" on the body tag of the iFrame.

I have a feeling removing this attribute may not be straight forward. Could be tied in with writing flow and it is also possible that removing the attribute could break focus styles inside the body tag.

Step-by-step reproduction instructions

1. Start a screen reader such as NVDA on Windows.
2. Open the site editor.
3. Select a block, second or third one in the list should do.
4. Press shift+tab to focus the block toolbar.
5. Press tab to focus the current block.
6. Notice how the first blocks are read by the screen reader until the block you currently have focus on is reached.

I believe this generally happens because tabindex="-1" is not a tabbable index. The screen reader has no choice but to enter it because the content within is tabbable but it likely gets confused. You can always focus -1 but not tab to it.

Screenshots, screen recording, code snippet

No response

Environment info

Gutenberg: trunk
Browser: Firefox/Google Chrome
Screen reader: NVDA
OS: Windows 10

Probably able to reproduce in other environments as well.

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