WordPress.org
Get WordPress

Make WordPress Core

Changeset 29513


Ignore:
Timestamp:
08/17/2014 03:42:03 AM (12 years ago)
Author:
azaozz
Message:

TinyMCE wpView: add small delay before inserting wpview sandbox iframes into the DOM. Fixes a problem in Firefox that may prevent rendering them. Fixes #29241.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/js/mce-view.js

    r29471 r29513  
    128128                                        content.innerHTML = '';
    129129
    130                                         iframe = dom.add( content, 'iframe', {
    131                                                 src: tinymce.Env.ie ? 'javascript:""' : '',
    132                                                 frameBorder: '0',
    133                                                 allowTransparency: 'true',
    134                                                 scrolling: 'no',
    135                                                 'class': 'wpview-sandbox',
    136                                                 style: {
    137                                                         width: '100%',
    138                                                         display: 'block'
     130                                        // Seems Firefox needs a bit of time to insert/set the view nodes, or the iframe will fail
     131                                        // especially when switching Text => Visual.
     132                                        setTimeout( function() {
     133                                                iframe = dom.add( content, 'iframe', {
     134                                                        src: tinymce.Env.ie ? 'javascript:""' : '',
     135                                                        frameBorder: '0',
     136                                                        allowTransparency: 'true',
     137                                                        scrolling: 'no',
     138                                                        'class': 'wpview-sandbox',
     139                                                        style: {
     140                                                                width: '100%',
     141                                                                display: 'block'
     142                                                        }
     143                                                } );
     144
     145                                                iframeDoc = iframe.contentWindow.document;
     146
     147                                                iframeDoc.open();
     148                                                iframeDoc.write(
     149                                                        '<!DOCTYPE html>' +
     150                                                        '<html>' +
     151                                                                '<head>' +
     152                                                                        '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
     153                                                                '</head>' +
     154                                                                '<body data-context="iframe-sandbox" style="padding: 0; margin: 0;" class="' + editor.getBody().className + '">' +
     155                                                                        html +
     156                                                                '</body>' +
     157                                                        '</html>'
     158                                                );
     159                                                iframeDoc.close();
     160
     161                                                resize = function() {
     162                                                        // Make sure the iframe still exists.
     163                                                        iframe.contentWindow && $( iframe ).height( $( iframeDoc.body ).height() );
     164                                                };
     165
     166                                                if ( MutationObserver ) {
     167                                                        new MutationObserver( _.debounce( function() {
     168                                                                resize();
     169                                                        }, 100 ) )
     170                                                        .observe( iframeDoc.body, {
     171                                                                attributes: true,
     172                                                                childList: true,
     173                                                                subtree: true
     174                                                        } );
     175                                                } else {
     176                                                        for ( i = 1; i < 6; i++ ) {
     177                                                                setTimeout( resize, i * 700 );
     178                                                        }
    139179                                                }
    140                                         } );
    141 
    142                                         iframeDoc = iframe.contentWindow.document;
    143 
    144                                         iframeDoc.open();
    145                                         iframeDoc.write(
    146                                                 '<!DOCTYPE html>' +
    147                                                 '<html>' +
    148                                                         '<head>' +
    149                                                                 '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
    150                                                         '</head>' +
    151                                                         '<body data-context="iframe-sandbox" style="padding: 0; margin: 0;" class="' + editor.getBody().className + '">' +
    152                                                                 html +
    153                                                         '</body>' +
    154                                                 '</html>'
    155                                         );
    156                                         iframeDoc.close();
    157 
    158                                         resize = function() {
    159                                                 // Make sure the iframe still exists.
    160                                                 iframe.contentWindow && $( iframe ).height( $( iframeDoc.body ).height() );
    161                                         };
    162 
    163                                         if ( MutationObserver ) {
    164                                                 new MutationObserver( _.debounce( function() {
    165                                                         resize();
    166                                                 }, 100 ) )
    167                                                 .observe( iframeDoc.body, {
    168                                                         attributes: true,
    169                                                         childList: true,
    170                                                         subtree: true
    171                                                 } );
    172                                         } else {
    173                                                 for ( i = 1; i < 6; i++ ) {
    174                                                         setTimeout( resize, i * 700 );
    175                                                 }
    176                                         }
     180                                        }, 50 );
    177181                                });
    178182                        } else {
Note: See TracChangeset for help on using the changeset viewer.