Various components in mobile load code asynchronously. When you go offline, this code fails to load. We will introduce a generic error state for these situations.
This error state will show for the following workflows when loaded offline:
- editor
talk(to be removed in future)- mediaviewer
- languages
- editor
Environments Observed
Browser Version
- Chromium v68.0.3440.75
OS Version
- Ubuntu v18.04
Device Model
- Desktop
Device Language
- English
Related to T193172 but appears to be distinct.
Design
Perhaps we could introduce a generic "no internet connection" error here (assuming we know specifically what the issue is)? From there the user can "X" out of the editor. In terms of how long the timeout should be, how long does it take to detect? I think waiting for ~3-4 seconds would be fine.
Developer notes
This is actually a wide-spread problem. The LoadingOverlay has no fallbacko or timeout.
The LoadingOverlay is usually used resources/mobile.startup/rlModuleLoader.js and resources/mobile.special.nearby.scripts/nearby.js and resources/skins.minerva.talk/init.js
The same issue can be replicated for language overlay, category overlay and various other screens.
The EditorOverlay is a little more complicated as it isn't using the LoadingOverlay (when it should be) but if we had a generic mechanism for async loading we could use that.
Acceptance criteria
- A new generic "no internet connection" MessageBox error will be shown in the body of impacted overlays when a HTTP request fails
- The error state is shown on MediaViewer
- The error state is shown on language overlay
- The error state is shown on editor
- Workflows in QA step all show error feedback to the user
QA steps
The page cannot be interacted with and the action cannot be cancelled. It never times out.
Steps to Reproduce problem with media viewer
- In incognito window visit https://en.m.wikipedia.org/wiki/Spain
- Go offline
- Click an image
The page cannot be interacted with and the action cannot be cancelled. It never times out.
Steps to Reproduce problem with languages
- visit https://en.m.wikipedia.org/wiki/Spain
- Go offline
- Click the language icon.
No feedback is given to the user.
Steps to Reproduce problem with Editing
- Visit https://en.m.wikipedia.org/wiki/Barack_Obama
- Go offline
- Tap the edit pencil
Expected Results
- An error message is presented to inform the user that loading the editor failed
Actual Results
This header shows and the spinner never stops
