Prevent or warn about offline status before submitting a form

[johnbillion]

For browsers that support it, the navigator.online property reliably indicates that the browser is offline (the inverse isn't true, but it doesn't matter).

Prior to submission of a form in the admin area (for example the post editing screen form), WordPress should check the value of navigator.online and present a prompt to the user stating that they appear to be offline. They can close the prompt or, optionally, ignore it and continue with the form submission.

This functionality would help prevent data loss when a user submits a form while they don't have an internet connection.

[johnbillion]

The online and offline events can also be used to detect a change in connectivity state. More info: ​https://mxb.at/blog/youre-offline/

[antonioeatgoat]

Created the common function and added some of the checks

[antonioeatgoat]

The patch contains the common function to check the offline status and display the alert. So I added the check to post editing (creation|updating), post inline editing, menu editing (creation|updating).

It needs to be added to many places yet, I'll do it in the next days, suggestions about what forms cannot be missed are appreciated.

[antonioeatgoat]

Simplified showNotice.warn()

[antonioeatgoat]

Replying to johnbillion:

The online and offline events can also be used to detect a change in connectivity state. More info: ​https://mxb.at/blog/youre-offline/

How do you expect to use the listeners exactly? Showing an alert with "You are offline" and "You are online again" or something else?

[antonioeatgoat]

Replying to antonioeatgoat:

Replying to johnbillion:

The online and offline events can also be used to detect a change in connectivity state. More info: ​https://mxb.at/blog/youre-offline/

How do you expect to use the listeners exactly? Showing an alert with "You are offline" and "You are online again" or something else?

Replying to myself: the listeners could be used to trigger heartbeat-connection-lost and heartbeat-connection-restored, in order to show the alert and disable the submit buttons. At least where this feature already exists.

However I wouldn't remove totally the warn solution previously sent, because it is much easier to apply to all other forms.

[joyously]

For UX:
The user that is using WordPress on localhost should not be prevented from submitting even if offline, so I think the original idea of using a message on submit that the user can close and submit anyway would work best. If the submit is disabled, that is too restrictive since one of the goals of the way WordPress is packaged is that the user can work offline.

[johnbillion]

localhost isn't offline, it's a server running locally.

Although this ticket covers more than just the post editor, here's a related Gutenberg issue: ​https://github.com/WordPress/gutenberg/issues/6322

[antonioeatgoat]

So don't you think that also the check without Gutenberg would worth? Otherwise any post type without Gutenberg would lose this feature.

Did I miss something?