Changeset 51072

Timestamp:

06/04/2021 05:06:15 PM (3 years ago)

Author:

ryelle

Message:

Twenty Twenty-One: Check for navigation element before using it.

This prevents a javascript error in case the primary navigation has been removed, for example in a child theme.

Props sushmak.
Fixes #52773.

File:

• trunk/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js (modified) (2 diffs)

trunk/src/wp-content/themes/twentytwentyone/assets/js/primary-navigation.js

@@ -97 +97 @@
     var navMenu = function( id ) {
         var wrapper = document.body, // this is the element to which a CSS class is added when a mobile nav menu is open
-            mobileButton = document.getElementById( id + '-mobile-menu' );
+            mobileButton = document.getElementById( id + '-mobile-menu' ),
+            navMenuEl = document.getElementById( 'site-navigation' );
+
+        // If there's no nav menu, none of this is necessary.
+        if ( ! navMenuEl ) {
+            return;
+        }
 
         if ( mobileButton ) {
@@ -168 +174 @@
         } );
 
-        document.getElementById( 'site-navigation' ).querySelectorAll( '.menu-wrapper > .menu-item-has-children' ).forEach( function( li ) {
+        navMenuEl.querySelectorAll( '.menu-wrapper > .menu-item-has-children' ).forEach( function( li ) {
             li.addEventListener( 'mouseenter', function() {
                 this.querySelector( '.sub-menu-toggle' ).setAttribute( 'aria-expanded', 'true' );