Merge pull request #4024 from Automattic/add/d62296

Themes: Fix anchor link behavior on Varia/Seedlet child themes

seedlet/assets/js/primary-navigation.js

@@ -28,6 +28,19 @@
 			};
 		}
 
+		document.addEventListener( 'click', function( event ) {
+			// If target onclick is <a> with # within the href attribute
+			if ( event.target.hash && event.target.hash.includes( '#' ) ) {
+				wrapper.classList.remove( id + '-navigation-open' );
+				wrapper.classList.remove( 'lock-scrolling' );
+				// Wait 550 and scroll to the anchor.
+				setTimeout(function () {
+					var anchor = document.getElementById(event.target.hash.slice(1));
+					anchor.scrollIntoView();
+				}, 550);
+			}
+		} );
+
 		/**
 		 * Trap keyboard navigation in the menu modal.
 		 * Adapted from TwentyTwenty

varia/js/primary-navigation.js

@@ -27,6 +27,21 @@
 				toggleButton.focus();
 			}
 		}
+
+		document.addEventListener( 'click', function( event ) {
+			// If target onclick is <a> with # within the href attribute
+			if ( event.target.hash && event.target.hash.includes( '#' ) ) {
+				wrapper.classList.remove( 'lock-scrolling' );
+				if (toggleInput) {
+					toggleInput.checked = false;
+				}
+				// Wait 550 and scroll to the anchor.
+				setTimeout(function () {
+					var anchor = document.getElementById(event.target.hash.slice(1));
+					anchor.scrollIntoView();
+				}, 550);
+			}
+		} );
 	}
 
 	window.addEventListener( 'load', function() {