From e37fe6dfac371d457ec2215dc3cbe3b69a631448 Mon Sep 17 00:00:00 2001 From: Christos Date: Mon, 13 Sep 2021 14:22:41 +0300 Subject: [PATCH] Fix block widget edit shortcuts --- package-lock.json | 19 +++++++++---------- src/admin.js | 7 +------ src/helpers/icon-buttons.js | 1 + src/modules/focus-listener.js | 1 + src/preview.js | 15 +++++++++++---- 5 files changed, 23 insertions(+), 20 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0d27378..c6d0f13 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2,7 +2,6 @@ "name": "customize-direct-manipulation", "version": "1.1.0", "lockfileVersion": 1, - "requires": true, "dependencies": { "@babel/code-frame": { "version": "7.0.0-beta.31", @@ -3281,6 +3280,15 @@ "integrity": "sha1-NbCYdbT/SfJqd35QmzCQoyJr8ks=", "dev": true }, + "string_decoder": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz", + "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==", + "dev": true, + "requires": { + "safe-buffer": "5.1.1" + } + }, "string-width": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz", @@ -3308,15 +3316,6 @@ } } }, - "string_decoder": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz", - "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==", - "dev": true, - "requires": { - "safe-buffer": "5.1.1" - } - }, "stringstream": { "version": "0.0.5", "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz", diff --git a/src/admin.js b/src/admin.js index 04705c1..6fc265d 100644 --- a/src/admin.js +++ b/src/admin.js @@ -1,6 +1,6 @@ import $ from 'jquery'; import getAPI from './helpers/api'; -import { off, send } from './helpers/messenger'; +import { send } from './helpers/messenger'; import addFocusListener from './modules/focus-listener'; import { bindPreviewEventsListener } from './helpers/record-event'; import addGuide from './modules/guide'; @@ -18,11 +18,6 @@ api.bind( 'ready', () => { addFocusListener( 'focus-menu', id => api.section( id ) ); addFocusListener( 'focus-menu-location', id => api.control( `nav_menu_locations[${ id }]` ) ); - // disable core so we can enhance by making sure the controls panel opens - // before trying to focus the widget - off( 'focus-widget-control', api.Widgets.focusWidgetFormControl ); - addFocusListener( 'focus-widget-control', id => api.Widgets.getWidgetFormControlForWidget( id ) ); - // Toggle icons when customizer toggles preview mode $( '.collapse-sidebar' ).on( 'click', () => send( 'cdm-toggle-visible' ) ); diff --git a/src/helpers/icon-buttons.js b/src/helpers/icon-buttons.js index a965f20..16dce19 100644 --- a/src/helpers/icon-buttons.js +++ b/src/helpers/icon-buttons.js @@ -47,6 +47,7 @@ export function addClickHandlerToIcon( element ) { if ( ! element.$icon ) { return element; } + addClickHandler( `.${ getIconClassName( element.id ) }`, element.handler ); return element; } diff --git a/src/modules/focus-listener.js b/src/modules/focus-listener.js index 093fd09..c0c0523 100644 --- a/src/modules/focus-listener.js +++ b/src/modules/focus-listener.js @@ -20,6 +20,7 @@ function makeHandler( eventName, getControlCallback ) { const eventTargetId = args[ 0 ]; debug( `received ${ eventName } event for target id ${ eventTargetId }` ); const focusableControl = getControlCallback.apply( getControlCallback, args ); + if ( ! focusableControl ) { debug( `no control found for event ${ eventName } and args:`, args ); return; diff --git a/src/preview.js b/src/preview.js index af66228..445312b 100644 --- a/src/preview.js +++ b/src/preview.js @@ -6,7 +6,6 @@ import { isSafari, isMobileSafari } from './helpers/user-agent'; import makeFocusable from './modules/focusable'; import { modifyEditPostLinks, disableEditPostLinks } from './modules/edit-post-links'; import { getHeaderElements } from './modules/header-focus'; -import { getWidgetElements } from './modules/widget-focus'; import { getMenuElements } from './modules/menu-focus'; import { getFooterElements } from './modules/footer-focus'; import { getSiteLogoElements } from './modules/site-logo-focus'; @@ -20,7 +19,15 @@ const api = getAPI(); function disableEditShortcuts() { if ( api.selectiveRefresh && api.selectiveRefresh.Partial && api.selectiveRefresh.Partial.prototype.createEditShortcutForPlacement ) { debug( 'disabling edit shortcuts' ); - api.selectiveRefresh.Partial.prototype.createEditShortcutForPlacement = function() {}; + + // This is crude but necessary to fix the broken widget shortcuts that broke when block widgets were introduced + // We effectively skip overriding/disabling the default shortcut for widget partials + const createEditShortcutForPlacement = api.selectiveRefresh.Partial.prototype.createEditShortcutForPlacement; + api.selectiveRefresh.Partial.prototype.createEditShortcutForPlacement = function( ...args ) { + if ( args[ 0 ] && args[ 0 ].partial && args[ 0 ].partial.id.startsWith( 'widget' ) ) { + createEditShortcutForPlacement.apply( this, args ); + } + }; } else { debug( 'no edit shortcuts support detected' ); } @@ -33,11 +40,11 @@ function startDirectManipulation() { { id: 'blogname', selector: '.site-title, #site-title', type: 'siteTitle', position: 'middle', title: 'site title' }, ]; const headers = ! options.headerImageSupport ? [] : getHeaderElements(); - const widgets = isDisabled( 'widget-focus' ) ? [] : getWidgetElements(); const menus = isDisabled( 'menu-focus' ) ? [] : getMenuElements(); const footers = isDisabled( 'footer-focus' ) ? [] : getFooterElements(); const siteLogo = isDisabled( 'site-logo-focus' ) ? [] : getSiteLogoElements(); - makeFocusable( basicElements.concat( headers, widgets, menus, footers, siteLogo ) ); + + makeFocusable( basicElements.concat( headers, menus, footers, siteLogo ) ); if ( ! isDisabled( 'edit-post-links' ) ) { if ( isSafari() && ! isMobileSafari() ) {