Site editor: The preview frame can have edits triggered by keyboard

[stokesman]

Description

In the Site editor tabbing through the interface can focus the site preview and while focused the keyboard can be used to “Select All” and the the block toolbar is accessible and edits can be made. There may be other ways keyboard use can trigger edits too.

The cause of this is the writing flow hook is active so the when the body of the iframe has focus there is the potential to trigger its behaviors.

Step-by-step reproduction instructions

1. Open the Site editor
2. Tab to the preview frame
3. Use the “Select all” shortcut
4. Press Shift tab to focus the block toolbar
5. Use arrow keys to navigate the block toolbar
6. Trigger an edit of some kind

Screenshots, screen recording, code snippet

site-editor-preview-unintended-keyboard-editable.mp4

Environment info

• WP 6.7.1 with Gutenberg plugin at trunk
• Chrome
• macOS

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure