TinyMCE JavaScript editor is broken in 4.7

[argonius]

TinyMCE JavaScript editor API does not work as expected in 4.7. It works in 4.6.

Steps to reproduce:

1. Add following code to your admin panel:

function my_editor(){
	wp_editor( '', 'myeditor', array(
	    'textarea_name' => 'mytextarea'
	) );
}
add_action( 'admin_head', 'my_editor' );

2. Open browser's console and type in:

tinyMCE.activeEditor

Expected: Returns JavaScript object (like in 4.6)
Actual: Returns null

Note: You can also test with tinyMCE.editors, it's empty array in 4.7 e.g. "[]", but it should contain 1 item.

[argonius]

Plugin for testing this issue. Activate the plugin and open browser's console to test

[argonius]

From the latest testing, there is a different scenario to reproduce. It is reproducible in both 4.6 and 4.7 in the following conditions:

--- Working scenario

1. Click on edit button on any post.
2. Make sure to select "Visual" tab option on the top right corner of the editor
3. Open browser's console and type in "tinyMCE.activeEditor", it's set correctly
4. Refresh page, tinyMCE.activeEditor is still OK

--- Continue to reproduce the Issue

5. Click on "Text" tab option on the top right corner
6. tinyMCE.activeEditor is still OK
7. Refresh the page
8. tinyMCE.activeEditor is null (Issue)

The problem happens when you load the page with text editor, after you have pre-selected mode to "Text" in previous page load.

Please disregard the attached plugin, since it can be reproduced in both WP versions.

[azaozz]

The problem happens when you load the page with text editor, after you have pre-selected mode to "Text" in previous page load.

When the Text editor loads first, TinyMCE is not initialized until the user switches to Visual. This has always worked that way, hasn't changed since 2.5 (or even earlier).

It is done that way because:

• There is no good way to initialize TinyMCE "hidden". There is always a flicker and some delay on page load. Also often there are errors in certain browsers with some components like iframes in wpviews, etc.
• The page loads faster when the initialization of TinyMCE is postponed (despite that it is usually loaded in the footer).

I'm not sure what you need to do on loading the editor but there are few different custom events you can use. One is tinymce.on( 'addEditor', function( event ) { var editor = event.editor... the other is WordPress specific $( document ).on( 'tinymce-editor-init', function( editor ) { ....

[argonius]

That makes sense, thanks for clarifications.

I found an alternative solution that allows me to force TinyMCE view by default, but it's just a hack:

if(!tinyMCE.activeEditor)jQuery('.wp-editor-wrap .switch-tmce').trigger('click');

It would be more convenient to have methods on TinyMCE object for checking current view state, as well as support for switching to a desired state programmatically. If you think that this might be a good idea for improvement, it would be nice to have another ticket for that, otherwise, I'm fine to close this one.

Thanks for the help!

[azaozz]

There are already quite a few ways. Which editor loads first is controlled by the editor user setting. You can change/override it before TinyMCE is initialized:

window.setUserSetting( 'editor', 'tinymce' );

Once it is initialized, you can do editor.isHidden() to see which is currently being used.