1921460 - Update image and text on "no network" error page

Status: VERIFIED FIXED

(Firefox for Android :: Browser Engine, task)

Description

[Polly [:polly]]

Attachment: no-network-fox.png

We would like to replace the content of the "no network" error pages in Fenix with some new artwork and text.

Comment 1

[Aaditya Dhingra [:adhingra]]

Attachment: Bug 1921460 - Update image and text on "no network" error page

Comment 2

[Polly [:polly]]

Hello! Hoping this is an ok way to reach out for ux input on this, if this doesn't make sense i'm v happy to chat separately! :)
So looking at the Figma designs, there are a lot of new error pages that we would like to bring in, & this ticket is just for the no network page.
Currently in Fenix we have one template page for all of the error pages.
In the current template, the image and text are top aligned, but in the new pages the content is centred.
For this ticket, which just brings in the new network error page, would it be ok to modify the template so that the content of the previous page designs is also centred? I can attach an example of how that might look if it helps!

Comment 3

[Polly [:polly]]

Attachment: old-design-error-page-but-centred.png

Comment 4

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Fenix::Browser Engine' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 5

[Tiffanie Shakespeare [:tif]]

Hey polly - are you able to ping the ux folks, jeff p and nicole, via that the jira ticket and they can help answer the questions you have? thank you!

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/de72e3d60c7c
Update image and text on "no network" error page r=pollymce,android-reviewers

Comment 7

[agoloman]

https://hg.mozilla.org/mozilla-central/rev/de72e3d60c7c

Comment 8

[Delia Pop (Android QA)]

Attachment: Nightly 133.jpg

Verified as fixed in the latest Nightly 133.0a1 from 10/24 with Samsung Galaxy S22 Ultra (Android 14) and Google Pixel 8 Pro (Android 14).
The new content of the "no network" error pages is displayed.
We’ve also noticed an issue in which the “no network” error page defaults back to the previous design if the theme is changed while the error screen is displayed. Refreshing the page will update it to the latest design.
I’ll file a new ticket for this issue and link it here.

Comment 9

[Delia Pop (Android QA)]

Attachment: NetworkErrors.png

Polly, I also have a couple of questions regarding this change:

• 1. we've noticed a small mismatch between the Figma design and the screen displayed in app: the "Error Code: NS_ERROR_OFFLINE" text is displayed with white/black color, depending on the theme, while this is shown as purple in Figma. Is this indented?
• 2. before this change, we had 2 different error screens: one for when the network error occurs after the website is loaded, and one for when the network error occurs while the website is still loading. With this change, the updated error page is displayed in both cases. This is the expected result, correct?

Comment 10

[Polly [:polly]]

sorry, i got confused and answered these questions in jira (:
tl:dr; i. yes this is intended, we are removing the link for the offline case and ii. the second error screen is for "connection interrupted" which is a different scenario & we haven't updated the ui for that screen yet.