Changeset 7593 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/gutenberg/functions.php

Timestamp:

08/04/2018 05:54:11 AM (8 years ago)

Author:

dd32

Message:

Gutenberg: Override wp.domReady with a version which doesn't contain a race-condition, this fixes the whitescreen on frontendberg on first load.

wp.domReady() is incorrectly regisering callbacks (such as the Gutenberg init function) to be fired on DOMContentLoaded AFTER that event has already fired, causing the callbacks to never run.
This replaces it with a version which does work, calling the callback immediately when document.readyState is at interactive (which is what fires DOMContentLoaded) or complete (when styles/images/etc are loaded, which the Gutenberg wp.domReady does).

See #3703, #3735.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/gutenberg/functions.php (modified) (1 diff)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/gutenberg/functions.php

@@ -158 +158 @@
                         '_wpLoadGutenbergEditor.then( function() { wp.blocks.unregisterBlockType( "core/shortcode" ); } );'
                 );
+
+                // Fix domReady for frontendberg
+                wp_add_inline_script(
+                        'wp-dom-ready',
+                        'wp.domReady = function( callback ) {
+                                // The included domReady fails to call callbacks which are registered while readyState is "interactive".
+                                // DOMContentLoaded fires at the start of interactive, but domReady only calls registered methods at "complete".
+                                // This caused Frontendberg to white screen as the Gutenberg initialize call happens in that timespan when SessionStorage is empty
+                                if (
+                                        document.readyState === "complete" || // DOMContentLoaded + Images/Styles/etc loaded, so we call directly.
+                                        document.readyState === "interactive" // DOMContentLoaded fires at this point, so we call directly.
+                                ) {
+                                        return callback();
+                                }
+
+                                // DOMContentLoaded has not fired yet, delay callback until then.
+                                document.addEventListener("DOMContentLoaded", callback);
+                        };'
+                );
+
         }, 11 );
         add_action( 'wp_enqueue_scripts', 'gutenberg_editor_scripts_and_styles' );