Differrent behavior of history.back() in Chrome and Firefox
In Firefox, navigating back to a page (after a validation error) with history.back() or history.go(-1) loads an empty form. In Chrome, the form is reloaded with whatever content had been entered before Submit.
Sample code: <button onclick="history.go(-1)">Go Back</button>';
All Replies (10)
Firefox usually is very eager to cache pages for "fast back-forward" purposes, so that's a bit of a surprise. Does Firefox display any errors, or does it just reload the page? If Firefox reloads the page when going Back, it can indicate that the server instructed Firefox not to cache the page, but then I would expect other browsers to behave similarly.
One method to suss out an issue with settings or add-ons is:
New Profile Test
This takes about 3 minutes, plus the time to test your problem site(s).
Inside Firefox, type or paste about:profiles in the address bar and press Enter/Return to load it.
Take a quick glance at the page and make a mental note of which Profile has this notation: This is the profile in use and it cannot be deleted. That is your current default profile.
Click the "Create a New Profile" button, then click Next. Assign a name like Test2022, ignore the option to relocate the profile folder, and click the Finish button.
Firefox will switch your default profile to the new one, so click the Set as Default Profile button for your regular one to avoid an unwanted surprise at your next startup.
Scroll down to Test2022 and click its Launch profile in new browser button.
Firefox should open a new window that looks like a brand new, uncustomized installation. (Your existing Firefox window(s) should not be affected.) Please ignore any tabs enticing you to connect to a Sync account or to activate extensions found on your system to get a clean test.
Does the problem form work any better in the new profile?
When you are done with the experiment, you can close the extra window without affecting your regular Firefox profile. (Test2022 will remain available for future testing.)
Thanks for the quick reply. I did the steps without any problem, but still get the same result.
If you partially fill the form and then reload the page (Ctrl+R), does Firefox keep the data you entered so far? If not, then Firefox either is not caching the page or a script in the page clears the form. Do you have a page online that demonstrates the problem?
If I fill out the form, then submit, if it catches a validation error, the coding is alert(), then <button onclick="window.history.back()">Go Back</button>' and the field content should still be there for correction. This is how it works in Chrome and Internet Explorer/Edge. In Firefox, it loses the field contact.
Further information - Ctrl-R clears all the content in Firefox, Chrome and Edge.
rampisad said
If I fill out the form, then submit, if it catches a validation error, the coding is alert(), then <button onclick="window.history.back()">Go Back</button>' and the field content should still be there for correction. This is how it works in Chrome and Internet Explorer/Edge. In Firefox, it loses the field contact.
Yes, this much is clear. But the question is why.
I put up a very simple test case at https://www.jeffersonscher.com/res/request.html. Does that one work the way you would expect?
Your test works in both browsers. I think the difference comes because your form has action="requestfail.html"> - directing away to a separate screen. This is too simple for my problem, since I have a complex form that has to be validated field-by-field and needs to report the errors, not simply go to a screen that says "there was an error".
Thanks for the feedback.
rampisad said
Your test works in both browsers. I think the difference comes because your form has action="requestfail.html"> - directing away to a separate screen. This is too simple for my problem, since I have a complex form that has to be validated field-by-field and needs to report the errors, not simply go to a screen that says "there was an error".
Your script does not navigate to a different page? In that case, why do you need to use history.back()?
I think in order to understand this problem better, you need to share a link to a page demonstrating the problem. You might also try other resources such as StackOverflow.
Go to https://rampisad.com/email_gen_test.php. Enter all fields EXCEPT the ones marked *required. You will get a pop-up box reporting errors, and a button to go back. In Chrome & Edge, the fields have retained the content, but in Firefox, all fields are empty. My issue is that the code obviously works, the problem in purely related to Firefox.
Your test page sends this header:
Cache-Control: no-store, no-cache, must-revalidate
no-store is meant to prevent browsers from caching pages, and that applies to the fast back-forward cache, too, at least historically. Firefox also may rely on other signals not to add a page to the bfcache. If I understand correctly, Chromium-based browsers are supposed to work the same way (there is a proposal for an exception, but it hasn't been implemented yet). ??
- https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/1.5/Using_Firefox_1.5_caching
- https://chromestatus.com/feature/6705326844805120 (see also https://web.dev/bfcache/#minimize-use-of-cache-control-no-store)
I notice that your form tag doesn't have an action defined, causing the page to post to itself. If I set the action to the page's address (relative or absolute), then Edge behaves like Firefox. Maybe there is a "post to self" exception in Chromium-based browsers?