Top editing bar inaccessible with Distraction-Free mode enabled in Site Editor

[cuemarie]

Quick summary

When you enable Distraction-Free mode in the page/post editor, you can access the top editing bar tools (including the options menu to disable it again) by hovering at the top of the page.

In the Site Editor, the top bar does not reappear when you hover at the top of the editor, making it difficult to exit distraction-free mode or use any tools.

Steps to reproduce

1. Open Site Editor > Template
2. Options > Enable Distraction-Free mode
3. hover near top of page

What you expected to happen

What actually happened

Impact

Most (> 50%)

Available workarounds?

Yes, easy to implement

Platform (Simple and/or Atomic)

Simple, Atomic

Logs or notes

Workarounds: Shortcuts (CTRL + Shift + \ on Windows, and SHIFT + COMMAND + \ on MacOS) work in the meantime, or exiting the editor to browse mode, then re-entering the template

Customer report: 8322202-zen

[github-actions]

Support References

This comment is automatically generated. Please do not edit it.

• 8322202-zen

[mrfoxtalbot]

I can replicate this and I can confirm it is NOT happening on a self-hosted site.

Could someone from @Automattic/lego help us triage this? Thank you!

[taipeicoder]

Thanks for the ping @mrfoxtalbot!
I can reproduce this on my end. Let me add this to the Lego backlog and triage this.

[taipeicoder]

@mrfoxtalbot I was able to reproduce this issue with a JN running Gutenberg 18.5. Upgrading to 18.6 fixes this issue, I verified it on an Atomic site.

Could you confirm if upgrading Gutenberg to 18.6 fixes this issue?

[mrfoxtalbot]

It does, thank you!

Kapture.2024-06-21.at.12.33.57.mp4