NO BUG: Hamburger menu in Safari problem when back button is clicked

Bugs
1

Browser: Chrome 110
OS: macOS

In Safari I have an issue in the front end where I open the hamburger menu and click on a link to another page, then when I click the back button in Safari, I get the opened hamburger menu again, not the previous page as I would have expected.

It’s happening only on safari on my Bricks sites, other sites with other builders are fine.

2

It’s not a bricks related bug.
Safari is restoring the page from its Back/Forward Cache (bfcache)

You can use this script to fix that (you may need to adjust it a little bit)

<script>
window.addEventListener('pageshow', function(e) {
  if (!e.persisted) return;

  document
    .querySelectorAll('.brxe-nav-nested.brx-open')
    .forEach(el => el.classList.remove('brx-open'));

  document
    .querySelectorAll('.brxe-toggle.is-active')
    .forEach(el => el.classList.remove('is-active'));

  document
    .querySelectorAll('.brxe-toggle[aria-expanded="true"]')
    .forEach(el => el.setAttribute('aria-expanded', 'false'));
});
</script>
3

Hi Sly,
Thanks so much for your report!

As Sahil already mentioned, this does not appear to be Bricks-specific. Safari restores pages from its back/forward cache and can preserve transient UI state, such as an opened mobile menu. The same behavior can be observed on sites not built with Bricks, so I would not classify this as a Bricks bug.

If you want to force the menu to close when Safari restores the page, you can add a small custom script that listens for the pageshow event and resets the menu state. Thanks @lonesahilnazir :v:

We can see if this becomes an issue for more users in the future—but for now, I don’t see any immediate need for action.

Best regards,
timmse

4

Understood, thanks. It’s not an issue on my other sites with different builders. But hey ho, just another little script to add.