$w.onReady() is not executed on Chrome for Android when user presses back button to return to my Wix page

When my page loads, the “loading” gif is hidden.
When my user clicks the Submit button, the “loading” gif is displayed, while the user is sent to an external website.

If the user presses back in their browser (on Android only, not on PC), the “loading” gif is still displayed. As per following code, it should hide in onReady(). This works on Chrome for Windows, but not on Chrome for Android.

It appears onReady() doesn’t run after they press back from an external site back to wix, on Android or iPhone.

$w.onReady(function () {
$w(‘#lottieEmbed1’).hide();
});
export function submitButton_click(event) {
$w(‘#lottieEmbed1’).show();
}

Thanks!
Dave

Hey Dave!

Indeed it doesn’t always. Is your question how can you catch them coming back to the page?

That back button may be loading an already cached version on Android to help with loading speed, the BF Cache or Backwards/Forwards Cache. There are a few deep coding ways to listen to the backwards navigation, but they may be overdoing it for your use case on Wix, especially since you would need to put it in Custom Code, not Velo.

  1. Navigation Event Listener

I’d personally set a timeout and see if that works. If not, see if the wixLocation.onChange event captures when they come back to the page

Hi Chris,

Thanks for your response, that was very helpful. The timeout idea works adequately; if the user presses back, the bf cache respects the timer and it keeps counting down. Here is the code in case anyone wants it, which I call from the submit button:

function waitForLoading() {
setTimeout(() => {
$w(‘#lottieEmbed1’).hide(‘FadeOut’);
}, 7000);
}

I also learnt about Custom Code thanks to your post - I didn’t realise that was a thing! I tried adding event listeners to navigate, pagehide and pageshow and they worked on desktop, but the mobile bf cache didn’t trigger them unfortunately, so I guess I’m stuck with the timer hack.

Thanks
Dave