[wp-trac] [WordPress Trac] #45461: Incorrect height of the WP editor, when loaded in a hidden layer

[WordPress Trac]

#45461: Incorrect height of the WP editor, when loaded in a hidden layer
--------------------------+-----------------------------
 Reporter:  nnikolov      |      Owner:  (none)
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:  Awaiting Review
Component:  TinyMCE       |    Version:  5.0
 Severity:  normal        |   Keywords:
  Focuses:                |
--------------------------+-----------------------------
 Using the wp_editor() function I am showing the editor inside a DIV tag
 that is hidden with display:none. Then I show the DIV with JavaScript to
 display:block. In WordPress 5.0 RC2 the height of the editor is incorrect.

 This is the plugin I made to test this:
 {{{#!php
 <?php
 /*
 Plugin Name: Test WP Editor
 Description: Test WP Editor
 Author: Nikolay Nikolov
 Version: 1.0.0
 */

 add_action( 'admin_menu', 'my_test_admin_menu' );

 function my_test_admin_menu() {
     add_menu_page(
         'Test WP Editor',
         'Test WP Editor',
         'manage_options',
         'my-test-page',
         'my_test_page'
     );
 }

 function my_test_page() {
     ?>
     <div class="wrap">
         <br><br>
         <script type="text/javascript">
         function my_func() {
             document.getElementById('my-div').style.display='block';
         }
         </script>
         <a href="javascript:my_func()">SHOW IT</a>
         <br><br>
         <div id="my-div" style="display: none;">
         <?php
         $text = "<p>ddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg
 fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg
 fdgfdgfdg</p>"
             . "<p>ddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg
 fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg
 fdgfdgfdg</p>"
             . "<p>ddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg
 fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg
 fdgfdgfdg</p>"
             . "<p>ddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg
 fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg fdgfdgfdgddg fdgfd grgdfvg fdgfdg
 fdgfdgfdg</p>";
         wp_editor(
             $text,
             'editor-name',
             array(
                 'editor_height' => 300,
             )
         );
         ?>
         </div>
     </div>
     <?php
 }
 }}}

 Just upload and activate the plugin, go to the created admin page, and
 click the link there. See the pictures below to see the problem.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/45461>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform