Changeset 57746

Timestamp:

03/01/2024 04:19:23 PM (9 months ago)

Author:

joedolson

Message:

Customize: Accessibility: Label menu subitems when updating menus.

Fix missing subitem indicator when menu items in the Customizer are children of parent menu items & add menu item original title to button text. Adds parity with the admin menu editor and fixes a bug where the button text was 'untitled' if the menu item title had not been edited.

Props designsimply, afercia, celloexpressions, kushang78, joedolson, rcreators.
Fixes #32728.

Location:

trunk/src

Files:

• js/_enqueues/wp/customize/nav-menus.js (modified) (2 diffs)
• wp-includes/customize/class-wp-customize-nav-menu-item-control.php (modified) (3 diffs)

trunk/src/js/_enqueues/wp/customize/nav-menus.js

@@ -1665 +1665 @@
             $reorderNav.find( '.menus-move-up, .menus-move-down, .menus-move-left, .menus-move-right' ).on( 'click', function() {
                 var moveBtn = $( this );
+                control.params.depth = control.getDepth();
+
                 moveBtn.focus();
 
@@ -1678 +1680 @@
                 } else if ( isMoveLeft ) {
                     control.moveLeft();
+                    if ( 1 === control.params.depth ) {
+                        control.container.find( '.is-submenu' ).hide();
+                    } else {
+                        control.container.find( '.is-submenu' ).show();
+                    }
                 } else if ( isMoveRight ) {
                     control.moveRight();
+                    control.params.depth += 1;
+                    if ( 0 === control.params.depth ) {
+                        control.container.find( '.is-submenu' ).hide();
+                    } else {
+                        control.container.find( '.is-submenu' ).show();
+                    }
                 }
 

trunk/src/wp-includes/customize/class-wp-customize-nav-menu-item-control.php

@@ -70 +70 @@
                     <span class="spinner"></span>
                     <span class="menu-item-title<# if ( ! data.title && ! data.original_title ) { #> no-title<# } #>">{{ data.title || data.original_title || wp.customize.Menus.data.l10n.untitled }}</span>
+                    <# if ( 0 === data.depth ) { #>
+                        <span class="is-submenu" style="display: none;"><?php _e( 'sub item' ); ?></span>
+                    <# } else { #>
+                        <span class="is-submenu"><?php _e( 'sub item' ); ?></span>
+                    <# } #>
                 </span>
                 <span class="item-controls">
@@ -75 +80 @@
                     <?php
                         /* translators: 1: Title of a menu item, 2: Type of a menu item. */
-                        printf( __( 'Edit menu item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
+                        printf( __( 'Edit menu item: %1$s (%2$s)' ), '{{ data.title || data.original_title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
                     ?>
                     </span><span class="toggle-indicator" aria-hidden="true"></span></button>
@@ -81 +86 @@
                     <?php
                         /* translators: 1: Title of a menu item, 2: Type of a menu item. */
-                        printf( __( 'Remove Menu Item: %1$s (%2$s)' ), '{{ data.title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
+                        printf( __( 'Remove Menu Item: %1$s (%2$s)' ), '{{ data.title || data.original_title || wp.customize.Menus.data.l10n.untitled }}', '{{ data.item_type_label }}' );
                     ?>
                     </span></button>