Ticket #28536: 28536.2.diff

src/wp-admin/customize.php

@@ -12 +12 @@
 /** Load WordPress Administration Bootstrap */
 require_once( dirname( __FILE__ ) . '/admin.php' );
 
-if ( ! current_user_can( 'edit_theme_options' ) )
+if ( ! current_user_can( 'edit_theme_options' ) ) {
         wp_die( __( 'Cheatin’ uh?' ) );
+}
+
+global $wp_scripts, $wp_customize;
 
 wp_reset_vars( array( 'url', 'return' ) );
 $url = urldecode( $url );
 $url = wp_validate_redirect( $url, home_url( '/' ) );
-if ( $return )
+
+if ( $return ) {
         $return = wp_validate_redirect( urldecode( $return ) );
-if ( ! $return )
+} elseif ( ! $wp_customize->is_theme_active() ) {
+        $return = admin_url( 'themes.php' );
+} else {
         $return = $url;
-
-global $wp_scripts, $wp_customize;
+}
 
 $registered = $wp_scripts->registered;
 $wp_scripts = new WP_Scripts;

src/wp-admin/js/customize-controls.js

@@ -728 +728 @@
                                                 }
                                         }
 
-                                        clearTimeout( timeout );
-                                        timeout = setTimeout( callback, self.refreshBuffer );
+                                        try {
+                                                clearTimeout( timeout );
+                                                timeout = setTimeout( callback, self.refreshBuffer );
+                                        } catch ( e ) {
+                                                // Handle Uncaught InvalidAccessError: Failed to execute 'setTimeout' on 'Window': No script context is available in which to execute the script.
+                                                return callback();
+                                        }
                                 };
                         })( this );
 
@@ -794 +799 @@
 
                         // Update the URL when the iframe sends a URL message.
                         this.bind( 'url', this.previewUrl );
+
+                        this.addHistory();
+                },
+
+                /**
+                 * Given a URL query string, return the query vars contained within it
+                 *
+                 * @param {String} queryString
+                 * @returns {Object}
+                 */
+                parseQueryVars: function ( queryString ) {
+                        var queryVars = {};
+                        if ( queryString ) {
+                                $.each( queryString.split( '&' ), function () {
+                                        var key, value, pair;
+                                        pair = this.split( '=', 2 );
+                                        key = decodeURIComponent( pair[0] );
+                                        value = pair[1] ? decodeURIComponent( pair[1] ) : null;
+                                        queryVars[ key ] = value;
+                                } );
+                        }
+                        return queryVars;
+                },
+
+                /**
+                 * Add support for history for navigation in Customize preview
+                 */
+                addHistory: function () {
+                        var self, backLink, pushStatePreviewUrl, popState;
+                        if ( ! history.pushState ) {
+                                return;
+                        }
+                        self = this;
+                        backLink = $( '.back.button:first' );
+
+                        // Push state
+                        pushStatePreviewUrl = function ( url ) {
+                                var state, parentLocation, queryVars;
+                                state = { customizePreviewUrl: url };
+                                parentLocation = location.pathname;
+                                queryVars = self.parseQueryVars( location.search.substr( 1 ) );
+                                queryVars.url = url;
+                                parentLocation += '?' + $.param( queryVars );
+                                parentLocation += location.hash;
+
+                                // parent frame is for the sake of customizer loaded into iframe for Live Preview
+                                if ( api.parent.targetWindow() ) {
+                                        api.parent.send( 'pushstate', [ state, '', parentLocation ] );
+                                } else {
+                                        window.history.pushState( state, '', parentLocation );
+                                }
+
+                                if ( api.settings.theme.active ) {
+                                        backLink.prop( 'href', url );
+                                }
+                        };
+                        this.previewUrl.bind( pushStatePreviewUrl );
+
+                        // Pop state
+                        popState = function ( state, windowLocation ) {
+                                var url, queryVars;
+
+                                queryVars = self.parseQueryVars( windowLocation.search.substr( 1 ) );
+
+                                // Handle hitting back to themes page after having reloaded on a page in the Customizer
+                                if ( ! state && /themes\.php$/.test( windowLocation.pathname ) ) {
+                                        location.replace( windowLocation.href );
+                                        return;
+                                }
+
+                                if ( state && state.customizePreviewUrl ) {
+                                        url = state.customizePreviewUrl;
+                                } else if ( queryVars.url ) {
+                                        /*
+                                         * When popped to initial state, then state is null and so
+                                         * we don't have customizePreviewUrl, so we can grab it from
+                                         * the URL query parameter. Note that the previewUrl value
+                                         * has a validator in place which will prevent illegal
+                                         * or malicious URLs from being injected into the preview.
+                                         */
+                                        url = queryVars.url;
+                                } else {
+                                        // Use the homepage as the preview URL as default
+                                        url = api.settings.url.home;
+                                }
+                                self.previewUrl.unbind( pushStatePreviewUrl );
+                                self.previewUrl( url );
+                                self.previewUrl.bind( pushStatePreviewUrl );
+
+                                if ( api.settings.theme.active ) {
+                                        backLink.prop( 'href', url );
+                                }
+                        };
+
+                        if ( api.parent.targetWindow() ) {
+                                api.parent.bind( 'popstate', function ( args ) {
+                                        popState.apply( null, args );
+                                } );
+                        } else {
+                                $( window ).on( 'popstate', function ( e ) {
+                                        popState( e.originalEvent.state, window.location );
+                                } );
+                        }
                 },
 
                 query: function() {},
@@ -913 +1021 @@
                 if ( ! $.support.postMessage || ( ! $.support.cors && api.settings.isCrossDomain ) )
                         return window.location = api.settings.url.fallback;
 
-                var previewer, parent, topFocus,
+                var previewer, topFocus,
                         body = $( document.body ),
                         overlay = body.children('.wp-full-overlay');
 
@@ -927 +1035 @@
                         }
                 });
 
+                // Create a potential postMessage connection with the parent frame.
+                api.parent = new api.Messenger( {
+                        url: api.settings.url.parent,
+                        channel: 'loader'
+                } );
+
                 // Initialize Previewer
                 previewer = new api.Previewer({
                         container:   '#customize-preview',
@@ -1113 +1227 @@
                         event.preventDefault();
                 });
 
-                // Create a potential postMessage connection with the parent frame.
-                parent = new api.Messenger({
-                        url: api.settings.url.parent,
-                        channel: 'loader'
-                });
-
                 // If we receive a 'back' event, we're inside an iframe.
                 // Send any clicks to the 'Return' link to the parent page.
-                parent.bind( 'back', function() {
+                api.parent.bind( 'back', function() {
                         $('.back').on( 'click.back', function( event ) {
                                 event.preventDefault();
-                                parent.send( 'close' );
+                                api.parent.send( 'close' );
                         });
                 });
 
                 // Pass events through to the parent.
                 api.bind( 'saved', function() {
-                        parent.send( 'saved' );
+                        api.parent.send( 'saved' );
                 });
 
                 // When activated, let the loader handle redirecting the page.
                 // If no loader exists, redirect the page ourselves (if a url exists).
                 api.bind( 'activated', function() {
-                        if ( parent.targetWindow() )
-                                parent.send( 'activated', api.settings.url.activated );
-                        else if ( api.settings.url.activated )
+                        if ( api.parent.targetWindow() ) {
+                                api.parent.send( 'activated', api.settings.url.activated );
+                        } else if ( api.settings.url.activated ) {
                                 window.location = api.settings.url.activated;
+                        }
                 });
 
                 // Initialize the connection with the parent frame.
-                parent.send( 'ready' );
+                api.parent.send( 'ready' );
 
                 // Control visibility for default controls
                 $.each({

src/wp-includes/js/customize-base.js

@@ -494 +494 @@
                  * @param  {object} options       Extend any instance parameter or method with this object.
                  */
                 initialize: function( params, options ) {
-                        // Target the parent frame by default, but only if a parent frame exists.
-                        var defaultTarget = window.parent == window ? null : window.parent;
+                        var defaultTarget;
+                        try {
+                                // Target the parent frame by default, but only if a parent frame exists.
+                                defaultTarget = window.parent === window ? null : window.parent;
+                        } catch ( e ) {
+                                // Handle case where window goes away in race condition. Uncaught TypeError: Cannot read property 'parent' of null
+                                defaultTarget = null;
+                        }
 
                         $.extend( this, options || {} );
 

src/wp-includes/js/customize-loader.js

@@ -36 +36 @@
                         });
 
                         // Add navigation listeners.
-                        if ( $.support.history )
+                        if ( $.support.history ) {
                                 this.window.on( 'popstate', Loader.popstate );
+                        }
 
                         if ( $.support.hashchange ) {
                                 this.window.on( 'hashchange', Loader.hashchange );
@@ -47 +48 @@
 
                 popstate: function( e ) {
                         var state = e.originalEvent.state;
-                        if ( state && state.customize )
+                        if ( state && state.customize ) {
                                 Loader.open( state.customize );
-                        else if ( Loader.active )
+                        } else if ( Loader.active && ( ! state || ! state.customizePreviewUrl ) ) {
                                 Loader.close();
+                        }
                 },
 
                 hashchange: function() {
                         var hash = window.location.toString().split('#')[1];
 
                         if ( hash && 0 === hash.indexOf( 'wp_customize=on' ) )
-                                Loader.open( Loader.settings.url + '?' + hash );
+                                Loader.open( Loader.settings.url.customize + '?' + hash );
 
                         if ( ! hash && ! $.support.history )
                                 Loader.close();
                 },
 
                 open: function( src ) {
-                        var hash;
+                        var hash, messenger;
 
                         if ( this.active )
                                 return;
@@ -80 +82 @@
                         this.iframe.one( 'load', this.loaded );
 
                         // Create a postMessage connection with the iframe.
-                        this.messenger = new api.Messenger({
+                        this.messenger = messenger = new api.Messenger({
                                 url: src,
                                 channel: 'loader',
                                 targetWindow: this.iframe[0].contentWindow
                         });
 
                         // Wait for the connection from the iframe before sending any postMessage events.
-                        this.messenger.bind( 'ready', function() {
+                        messenger.bind( 'ready', function() {
                                 Loader.messenger.send( 'back' );
-                        });
-
-                        this.messenger.bind( 'close', function() {
-                                if ( $.support.history )
+                        } );
+
+                        messenger.bind( 'close', function() {
+                                var goBackToThemesPage;
+                                if ( $.support.history ) {
+                                        goBackToThemesPage = function ( e ) {
+                                                var state;
+                                                state = e.originalEvent.state;
+                                                if ( state && ( state.customize || state.customizePreviewUrl ) ) {
+                                                        history.back();
+                                                } else {
+                                                        $( window ).off( 'popstate', goBackToThemesPage );
+                                                }
+                                        };
+                                        $( window ).on( 'popstate', goBackToThemesPage );
                                         history.back();
-                                else if ( $.support.hashchange )
+                                } else if ( $.support.hashchange ) {
                                         window.location.hash = '';
-                                else
+                                } else {
                                         Loader.close();
+                                }
                         });
 
-                        this.messenger.bind( 'activated', function( location ) {
+                        messenger.bind( 'activated', function( location ) {
                                 if ( location )
                                         window.location = location;
                         });
 
                         hash = src.split('?')[1];
 
-                        // Ensure we don't call pushState if the user hit the forward button.
-                        if ( $.support.history && window.location.href !== src )
-                                history.pushState( { customize: src }, '', src );
-                        else if ( ! $.support.history && $.support.hashchange && hash )
+                        if ( $.support.history ) {
+                                // Ensure we don't call pushState if the user hit the forward button.
+                                if ( window.location.href !== src ) {
+                                        history.pushState( { customize: src }, '', src );
+                                }
+
+                                // Allow customizer to control history of parent
+                                messenger.bind( 'pushstate', function( args ) {
+                                        history.pushState.apply( history, args );
+                                } );
+
+                                // Forward popstate events to customizer
+                                $( window ).on( 'popstate', function ( e ) {
+                                        messenger.send( 'popstate', [ e.originalEvent.state, window.location ] );
+                                } );
+
+                        } else if ( $.support.hashchange && hash ) {
                                 window.location.hash = 'wp_customize=on&' + hash;
+                        }
 
                         this.trigger( 'open' );
                 },
@@ -121 +149 @@
                 },
 
                 close: function() {
-                        if ( ! this.active )
+                        if ( ! this.active ) {
                                 return;
+                        }
                         this.active = false;
 
                         this.trigger( 'close' );
 
                         // Return focus to link that was originally clicked.
-                        if ( this.link )
+                        if ( this.link ) {
                                 this.link.focus();
+                        }
                 },
 
                 closed: function() {

src/wp-includes/theme.php

@@ -1871 +1871 @@
         );
 
         $settings = array(
-                'url'           => esc_url( admin_url( 'customize.php' ) ),
+                'url'           => array(
+                        'customize' => esc_url_raw( admin_url( 'customize.php' ) ),
+                        'home'      => esc_url_raw( home_url( '/' ) ),
+                ),
                 'isCrossDomain' => $cross_domain,
                 'browser'       => $browser,
         );