Ticket #42321: 42321.5.patch

src/wp-admin/css/forms.css

@@ -237 +237 @@
 }
 
 .form-invalid input, .form-invalid input:focus,
-.form-invalid select, .form-invalid select:focus {
+.form-invalid select, .form-invalid select:focus, input.invalid {
         border-color: #dc3232 !important;
- box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
+    box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
 }
 
 .form-table .form-required.form-invalid td:after {

src/wp-admin/js/nav-menu.js

@@ -829 +829 @@
                                         }
                                 }
                         });
+
+                        $( '#menu-name' ).on('keyup', _.debounce( function () {
+                                var menuName = $( document.getElementById( 'menu-name' ) ),
+                                        menuNameVal = menuName.val();
+
+                                if ( ! menuNameVal || menuNameVal === menuName.attr( 'title' ) || ! menuNameVal.replace( /\s+/, '' ) ) {
+                                        // Add warning for invalid menu name
+                                        menuName.addClass( 'invalid' );
+                                } else {
+                                        // Remove warning for valid menu name
+                                        menuName.removeClass( 'invalid' );
+                                }
+                        }, 500 ));
+
                         $('#add-custom-links input[type="text"]').keypress(function(e){
                                 $('#customlinkdiv').removeClass('form-invalid');
 
@@ -1172 +1186 @@
                         menuName = $('#menu-name'),
                         menuNameVal = menuName.val();
                         // Cancel and warn if invalid menu name
-                        if( !menuNameVal || menuNameVal == menuName.attr('title') || !menuNameVal.replace(/\s+/, '') ) {
-                                menuName.parent().addClass('form-invalid');
+                        if( !menuNameVal || menuNameVal === menuName.attr('title') || !menuNameVal.replace(/\s+/, '') ) {
+                                menuName.addClass('invalid');
                                 return false;
                         }
                         // Copy menu theme locations

src/wp-includes/script-loader.php

@@ -877 +877 @@
                 ) );
 
                 // Navigation Menus
-                $scripts->add( 'nav-menu', "/wp-admin/js/nav-menu$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable', 'jquery-ui-droppable', 'wp-lists', 'postbox', 'json2' ) );
+                /**
+                 * Adding underscore as a dependency to utilize _.debounce
+                 *
+                 * @since 4.9.1
+                 *
+                 * @see https://core.trac.wordpress.org/attachment/ticket/42321/
+                 */
+                $scripts->add( 'nav-menu', "/wp-admin/js/nav-menu$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable', 'jquery-ui-droppable', 'wp-lists', 'postbox', 'json2', 'underscore' ) );
                 did_action( 'init' ) && $scripts->localize( 'nav-menu', 'navMenuL10n', array(
                         'noResultsFound' => __( 'No results found.' ),
                         'warnDeleteMenu' => __( "You are about to permanently delete this menu. \n 'Cancel' to stop, 'OK' to delete." ),