Classic editor: Firefox - Full height editor button not loading in the editor

[robertghetau]

Coming from here: ​https://github.com/Automattic/wp-calypso/issues/97205

1. Edit a post in the classic editor using Firefox.
2. Enable the Enable full-height editor and distraction-free functionality option in the Screen Options.
3. The icon to enter distraction-free writing mode will not appear.

PS: This will only occur if you load the "Add a new posts" page and if you have "Visual" selected in the editor. Refreshing the post while having "Text" toggled will display the icon on the "Visual" tab too.

[sainathpoojary]

Reproduction Report

Description

This report validates whether the issue can be reproduced.

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.26
• Server: nginx/1.27.3
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.26)
• Browser: Firefox 134.0
• OS: macOS
• Theme: Twenty Nineteen 3.0
• MU Plugins: None activated
• Plugins: Classic Editor 1.6.6

Actual Results

✅ Error condition occurs.

Supplemental Artifacts

[sainathpoojary]

Hey @robertghetau,

Additionally, I was able to replicate this issue in Chrome while using WordPress 6.7.1.

Environment

• WordPress: 6.7.1
• PHP: 8.1.29
• Server: nginx/1.16.0
• Database: mysqli (Server: 8.0.16 / Client: mysqlnd 8.1.29)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Five 1.0
• MU Plugins: None activated
• Plugins: Classic Editor 1.6.7

[sainathpoojary]

I investigated the root cause of this issue further and found that it occurs because the tinymce-editor-setup event listener is not registered before the event gets triggered. You can refer to the relevant code at this two places:

https://core.trac.wordpress.org/browser/trunk/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L21
https://core.trac.wordpress.org/browser/trunk/src/js/_enqueues/wp/editor/dfw.js#L1468

In contrast, when switching to text mode and then navigating back to visual mode, the behavior is different. While in text mode, dfw.js is called, which registers the tinymce-editor-setup event listener. Subsequently, when switching back to visual mode, the event listener is already registered, and triggering the event successfully adds the DFW button.

A potential solution could involve ensuring that the event is registered before it is triggered or delaying the trigger until the registration is complete.

I would greatly appreciate any input or suggestions to resolve this further. I also reviewed script-loader.php but could not identify anything relevant there.

I have attached the video showing the event trigger delay:
Chrome: ​https://utfs.io/f/PL8E4NiPUWyOh3jgvm006Edx2tfphuaYK5oLsA9IcTvyjC8N
Firefox: ​https://utfs.io/f/PL8E4NiPUWyOPSGLHEiPUWyOpNe2J5st06zudQZVDoClH7jb