Customizer: Fix previewing certain changes to nav menus.

Addresses regression introduced in [33138], where deleted menu items would not be removed from the preview, and changes to a location's assigned menu would likewise not preview. Also makes the binding of the setting change events more robust.

Fixes #33010.


Built from https://develop.svn.wordpress.org/trunk@33328


git-svn-id: http://core.svn.wordpress.org/trunk@33300 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-includes/js/customize-preview-nav-menus.js

@@ -28,7 +28,7 @@ wp.customize.menusPreview = ( function( $, api ) {
 	 * Bootstrap functionality.
 	 */
 	self.init = function() {
-		var self = this;
+		var self = this, initializedSettings = {};
 
 		if ( 'undefined' !== typeof _wpCustomizePreviewNavMenusExports ) {
 			$.extend( self, _wpCustomizePreviewNavMenusExports );
@@ -36,6 +36,7 @@ wp.customize.menusPreview = ( function( $, api ) {
 
 		api.each( function( setting, id ) {
 			setting.id = id;
+			initializedSettings[ setting.id ] = true;
 			self.bindListener( setting );
 		} );
 
@@ -44,10 +45,19 @@ wp.customize.menusPreview = ( function( $, api ) {
 			args = args.slice();
 			id = args.shift();
 			value = args.shift();
-			if ( ! api.has( id ) ) {
+
-				// Currently customize-preview.js is not creating settings for dynamically-created settings in the pane; so we have to do it
+			setting = api( id );
+			if ( ! setting ) {
+				// Currently customize-preview.js is not creating settings for dynamically-created settings in the pane, so we have to do it.
 				setting = api.create( id, value ); // @todo This should be in core
+			}
+			if ( ! setting.id ) {
+				// Currently customize-preview.js doesn't set the id property for each setting, like customize-controls.js does.
 				setting.id = id;
+			}
+
+			if ( ! initializedSettings[ setting.id ] ) {
+				initializedSettings[ setting.id ] = true;
 				if ( self.bindListener( setting ) ) {
 					setting.callbacks.fireWith( setting, [ setting(), null ] );
 				}
@@ -140,6 +150,11 @@ wp.customize.menusPreview = ( function( $, api ) {
 		} );
 	};
 
+	/**
+	 * Refresh the menu(s) associated with a given nav menu location.
+	 *
+	 * @param {string} location
+	 */
 	self.refreshMenuLocation = function( location ) {
 		var foundInstance = false;
 		_.each( self.navMenuInstanceArgs, function( navMenuArgs, instanceNumber ) {
@@ -189,11 +204,24 @@ wp.customize.menusPreview = ( function( $, api ) {
 			data.theme = self.theme.stylesheet;
 		}
 		data[ self.renderQueryVar ] = '1';
+
+		// Gather settings to send in partial refresh request.
 		customized = {};
 		api.each( function( setting, id ) {
+			var value = setting.get(), shouldSend = false;
 			// @todo Core should propagate the dirty state into the Preview as well so we can use that here.
-			if ( id === 'nav_menu[' + String( menuId ) + ']' || ( /^nav_menu_item\[/.test( id ) && setting() && menuId === setting().nav_menu_term_id ) ) {
+
-				customized[ id ] = setting.get();
+			// Send setting if it is a nav_menu_locations[] setting.
+			shouldSend = shouldSend || /^nav_menu_locations\[/.test( id );
+
+			// Send setting if it is the setting for this menu.
+			shouldSend = shouldSend || id === 'nav_menu[' + String( menuId ) + ']';
+
+			// Send setting if it is one that is associated with this menu, or it is deleted.
+			shouldSend = shouldSend || ( /^nav_menu_item\[/.test( id ) && ( false === value || menuId === value.nav_menu_term_id ) );
+
+			if ( shouldSend ) {
+				customized[ id ] = value;
 			}
 		} );
 		data.customized = JSON.stringify( customized );

wp-includes/js/customize-preview-nav-menus.min.js

@@ -1 +1 @@
-wp.customize.menusPreview=function(a,b){"use strict";var c;return c={renderQueryVar:null,renderNonceValue:null,renderNoncePostKey:null,previewCustomizeNonce:null,requestUri:"/",theme:{active:!1,stylesheet:""},navMenuInstanceArgs:{},refreshDebounceDelay:200},b.bind("preview-ready",function(){b.preview.bind("active",function(){c.init()})}),c.init=function(){var c=this;"undefined"!=typeof _wpCustomizePreviewNavMenusExports&&a.extend(c,_wpCustomizePreviewNavMenusExports),b.each(function(a,b){a.id=b,c.bindListener(a)}),b.preview.bind("setting",function(a){var d,e,f;a=a.slice(),d=a.shift(),e=a.shift(),b.has(d)||(f=b.create(d,e),f.id=d,c.bindListener(f)&&f.callbacks.fireWith(f,[f(),null]))})},c.bindListener=function(a){var b,d;return(b=a.id.match(/^nav_menu\[(-?\d+)]$/))?(a.navMenuId=parseInt(b[1],10),a.bind(c.onChangeNavMenuSetting),!0):(b=a.id.match(/^nav_menu_item\[(-?\d+)]$/))?(a.navMenuItemId=parseInt(b[1],10),a.bind(c.onChangeNavMenuItemSetting),!0):(b=a.id.match(/^nav_menu_locations\[(.+?)]/),b?(d=b[1],a.bind(function(){c.refreshMenuLocation(d)}),!0):!1)},c.onChangeNavMenuSetting=function(){var a=this;if(!a.navMenuId)throw new Error("Expected navMenuId property to be set.");c.refreshMenu(a.navMenuId)},c.onChangeNavMenuItemSetting=function(a,b){!b||!b.nav_menu_term_id||a&&b.nav_menu_term_id===a.nav_menu_term_id||c.refreshMenu(b.nav_menu_term_id),a&&a.nav_menu_term_id&&c.refreshMenu(a.nav_menu_term_id)},c.refreshMenu=function(a){var c=this,d=[];b.each(function(b,c){var e=c.match(/^nav_menu_locations\[(.+?)]/);e&&a===b()&&d.push(e[1])}),_.each(c.navMenuInstanceArgs,function(b,e){(a===b.menu||-1!==_.indexOf(d,b.theme_location))&&c.refreshMenuInstanceDebounced(e)})},c.refreshMenuLocation=function(a){var d=!1;_.each(c.navMenuInstanceArgs,function(b,e){a===b.theme_location&&(c.refreshMenuInstanceDebounced(e),d=!0)}),d||b.preview.send("refresh")},c.refreshMenuInstance=function(c){var d,e,f,g,h,i,j,k,l=this;if(!l.navMenuInstanceArgs[c])throw new Error("unknown_instance_number");return j=l.navMenuInstanceArgs[c],k="partial-refreshable-nav-menu-"+String(c),g=a("."+k),_.isNumber(j.menu)?e=j.menu:j.theme_location&&b.has("nav_menu_locations["+j.theme_location+"]")&&(e=b("nav_menu_locations["+j.theme_location+"]").get()),e&&j.can_partial_refresh&&0!==g.length?(e=parseInt(e,10),d={nonce:l.previewCustomizeNonce,wp_customize:"on"},l.theme.active||(d.theme=l.theme.stylesheet),d[l.renderQueryVar]="1",f={},b.each(function(a,b){(b==="nav_menu["+String(e)+"]"||/^nav_menu_item\[/.test(b)&&a()&&e===a().nav_menu_term_id)&&(f[b]=a.get())}),d.customized=JSON.stringify(f),d[l.renderNoncePostKey]=l.renderNonceValue,i=a.extend({},j),d.wp_nav_menu_args_hash=i.args_hash,delete i.args_hash,d.wp_nav_menu_args=JSON.stringify(i),g.addClass("customize-partial-refreshing"),h=wp.ajax.send(null,{data:d,url:l.requestUri}),void h.done(function(d){if(!1===d)return void b.preview.send("refresh");var e,f=g;g=a(d),g.addClass(k),g.addClass("partial-refreshable-nav-menu customize-partial-refreshing"),f.replaceWith(g),e={instanceNumber:c,wpNavArgs:i,oldContainer:f,newContainer:g},g.removeClass("customize-partial-refreshing"),a(document).trigger("customize-preview-menu-refreshed",[e])})):void b.preview.send("refresh")},c.currentRefreshMenuInstanceDebouncedCalls={},c.refreshMenuInstanceDebounced=function(a){c.currentRefreshMenuInstanceDebouncedCalls[a]&&clearTimeout(c.currentRefreshMenuInstanceDebouncedCalls[a]),c.currentRefreshMenuInstanceDebouncedCalls[a]=setTimeout(function(){c.refreshMenuInstance(a)},c.refreshDebounceDelay)},c}(jQuery,wp.customize);
+wp.customize.menusPreview=function(a,b){"use strict";var c;return c={renderQueryVar:null,renderNonceValue:null,renderNoncePostKey:null,previewCustomizeNonce:null,requestUri:"/",theme:{active:!1,stylesheet:""},navMenuInstanceArgs:{},refreshDebounceDelay:200},b.bind("preview-ready",function(){b.preview.bind("active",function(){c.init()})}),c.init=function(){var c=this,d={};"undefined"!=typeof _wpCustomizePreviewNavMenusExports&&a.extend(c,_wpCustomizePreviewNavMenusExports),b.each(function(a,b){a.id=b,d[a.id]=!0,c.bindListener(a)}),b.preview.bind("setting",function(a){var e,f,g;a=a.slice(),e=a.shift(),f=a.shift(),g=b(e),g||(g=b.create(e,f)),g.id||(g.id=e),d[g.id]||(d[g.id]=!0,c.bindListener(g)&&g.callbacks.fireWith(g,[g(),null]))})},c.bindListener=function(a){var b,d;return(b=a.id.match(/^nav_menu\[(-?\d+)]$/))?(a.navMenuId=parseInt(b[1],10),a.bind(c.onChangeNavMenuSetting),!0):(b=a.id.match(/^nav_menu_item\[(-?\d+)]$/))?(a.navMenuItemId=parseInt(b[1],10),a.bind(c.onChangeNavMenuItemSetting),!0):(b=a.id.match(/^nav_menu_locations\[(.+?)]/),b?(d=b[1],a.bind(function(){c.refreshMenuLocation(d)}),!0):!1)},c.onChangeNavMenuSetting=function(){var a=this;if(!a.navMenuId)throw new Error("Expected navMenuId property to be set.");c.refreshMenu(a.navMenuId)},c.onChangeNavMenuItemSetting=function(a,b){!b||!b.nav_menu_term_id||a&&b.nav_menu_term_id===a.nav_menu_term_id||c.refreshMenu(b.nav_menu_term_id),a&&a.nav_menu_term_id&&c.refreshMenu(a.nav_menu_term_id)},c.refreshMenu=function(a){var c=this,d=[];b.each(function(b,c){var e=c.match(/^nav_menu_locations\[(.+?)]/);e&&a===b()&&d.push(e[1])}),_.each(c.navMenuInstanceArgs,function(b,e){(a===b.menu||-1!==_.indexOf(d,b.theme_location))&&c.refreshMenuInstanceDebounced(e)})},c.refreshMenuLocation=function(a){var d=!1;_.each(c.navMenuInstanceArgs,function(b,e){a===b.theme_location&&(c.refreshMenuInstanceDebounced(e),d=!0)}),d||b.preview.send("refresh")},c.refreshMenuInstance=function(c){var d,e,f,g,h,i,j,k,l=this;if(!l.navMenuInstanceArgs[c])throw new Error("unknown_instance_number");return j=l.navMenuInstanceArgs[c],k="partial-refreshable-nav-menu-"+String(c),g=a("."+k),_.isNumber(j.menu)?e=j.menu:j.theme_location&&b.has("nav_menu_locations["+j.theme_location+"]")&&(e=b("nav_menu_locations["+j.theme_location+"]").get()),e&&j.can_partial_refresh&&0!==g.length?(e=parseInt(e,10),d={nonce:l.previewCustomizeNonce,wp_customize:"on"},l.theme.active||(d.theme=l.theme.stylesheet),d[l.renderQueryVar]="1",f={},b.each(function(a,b){var c=a.get(),d=!1;d=d||/^nav_menu_locations\[/.test(b),d=d||b==="nav_menu["+String(e)+"]",d=d||/^nav_menu_item\[/.test(b)&&(!1===c||e===c.nav_menu_term_id),d&&(f[b]=c)}),d.customized=JSON.stringify(f),d[l.renderNoncePostKey]=l.renderNonceValue,i=a.extend({},j),d.wp_nav_menu_args_hash=i.args_hash,delete i.args_hash,d.wp_nav_menu_args=JSON.stringify(i),g.addClass("customize-partial-refreshing"),h=wp.ajax.send(null,{data:d,url:l.requestUri}),void h.done(function(d){if(!1===d)return void b.preview.send("refresh");var e,f=g;g=a(d),g.addClass(k),g.addClass("partial-refreshable-nav-menu customize-partial-refreshing"),f.replaceWith(g),e={instanceNumber:c,wpNavArgs:i,oldContainer:f,newContainer:g},g.removeClass("customize-partial-refreshing"),a(document).trigger("customize-preview-menu-refreshed",[e])})):void b.preview.send("refresh")},c.currentRefreshMenuInstanceDebouncedCalls={},c.refreshMenuInstanceDebounced=function(a){c.currentRefreshMenuInstanceDebouncedCalls[a]&&clearTimeout(c.currentRefreshMenuInstanceDebouncedCalls[a]),c.currentRefreshMenuInstanceDebouncedCalls[a]=setTimeout(function(){c.refreshMenuInstance(a)},c.refreshDebounceDelay)},c}(jQuery,wp.customize);

wp-includes/version.php

@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.3-beta3-33327';
+$wp_version = '4.3-beta3-33328';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.