Ticket #48894: 48894.2.diff

src/js/_enqueues/lib/admin-bar.js

@@ -19 +19 @@
                         allMenuItems,
                         adminBarLogout,
                         adminBarSearchForm,
+                        adminBarMyAccount,
                         shortlink,
                         skipLink,
                         mobileEvent,
@@ -33 +34 @@
                 allMenuItems = adminBar.querySelectorAll( '.ab-item' );
                 adminBarLogout = document.getElementById( 'wp-admin-bar-logout' );
                 adminBarSearchForm = document.getElementById( 'adminbarsearch' );
+                adminBarMyAccount = document.getElementById( 'wp-admin-bar-my-account' );
                 shortlink = document.getElementById( 'wp-admin-bar-get-shortlink' );
                 skipLink = adminBar.querySelector( '.screen-reader-shortcut' );
                 mobileEvent = /Mobile\/.+Safari/.test( navigator.userAgent ) ? 'touchstart' : 'click';
@@ -56 +58 @@
                                 }
 
                                 adminBar.removeEventListener( 'touchstart', bindMobileEvents );
+                                adminBarMyAccount.removeEventListener( 'click', toggleMyAccount );
                         } );
                 }
 
@@ -63 +66 @@
                 adminBar.addEventListener( 'click', scrollToTop );
 
                 for ( i = 0; i < topMenuItems.length; i++ ) {
-                        // Adds or removes the hover class based on the hover intent.
-                        window.hoverintent(
-                                topMenuItems[i],
-                                addClass.bind( null, topMenuItems[i], 'hover' ),
-                                removeClass.bind( null, topMenuItems[i], 'hover' )
-                        ).options( {
-                                timeout: 180
-                        } );
+                        if ( topMenuItems[i].id !== 'wp-admin-bar-my-account' ) {
+                                // Adds or removes the hover class based on the hover intent, except for My Account menu.
+                                window.hoverintent(
+                                        topMenuItems[i],
+                                        addClass.bind( null, topMenuItems[i], 'hover' ),
+                                        removeClass.bind( null, topMenuItems[i], 'hover' )
+                                ).options( {
+                                        timeout: 180
+                                } );
+                        }
 
                         // Toggle hover class if the enter key is pressed.
                         topMenuItems[i].addEventListener( 'keydown', toggleHoverIfEnter );
                 }
 
+                // Toggle hover class on My Account menu.
+                adminBarMyAccount.addEventListener( 'click', toggleMyAccount );
+
                 // Remove hover class if the escape key is pressed.
                 for ( i = 0; i < allMenuItems.length; i++ ) {
                         allMenuItems[i].addEventListener( 'keydown', removeHoverIfEscape );
@@ -113 +121 @@
                 if ( adminBarLogout ) {
                         adminBarLogout.addEventListener( 'click', emptySessionStorage );
                 }
+
+                /**
+                 * Toggles the My Account menu.
+                 *
+                 * @since 5.5.0
+                 *
+                 * @param {Event} event The click event.
+                 */
+                function toggleMyAccount( event ) {
+                        event.preventDefault();
+                        adminBarMyAccount.classList.toggle( 'hover' );
+                }
         } );
 
         /**