From 2e6ce4195b3a37f5e98a771f8800cafcc42a56b3 Mon Sep 17 00:00:00 2001 From: Andrea Fercia Date: Sat, 9 Mar 2019 12:55:12 +0000 Subject: [PATCH] Accessibility: Customize: Improve the widgets search and the widget Remove button. - debounces the widgets search to avoid multiple `speak()` audible messages while typing: search results and messages are now triggered when users stop typing - clarifies the Remove button title attribute - removes a couple unnecessary `preventDefault()` Props davetgreen, afercia. Fixes #28888. git-svn-id: https://develop.svn.wordpress.org/trunk@44825 602fd350-edb4-49c9-b593-d223f7449a82 --- src/js/_enqueues/wp/customize/widgets.js | 15 ++++++--------- src/wp-includes/class-wp-customize-widgets.php | 2 +- 2 files changed, 7 insertions(+), 10 deletions(-) diff --git a/src/js/_enqueues/wp/customize/widgets.js b/src/js/_enqueues/wp/customize/widgets.js index d84d672c15..77f44def24 100644 --- a/src/js/_enqueues/wp/customize/widgets.js +++ b/src/js/_enqueues/wp/customize/widgets.js @@ -203,7 +203,7 @@ /** * Performs a search and handles selected widget. */ - search: function( event ) { + search: _.debounce( function( event ) { var firstVisible; this.collection.doSearch( event.target.value ); @@ -245,7 +245,7 @@ } else { this.$el.removeClass( 'no-widgets-found' ); } - }, + }, 500 ), /** * Updates the count of the available widgets that have the `search_matched` attribute. @@ -257,7 +257,7 @@ /** * Sends a message to the aria-live region to announce how many search results. */ - announceSearchMatches: _.debounce( function() { + announceSearchMatches: function() { var message = l10n.widgetsFound.replace( '%d', this.searchMatchesCount ) ; if ( ! this.searchMatchesCount ) { @@ -265,7 +265,7 @@ } wp.a11y.speak( message ); - }, 500 ), + }, /** * Changes visibility of available widgets. @@ -708,8 +708,7 @@ } ); $closeBtn = this.container.find( '.widget-control-close' ); - $closeBtn.on( 'click', function( e ) { - e.preventDefault(); + $closeBtn.on( 'click', function() { self.collapse(); self.container.find( '.widget-top .widget-action:first' ).focus(); // keyboard accessibility } ); @@ -987,9 +986,7 @@ // Configure remove button $removeBtn = this.container.find( '.widget-control-remove' ); - $removeBtn.on( 'click', function( e ) { - e.preventDefault(); - + $removeBtn.on( 'click', function() { // Find an adjacent element to add focus to when this widget goes away var $adjacentFocusTarget; if ( self.container.next().is( '.customize-control-widget_form' ) ) { diff --git a/src/wp-includes/class-wp-customize-widgets.php b/src/wp-includes/class-wp-customize-widgets.php index aa9c3499b2..47f7db1584 100644 --- a/src/wp-includes/class-wp-customize-widgets.php +++ b/src/wp-includes/class-wp-customize-widgets.php @@ -777,7 +777,7 @@ final class WP_Customize_Widgets { 'saveBtnLabel' => __( 'Apply' ), 'saveBtnTooltip' => __( 'Save and preview changes before publishing them.' ), 'removeBtnLabel' => __( 'Remove' ), - 'removeBtnTooltip' => __( 'Trash widget by moving it to the inactive widgets sidebar.' ), + 'removeBtnTooltip' => __( 'Keep widget settings and move it to the inactive widgets' ), 'error' => __( 'An error has occurred. Please reload the page and try again.' ), 'widgetMovedUp' => __( 'Widget moved up' ), 'widgetMovedDown' => __( 'Widget moved down' ),