diff --git a/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js b/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js index c53af8268c..8b3739865f 100644 --- a/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js +++ b/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js @@ -120,6 +120,19 @@ function twentytwentyoneExpandSubMenu( el ) { // jshint ignore:line }; } + // Add aria-controls attributes to primary sub-menu. + var subMenus = document.querySelectorAll( '.primary-menu-container .sub-menu' ); + subMenus.forEach( function( subMenu, index ) { + var parentLi = subMenu.closest( 'li.menu-item-has-children' ); + subMenu.id = 'sub-menu-' + ( index + 1 ); + if ( parentLi ) { + var parentLink = parentLi.querySelector( 'button' ); + if ( parentLink ) { + parentLink.setAttribute( 'aria-controls', subMenu.id ); + } + } + } ); + /** * Trap keyboard navigation in the menu modal. * Adapted from Twenty Twenty.