[wp-trac] [WordPress Trac] #19173: Issues with wp_editor() when used inside of a meta box.

[WordPress Trac]

#19173: Issues with wp_editor() when used inside of a meta box.
--------------------------+-----------------------------
 Reporter:  goto10        |      Owner:
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:  Awaiting Review
Component:  Editor        |    Version:  3.3
 Severity:  normal        |   Keywords:
--------------------------+-----------------------------
 I ran into a couple of obscure issues when adding an editor inside of a
 meta box.  Errors are generated when moving the meta box around and then
 switching between the Visual and HTML editors. Also, the resize handle
 (.mceResize) is a bit too low when viewing the Visual tab when our custom
 editor has been added within a meta box. Tested in FF7 7.0.1 WPv3.3beta2

 I'm adding the Editor within a meta box because it's the easiest way to
 add an Editor field type within the meta box/ CPT plugin I've made. It
 seems like it will be a common use case.

 Here's a simple plugin that adds an editor within a meta box.

 {{{
 <?php
 /**
  * Plugin Name: WP Editor in a Meta Box
  * Plugin URI:
  * Description: Demonstration of WP Editor in a meta box.
  * Version: 1.0
  * Author: goto10
  * Author URI:
  * License:
  */

 // file name: wp_editor-in-meta-box-test.php

 /* Meta box code based on
 http://codex.wordpress.org/Function_Reference/add_meta_box */

 /* Define the custom box */
 add_action( 'add_meta_boxes', 'myplugin_add_custom_box' );

 /* Do something with the data entered */
 add_action( 'save_post', 'myplugin_save_postdata' );

 /* Adds a box to the main column on the Post and Page edit screens */
 function myplugin_add_custom_box() {
         add_meta_box( 'wp_editor_test_1_box', 'WP Editor Test #1 Box',
 'wp_editor_meta_box' );
 }

 /* Prints the box content */
 function wp_editor_meta_box( $post ) {

   // Use nonce for verification
   wp_nonce_field( plugin_basename( __FILE__ ), 'myplugin_noncename' );

         $field_value = get_post_meta( $post->ID, '_wp_editor_test_1',
 false );
         wp_editor( $field_value[0], '_wp_editor_test_1' );
 }

 /* When the post is saved, saves our custom data */
 function myplugin_save_postdata( $post_id ) {

         // verify if this is an auto save routine.
   // If it is our form has not been submitted, so we dont want to do
 anything
   if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
       return;

   // verify this came from the our screen and with proper authorization,
   // because save_post can be triggered at other times
   if ( ( isset ( $_POST['myplugin_noncename'] ) ) && ( ! wp_verify_nonce(
 $_POST['myplugin_noncename'], plugin_basename( __FILE__ ) ) ) )
       return;

   // Check permissions
   if ( ( isset ( $_POST['post_type'] ) ) && ( 'page' ==
 $_POST['post_type'] )  ) {
     if ( ! current_user_can( 'edit_page', $post_id ) ) {
                         return;
                 }
   }
         else {
                 if ( ! current_user_can( 'edit_post', $post_id ) ) {
                         return;
                 }
         }

   // OK, we're authenticated: we need to find and save the data
         if ( isset ( $_POST['_wp_editor_test_1'] ) ) {
                 update_post_meta( $post_id, '_wp_editor_test_1',
 $_POST['_wp_editor_test_1'] );
         }

 }
 }}}



 '''Case 1:'''
         Steps to reproduce error:[[BR]]
           Activate test plugin.[[BR]]
           HTML tab is selected in our custom editor instance.[[BR]]
           Drag meta box containing editor around (ensuring the jQuery UI
 Sortable drop placeholder shows up, but the box does not need to be docked
 to a new location)[[BR]]
           Release the box[[BR]]
           Switch to the editor's Visual tab[[BR]]

 '''The following error occurs:'''
         j is null
         In file: /wp-includes/js/tinymce/wp-
 tinymce.php?c=1&ver=345-20110918
         The top row of tinymce icons is also duplicated. Once the error
 occurs, we can no longer switch between tabs.


 '''Case 2:'''
         Steps to reproduce error:[[BR]]
           Activate test plugin.[[BR]]
           Visual tab selected.[[BR]]
           Drag meta box containing editor around.[[BR]]
           Release the box.[[BR]]
           switch to the editor's HTML tab.[[BR]]

 '''The following error occurs:'''
         Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED)
 [nsIDOMHTMLDocument.implementation]
         In file: /wp-includes/js/tinymce/wp-
 tinymce.php?c=1&ver=345-20110918

 Note: It may take a couple of tries when switching between visual/HTML
 tabs to trigger the errors. Sometimes the errors won't happen, but usually
 they do.

-- 
Ticket URL: <http://core.trac.wordpress.org/ticket/19173>
WordPress Trac <http://core.trac.wordpress.org/>
WordPress blogging software