Changeset 44825

Timestamp:

03/09/2019 12:55:12 PM (6 years ago)

Author:

afercia

Message:

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.

Location:

trunk/src

Files:

• js/_enqueues/wp/customize/widgets.js (modified) (6 diffs)
• wp-includes/class-wp-customize-widgets.php (modified) (1 diff)

trunk/src/js/_enqueues/wp/customize/widgets.js

@@ -204 +204 @@
          * Performs a search and handles selected widget.
          */
-        search: function( event ) {
+        search: _.debounce( function( event ) {
             var firstVisible;
 
@@ -246 +246 @@
                 this.$el.removeClass( 'no-widgets-found' );
             }
-        },
+        }, 500 ),
 
         /**
@@ -258 +258 @@
          * 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 ) ;
 
@@ -266 +266 @@
 
             wp.a11y.speak( message );
-        }, 500 ),
+        },
 
         /**
@@ -709 +709 @@
 
             $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
@@ -988 +987 @@
             // 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;

trunk/src/wp-includes/class-wp-customize-widgets.php

@@ -778 +778 @@
                 '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' ),