Changeset 20049

Timestamp:

02/29/2012 10:24:46 PM (13 years ago)

Author:

koopersmith

Message:

Theme Customizer: Bind the preview iframe load event when triggering refresh instead of when creating the iframe. see #19910.

The loaded event should only fire when we've actually triggered a refresh. If loaded is bound when the iframe is created, sometimes the blank iframe will fire a 'load' event before a refresh is triggered (this occurred with relative frequency in firefox). By binding the loaded event in the refresh function, we prevent this from occurring.

File:

• trunk/wp-includes/js/customize-controls.dev.js (modified) (3 diffs)

trunk/wp-includes/js/customize-controls.dev.js

@@ -13 +13 @@
         initialize: function( params, options ) {
             $.extend( this, options || {} );
+
+            this.loaded = $.proxy( this.loaded, this );
 
             this.loaderUuid = 0;
@@ -54 +56 @@
             this.iframe = api.ensure( params.iframe );
             this.form   = api.ensure( params.form );
+            this.name   = this.iframe.prop('name');
 
             this.container = this.iframe.parent();
@@ -84 +87 @@
         },
         loader: function() {
-            var self = this,
-                name;
-
             if ( this.loading )
                 return this.loading;
 
-            name = this.iframe.prop('name');
-
             this.loading = $('<iframe />', {
-                name: name + '-loading-' + this.loaderUuid++
+                name: this.name + '-loading-' + this.loaderUuid++
             }).appendTo( this.container );
-
-            this.loading.one( 'load', function() {
-                self.iframe.remove();
-                self.iframe = self.loading;
-                delete self.loading;
-                self.iframe.prop( 'name', name );
-            });
 
             return this.loading;
         },
+        loaded: function() {
+            this.iframe.remove();
+            this.iframe = this.loading;
+            delete this.loading;
+            this.iframe.prop( 'name', this.name );
+        },
         refresh: function() {
+            this.loader().one( 'load', this.loaded );
+
             this.submit({
                 target: this.loader().prop('name'),