Safari Browser Back Button triggers modal

Hello everyone,

I’ve been stuck on this issue for over a day now and I can’t figure it out. I’m currently under NDA so I can’t show you the site just yet but I can explain it and hopefully that’ll give you the picture.

The page features expert profiles (Profile CMS Collection) with two buttons: View Profile and 30 Min. The View Profile (Profile CMS Collection) button leads to a profile page for that expert and the 30 Min (CMS item under Profile CMS Collection) button triggers a modal interaction with a Terms of Service paragraph and a “I Agree & Continue” button that would lead the user to an external link. The idea here is that before a user can continue to the external link, they have to read the TOS and click I agree.

The problem I have is when a user clicks on View Profile, they go to that particular profile page and when they go back using the browser back button (or swipe back on mobile), the modal is visible and opened. This seems to happen only in Safari. Chrome seems to be fine.

I tried custom code based on some google searches but I don’t think I did it correctly or perhaps it’s not the correct code.

<script>
window.onpageshow = function(event) {
if (event.persisted) {
    window.location.reload() 
}
};
</script>

I appreciate any suggestions or feedback!

Thank you!