Changeset 51072

Timestamp:

06/04/2021 05:06:15 PM (5 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' );