3

When I use the back button on mobile (iOS 10.2.1) Safari or Chrome:

  • window's pageshow event is fired only once. suggested in: 1, 2, 3, 4, 5, 6, 7
  • window's popstate event is not fired. suggested in: 1, 2, 3
  • document's readystatechange event is not fired. suggested in: 1

Why do I need this?

I disable a submit button on click, so the form can't be submitted multiple times but when the user comes back to the page using the browser's back button, the submit button stays disabled because of the BFCache.

I need an event that is fired either when the user has left the page or when they come back so I can re-enable the submit button. The unload event is never fired, and the pagehide and pageshow events are fired only at the first time:

  1. I navigate from page A to page B.
  2. A's pagehide is fired (unload is not fired).
  3. I go back using the browser's back button.
  4. A's pageshow is fired (load, popstate or readystatechange are not fired).
  5. I navigate to B again, this time A's pagehide is not fired.
  6. I go back using the back button again, and A's pageshow is not fired either.
  7. Subsequent back/forward triggers no events I could find.

One workaround is refreshing the page in first back:

window.addEventListener('pageshow', function (e) {
    if (e.persisted) {
        window.location.reload();
    }
}, false);

But that defies the whole point of BFCache. Is there no reliable way to do some work when the browser's back button is used without reloading the whole page?

Community
  • 1
  • 1
Şafak Gür
  • 7,045
  • 5
  • 59
  • 96

2 Answers2

1

I accept morgoe's answer since there is no event that is reliable due to the bug he mentioned.

Here is a workaround for the desperate:
It disables the BF cache by reloading the page on first back using user agent sniffing to detect iOS browsers. 

window.addEventListener('pageshow', function (e) {
    e.persisted &&
    /iPad|iPhone|iPod/.test(navigator.userAgent) &&
    !window.MSStream &&
    window.location.reload();
}, false);
Şafak Gür
  • 7,045
  • 5
  • 59
  • 96
0

This seems to be a known bug with Webkit: https://bugs.webkit.org/show_bug.cgi?id=156356

morgoe
  • 350
  • 4
  • 16