Prevent users from leaving the settings without saving changes

Currently, I have an add-on that requires the user to save the changes that they make in the options manually. The add-on options are currently being run through Firefox’s add-on manager rather than opening in a new tab and I’d prefer to keep it that way, if possible.

What I would like is to get the “Are you sure you want to leave the unsaved changes” popup to appear if the user tries to close or navigate away from the options page without the changes saved. This works with a beforeunload listener if I open the options in a tab, but not if it’s opened in Firefox’s add-on manager.

Is there a way to get this functionality to work when the options open_in_tab value is set to false or am I forced to open the options in a tab instead?

If you really want to have manual save you can not prompt the user to make sure they don’t want to lose their changes. What you can do, however is always save thee current state when it changes to some storage so you can restore it when the user returns and have explicit UI to say “these are unsaved changes from last time”.

However, I find that having no explicit save is the most consistent with how other Firefox preferences work, and thus how users expect the extension to behave.

1 Like

Unfortunately, there’s a technical reason why I have to use an explicit save and the settings page also adjusts the appearance of an element, so it’s slightly better in my specific case to allow the user to experiment with the appearance while also giving them the ability to bail on those options.

I guess I will just move the options page to a new tab instead or just forget about adding this functionality.

Thanks for the response.

Another possibility would be to send information about the “dirty” state to your background script and when the user no longer is on the options page, show notification that he didn’t save.

1 Like

As another workaround, I use highlighting to show any changed options, and light up the save button the same color if there are any changes to save. Since all the options still fit in one page (I think), this is very noticeable. If the options get longer, I’m not sure it will be effective. In case of interest:

1 Like