WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 13 days ago

Last modified 12 days ago

#52050 closed defect (bug) (fixed)

White TinyMce editor from wp_editor function on a meta box on WP 5.6

Reported by: sweetheatmn Owned by: azaozz
Milestone: Future Release Priority: normal
Severity: major Version: 5.6
Component: Editor Keywords: needs-testing has-patch reporter-feedback
Focuses: Cc:

Description

wp_editor function returns a white TinyMCE that is not responding on metabox when quicktags is disabled or when the default_editor is set to tinyMCE

test code

function wporg_add_custom_box() {
	$screens = [ 'post', 'wporg_cpt' ];
	foreach ( $screens as $screen ) {
		add_meta_box(
				'wporg_box_id',                 // Unique ID
				'Custom Meta Box Title',      // Box title
				'wporg_custom_box_html',  // Content callback, must be of type callable
				$screen                            // Post type
				);
	}
}
add_action( 'add_meta_boxes', 'wporg_add_custom_box' );

function wporg_custom_box_html( $post ) {
	 $args = array('quicktags' => false);
	 wp_editor(  'Welcome to WP'  , 'test-editor', $args );
}

returned editor that does not contain the content or is editable

https://monosnap.com/file/5FY44sq063vHgPMp6Ib50mKGZsTCQx

Expected result: normal TinyMCE editor that contains the content and is editable

Regards,
Atef

Attachments (2)

Capture d’écran 2021-02-13 à 22.27.31.png (56.3 KB) - added by audrasjb 4 months ago.
Apply the example code: the metabox WYSIWYG editor is broken
Capture d’écran 2021-02-13 à 22.27.48.png (70.4 KB) - added by audrasjb 4 months ago.
set SCRIPT_DEBUG constant to true: it works fine 🤔

Download all attachments as: .zip

Change History (26)

#1 @dway
6 months ago

  • Severity changed from normal to major

Same problem here.
Just did a simple metabox with a wp_editor call : no focus inside the editor, in any configuration (teeny or quicktags variations).

This ticket was mentioned in Slack in #core by metalandcoffee. View the logs.


6 months ago

#3 @johnbillion
6 months ago

  • Milestone changed from Awaiting Review to 5.6.1

This ticket was mentioned in Slack in #core by metalandcoffee. View the logs.


5 months ago

This ticket was mentioned in Slack in #core by audrasjb. View the logs.


5 months ago

#6 @audrasjb
5 months ago

  • Milestone changed from 5.6.1 to 5.6.2

Given 5.6.1 is slated to next week, let's move this ticket to 5.6.2 to give it some more time.

#7 @lumpysimon
5 months ago

If there's any chance to get this into 5.6.1 it would be hugely appreciated - this is causing major issues for a couple of clients of mine who have several WYSIWYG editors for various postmeta fields (using CMB2) and the block editor enabled for the main post content.

See https://github.com/CMB2/CMB2/issues/1397

Anyone using CMB2 or similar postmeta plugins who have a WYSIWYG field are going to be affected by this issue.

#8 @audrasjb
5 months ago

  • Keywords needs-patch added

There is still a small chance to get this fixed in 5.6.1, but it will need a patch today.

Anyone interested is welcome to work on a patch and to upload it in this ticket.

I'm leaving the ticket in the next point release for now, waiting for a first patch.

#9 @jeremycaris
5 months ago

I posted about this on Stack Exchange before I realized it was a WordPress 5.6 issue. In a comment, someone noted that if you install the Enable jQuery Migrate Helper plugin, this issue is resolved. I can confirm that it does resolve the issue.

The plugin downgrades jQuery to the version that was previously included in Wordpress 5.5. Or, if you install the Classic Editor plugin (which disables Gutenberg) the metaboxc issue is resolved also.

Hopefully, this helps someone isolate the bug to create a patch.

https://wordpress.stackexchange.com/questions/382306/wp-editor-visual-tab-in-meta-box-doesnt-show-content/382310#382310

Last edited 5 months ago by jeremycaris (previous) (diff)

#10 @audrasjb
4 months ago

Hi,

Looking at this issue again and doing some tests, I went to a very strange behavior: using the wp_editor function usage provided in the ticket description, I can reproduce the issue on the wp_editor added in the meta box. But there is a strange fact: if I set SCRIPT_DEBUG constant to true, the issue is fixed… 🤯

@audrasjb
4 months ago

Apply the example code: the metabox WYSIWYG editor is broken

@audrasjb
4 months ago

set SCRIPT_DEBUG constant to true: it works fine 🤔

#11 @desrosj
4 months ago

  • Component changed from General to Editor
  • Milestone changed from 5.6.2 to Future Release

5.6.2 RC is going to be packaged in a few hours. Since this one still requires some investigation and lacks a patch, I'm going to punt to Future Release.

#12 @dway
4 months ago

Hope this will addressed soon !

#13 @dway
4 months ago

  • Severity changed from major to critical

Any update on this ?
5.7 is coming and it seems that's not planned to it.
Lots of wordpress site blocked in 5.5.3 so far until this bug is resolved.
On my side, I can't debug this, I'm not familiar with TinyMCE...

Last edited 4 months ago by dway (previous) (diff)

#14 @dway
4 months ago

Further tests show that wpeditor is initialised correctly when inserted in a taxonomy term form, in 5.6 and 5.7, so the problem is really limited to wpeditor in a metabox below the blocks editor.

I thought it was a problem of mis-loading or mis-init, so I try to insert a classic editor as a block, saved the content, and reload the page.
The wpeditor in the metabox still does not init totally and we can't write in it.

Last edited 4 months ago by dway (previous) (diff)

#15 @dway
4 months ago

  • Keywords needs-testing added

#16 @audrasjb
4 months ago

  • Milestone changed from Future Release to 5.8
  • Severity changed from critical to normal

Hello,

5.7 is coming and it seems that's not planned to it.

Yes I can confirm this is not going to be addressed in WP 5.7. It still needs a patch. Everyone is welcome to jump on this issue and to propose a first patch to help it to move forward.

Moving this to milestone 5.8, but removing critical workflow keyword as it doesn't look to be globally reported in the support forums.

#17 @dway
4 months ago

Yes I can confirm this is not going to be addressed in WP 5.7. It still needs a patch. Everyone is welcome to jump on this issue and to propose a first patch to help it to move forward.

Unfortunatly Gutenberg and JS stuff are not my area of work, I can't debug that :'(

as it doesn't look to be globally reported in the support forums.

Yes @audrasjb I can understand that it's an edge case. But this is still a regression since 5.5, and authors of this may be warned. Using a tiny wpeditor in metabox is a common case in many plugins, and thousands of website may face this bug. But sadly, a few knows how to report this here in my opinion : I know a lot of people impacted, just users, no developpers.

Do you know people that may be warned for this ticket to look more deeply ?

Besides, I think this should be a major severity

#18 @mkdgs
3 months ago

  • Severity changed from normal to major

Configuring SCRIPT_DEBUG does not fix this bug for me.
(Sometimes that's appears randomly when the inspector is open.)
There is a race condition, i tried to identify the origin without success.
I don't have time to go any further, but I have a workaround below.

<?php
/*
* Fix blank editor (dirty hack)
* https://core.trac.wordpress.org/ticket/52050
* use wp_editor_fix(..) instead wp_editor(...)
*/
function wp_editor_fix($content, $editor_id, $settings = array() )
{      
    ob_start();
    wp_editor($content, $editor_id, $settings);
    $out = ob_get_contents();
    $js = json_encode($out);
    $id_editor_ctn  = $editor_id.'-ctn';
    ob_clean(); ?>
    <div id="<?php echo $id_editor_ctn?>"></div>
    <script>
    setTimeout(function() {
            // inject editor later
            var id_ctn = '#<?php echo $id_editor_ctn?>';
            jQuery(id_ctn).append(<?php echo $js?>); 
            // init editor
            setTimeout(function() {
                // find the editor button and simulate a click on it
                jQuery('#<?php echo $editor_id ?>-tmce').trigger('click');
            },   10);
    }, 50);
    </script>
    <?php
    $out = ob_get_contents();
    ob_end_clean();
    echo $out;
}

This inject and init the editor later in the dom.

Last edited 3 months ago by mkdgs (previous) (diff)

This ticket was mentioned in Slack in #core-test by hellofromtonya. View the logs.


5 weeks ago

#20 @JeffPaul
3 weeks ago

  • Milestone changed from 5.8 to Future Release

With 5.8 Beta 1 next week and no patch/PR on this ticket, I'm going to punt this to Future Release. Once a patch/PR is available this ticket can be added back to a numbered milestone.

#21 @azaozz
2 weeks ago

Been looking at this for a while. Thinking the cause is the same as in #52111. Please test whether https://core.trac.wordpress.org/attachment/ticket/52111/52111.diff fixes it.

#22 @azaozz
2 weeks ago

  • Keywords has-patch reporter-feedback added; needs-patch removed

#23 @azaozz
13 days ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In 51082:

TinyMCE: Fix initialization when the editor is in a postbox by delaying it until document.readyState === 'complete'.

Props metalandcoffee, desrosj, patkemper, herrvigg, spikeuk1, dway, mkdgs, azaozz.
Fixes #52133, #52050.

#24 @azaozz
12 days ago

In 51085:

TinyMCE: Don't attempt to initialize the same instance twice. Follow up to [51082].

See #52133, #52050.

Note: See TracTickets for help on using tickets.