912445 - [User Story][System] Show specific information when there is a server connection issue with an application

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::System, defect)

Description

[Marcelino Veiga Tuimil [:sonmarce]]

As a user I want to be specifically informed about server connection issues when launching an app or the application requesting a top level page load, that will allow me to fully understand why the app is not working and try again

Acceptance criteria:
* Assuming I have connection through WiFi or data but having server side connectivity problems with a given app
* In such scenarios like NET TIMEOUT, UNKNOWN HOST, CONNECTION REFUSED, NOT FOUND & INTERNAL SERVER ERROR, I am properly informed with a user friendly error message covering the different server errors
* After I am informed that there is a server connection error, I would have following options:
  * I can attempt to reload the page without closing and relaunching the app, being informed again about server connection error in case of page reload still fails
  * I can ignore the message received, to be taken to the previous position in the app if one exists, or exited out of the app in case of being on the app entry point

Comment 1

[Michael Henretty [:mikehenrty][:mhenretty]]

(:vingtetun comments from bug 882186)
> About the implementation for this one I would like to do that at a
> Gecko level for some parts since a long time. For instance it would be good
> if we can specify an error page as an URI (one from the system app for
> example) into the Settings database for errors handling.
> 
> It would make it easy to have a system wide error handling both the system
> app and the browser app as well as having the error page living literally
> inside the app instead of having to maintain a overlay on top of it as it is
> done today.
> 
> Also the current situation is a bit weird since the overlay is displayed on
> top of the actual error page :/


Right now the system app detects when apps gets the Blue Screen (mozbrowsererror) and displays an overlay over the app containing messaging and resolution action buttons. Vivien is suggesting we make changes at the gecko level that will allow us to specify a custom error page that gets displayed instead of this default Blue Screen, and then do away with the overlay. If we do not end up doing this as a part of bug 882186, it would be nice to do this here.

Comment 2

[Peter Dolanjski [:pdol]]

UX team, we could use your input on this.  In the context of the Browser, more explanation on the errors might be expected, but not as much so in the app context.  These may merge, so guidance is needed.

Comment 3

[Stephany Wilkes]

Thanks, Peter. I am flagging both Tiffanie and Rob on this until Francis returns on Sept. 23. We've been leaning toward doing this for 1.3 (for showing users better error information about why they lose connectivity, for instance) so it may be time for an OS-wide re-evaluation of error messages. Timeline wise, is this 1.3 or koi?

Comment 4

[Candice Serran (:cserran)]

ALBERTO CRESPELL PEREZ changed story state to started in Pivotal Tracker

Comment 5

[Rob MacDonald [:robmac]]

Although Francis is away this week, he did prepare an error handling doc for bug 882126. The attachment is located here:

https://bugzilla.mozilla.org/attachment.cgi?id=785312&action=edit

Comment 6

[Peter Dolanjski [:pdol]]

Marce, can you provide Francis with a list of all possible error messages for this story?

Comment 7

[Marcelino Veiga Tuimil [:sonmarce]]

There are some documentation here: https://wiki.mozilla.org/images/c/ca/Gaia_Errors_v1_20120805.pdf

Comment 8

[Jason Smith [:jsmith]]

Not a committed feature, so we don't need to block on this.

Comment 9

[Jason Smith [:jsmith]]

All targeted features for 1.3 have no plans to land for 1.3 anymore, so moving this off the tracker bug.

Comment 11

[Stephany Wilkes]

This is a feature request, not a bug. UX agrees that we need messages for when the device has a connection and the server is down. We need more error handling use cases, but we believe these use cases should be covered by the Sys FE backlog for 1.4 and beyond, at which point we can create specs for them. 

We believe Peter is already well aware of this need, as this bug is already blocking 1.4-systems-fe, so removing the request for UX, as this needs to be raised at the backlog level.

Comment 12

[rafael.marquez]

I'm defining test cases and I need offline experience Wireframes . Can you tell me where is the latest version?

Comment 13

[Francis Djabri [:djabber]]

(In reply to Marcelino Veiga Tuimil [:sonmarce] from comment #7)
> There are some documentation here:
> https://wiki.mozilla.org/images/c/ca/Gaia_Errors_v1_20120805.pdf

Hi Marce, 

I'm afraid that I didn't find this documentation very informative. I didn't see any documentation relating to NET TIMEOUT, UNKNOWN HOST, CONNECTION REFUSED, NOT FOUND & INTERNAL SERVER ERROR. Is there any description of these different error conditions I can refer to, and are there other error conditions that I need to specify for?

Thanks, 

Francis

Comment 14

[Francis Djabri [:djabber]]

(In reply to rafael.marquez from comment #12)
> I'm defining test cases and I need offline experience Wireframes . Can you
> tell me where is the latest version?

The latest wireframes are available on Box at:
https://mozilla.box.com/s/q3mh4svgs5lg63cf68us

Comment 15

[Marcelino Veiga Tuimil [:sonmarce]]

(In reply to Francis Djabri [:djabber] from comment #13)
> (In reply to Marcelino Veiga Tuimil [:sonmarce] from comment #7)
> > There are some documentation here:
> > https://wiki.mozilla.org/images/c/ca/Gaia_Errors_v1_20120805.pdf
> 
> I'm afraid that I didn't find this documentation very informative. I didn't
> see any documentation relating to NET TIMEOUT, UNKNOWN HOST, CONNECTION
> REFUSED, NOT FOUND & INTERNAL SERVER ERROR. Is there any description of
> these different error conditions I can refer to, and are there other error
> conditions that I need to specify for?

There is a link in the document with all the information: http://hg.mozilla.org/mozilla-central/file/5b3bf49ce3cf/docshell/base/nsDocShell.cpp#l3930

Well, it is not easy to read, as it a peace of code, but it is the only information I have, maybe you can ask the module owner (some details in first lines)

Comment 16

[Axel Hecht [:Pike]]

I don't think that the UX from the gecko side is good, see also bug 970478.

Also, the gecko strings are generally not localized in b2g builds, due to disk size concerns.

Comment 17

[Francis Djabri [:djabber]]

Hi Marce, 

I went to see Michael Henretty this morning to see if he could give me more information about the different error conditions. It seems like there are a large number of messages, many of which could be made to be more user-friendly or simplified for the user. Could you be more specific about which errors need redesigning? The requirement mentions: "In such scenarios like NET TIMEOUT, UNKNOWN HOST, CONNECTION REFUSED, NOT FOUND & INTERNAL SERVER ERROR" but could you give me an indication of what the key scenarios are? Thanks, Francis

Comment 18

[Albert [:albert]]

Attachment: List of errors.

List of available errors.

Comment 19

[Marcelino Veiga Tuimil [:sonmarce]]

After having a look to those errors, I think most of them are not suitable to be shown to a user, so I would suggest UX to group the ones that are similar, so that implementation can do the translation from the internal error code to the message to be displayed to the user

Comment 20

[Marcelino Veiga Tuimil [:sonmarce]]

Also for other kind of errors different from the ones included in the attachment, we could show a generic error like "server temporary unavailable" or something similar

Comment 21

[Francis Djabri [:djabber]]

Attachment: General-error-message.jpg

Here is a proposal on some new error handling for these errors. They should all follow the general style in the attachment, but with the following text. Please let me know if you have any comments. 


--------------
fileNotFound  
Title: File not found
Copy: The device can't display this page because the file cannot be found. 

If the error was triggered following the user entering a URL (i.e., not by following a link), the error should be:

Title: File not found
Copy: The device can't display this page because the file cannot be found. Try searching for the file instead. 
------------------------
dnsNotFound  
Title: Page not found
Copy: Can't reach the page because the server could not be found. Try searching instead. 
----------------------------
connectionFailure  
netInterrupt  
netTimeout  
netReset  
unknownSocketType  
unknownProtocolFound  
cspFrameAncestorBlocked  

All these errors should be handled in the same way:

Title: Unable to connect
Copy: A network error occurred while trying to reach the site. 
Button label: <Try again>

Would it be able to display more further information in a "developer mode" that developers could switch on in settings?


-------------------
phishingBlocked  
Title: Warning<icon>
Copy: The website at {url} has been reported as a web forgery designed to trick users into sharing personal or financial information.
Buttons: Proceed anyway

--------------------------------
malwareBlocked  T
Title: Malware attack blocked
Copy: The site at has been reported as an attack site and has been blocked. 

----------------------------------
malformedURI 
Title: URL not valid
Copy: The URL entered is not valid and cannot be loaded. 

This error should not be shown if the user tried to enter a URL. Instead, the browser should perform a search based on what the user entered. 

-------------------------------------
redirectLoop  
Title: Can't display page
Copy: The device can't display this page because the page is not redirecting properly. Try this page again at a later time.
----------------------------------------------

notCached
Title: Secure page expired
Copy: As a security precaution, this secure page cannot be displayed by the device because it has expired.   
Button: <Request again>
----------------------------------------
netOffline  
I'm assuming that this will not be shown since the Browser has no "offline mode" or else is covered in other offline errors that have been worked on in 1.4

-------------------------------------------------
isprinting  
(no title)
Copy: The document cannot change while Printing or in Print Preview.  
--------------------------------------------
deniedPortAccess  
Title: This address is restricted
Copy: This address uses a network port which is normally used for purposes other than Web browsing. The device has cancelled the request for your protection. 

------------------------------------------------
proxyResolveFailure  
Title: Proxy Server Error
Copy: The device is configured to use a proxy server that can't be found. ---------------------------------------------------

proxyConnectFailure  

Title: Proxy Server Error
Copy: The device is configured to use a proxy server that is refusing connections. 
-----------------------------------------------------
contentEncodingError  
Title: Can't display page
Copy: The device can't display this page because a content encoding error occurred. 

----------------------------------------------------
remoteXUL  

Title: Page unsupported
Copy: This page can't be displayed because it uses a technology that is not supported on the device. 
-----------------------------------------------------

unsafeContentType  
Title: Unsafe content
Copy: The page cannot be shown because it may not be safe to open. -----------------------------------------------

corruptedContentError  
Title: Can't display page
Copy: The page cannot be shown because an error in the data transmission was detected.

Comment 22

[Marcelino Veiga Tuimil [:sonmarce]]

(In reply to Francis Djabri [:djabber] from comment #21)

Hi! Albert and I were reviewing the list, and here are our comments

> fileNotFound  
> Title: File not found
> Copy: The device can't display this page because the file cannot be found. 
> 
> If the error was triggered following the user entering a URL (i.e., not by
> following a link), the error should be:
> 
> Title: File not found
> Copy: The device can't display this page because the file cannot be found.
> Try searching for the file instead. 

It does not make sense for us the case of entering a URL in this context, as it would be something to be handled by the application

> connectionFailure  
> netInterrupt  
> netTimeout  
> netReset  
> unknownSocketType  
> unknownProtocolFound  
> cspFrameAncestorBlocked  
> 
> All these errors should be handled in the same way:
> 
> Title: Unable to connect
> Copy: A network error occurred while trying to reach the site. 
> Button label: <Try again>

We see here two different groups:
* connectionFailure, netInterrupt, netTimeout & netReset: temporary error, so possible to retry
* unknownSocketType, unknownProtocolFound & cspFrameAncestorBlocked: permanent error, retry does not make sense

> Would it be able to display more further information in a "developer mode"
> that developers could switch on in settings?

We could add the real message in logcat for debugging

> phishingBlocked  
> Title: Warning<icon>
> Copy: The website at {url} has been reported as a web forgery designed to
> trick users into sharing personal or financial information.
> Buttons: Proceed anyway

We need to investigate if it is possible to implement "proceed anyway" behavior

> malwareBlocked  T
> Title: Malware attack blocked
> Copy: The site at has been reported as an attack site and has been blocked.

It could make sense to add also "proceed anyway" button, but need to investigate if it is possible to implement it

> notCached
> Title: Secure page expired
> Copy: As a security precaution, this secure page cannot be displayed by the
> device because it has expired.   
> Button: <Request again>

We do not understand why you refer a "secure" page

Besides we miss a default error message for the case of unexpected error not in this list, something like "temporary server error", also including a "retry" button

Comment 23

[Francis Djabri [:djabber]]

Hi Marce! Thank you and Albert for your comments, that's very helpful. 

(In reply to Marcelino Veiga Tuimil [:sonmarce] from comment #22)
> (In reply to Francis Djabri [:djabber] from comment #21)
> 
> Hi! Albert and I were reviewing the list, and here are our comments
> 
> > fileNotFound  
> > Title: File not found
> > Copy: The device can't display this page because the file cannot be found. 
> > 
> > If the error was triggered following the user entering a URL (i.e., not by
> > following a link), the error should be:
> > 
> > Title: File not found
> > Copy: The device can't display this page because the file cannot be found.
> > Try searching for the file instead. 
> 
> It does not make sense for us the case of entering a URL in this context, as
> it would be something to be handled by the application
> 

Ok, I thought that this might be an error that could be triggered by the user. But if not, then great, it makes it simpler :)

> > connectionFailure  
> > netInterrupt  
> > netTimeout  
> > netReset  
> > unknownSocketType  
> > unknownProtocolFound  
> > cspFrameAncestorBlocked  
> > 
> > All these errors should be handled in the same way:
> > 
> > Title: Unable to connect
> > Copy: A network error occurred while trying to reach the site. 
> > Button label: <Try again>
> 
> We see here two different groups:
> * connectionFailure, netInterrupt, netTimeout & netReset: temporary error,
> so possible to retry
> * unknownSocketType, unknownProtocolFound & cspFrameAncestorBlocked:
> permanent error, retry does not make sense

Ok, if it doesn't make sense, let's not include it. By the way, could you let me know the technical meanings of the connectionFailure and the unknownSocketType errors? 
 
> > phishingBlocked  
> > Title: Warning<icon>
> > Copy: The website at {url} has been reported as a web forgery designed to
> > trick users into sharing personal or financial information.
> > Buttons: Proceed anyway
> 
> We need to investigate if it is possible to implement "proceed anyway"
> behavior
> 
> > malwareBlocked  T
> > Title: Malware attack blocked
> > Copy: The site at has been reported as an attack site and has been blocked.
> 
> It could make sense to add also "proceed anyway" button, but need to
> investigate if it is possible to implement it
> 
It fits in with our values to give the user the choice here if we can. I wasn't so sure about the case of Malware. If we're putting the user in immediate danger by letting them proceed, then perhaps we should err on the side of caution. 

> > notCached
> > Title: Secure page expired
> > Copy: As a security precaution, this secure page cannot be displayed by the
> > device because it has expired.   
> > Button: <Request again>
> 
> We do not understand why you refer a "secure" page

I did this on the advice of the Firefox team - they thought that this error can only be launched for https pages, which is why they use the term 'secure', but they are checking into this. 

> 
> Besides we miss a default error message for the case of unexpected error not
> in this list, something like "temporary server error", also including a
> "retry" button

Could we use the same error as the other connection failures above?

Title: Unable to connect
Copy: A network error occurred while trying to reach the site. 
Button label: <Try again>

Comment 24

[Albert [:albert]]

(In reply to Francis Djabri [:djabber] from comment #23)
> Hi Marce! Thank you and Albert for your comments, that's very helpful. 
> 
> (In reply to Marcelino Veiga Tuimil [:sonmarce] from comment #22)
> > (In reply to Francis Djabri [:djabber] from comment #21)
> > 
> > > connectionFailure  
> > > netInterrupt  
> > > netTimeout  
> > > netReset  
> > > unknownSocketType  
> > > unknownProtocolFound  
> > > cspFrameAncestorBlocked  
> > > 
> > > All these errors should be handled in the same way:
> > > 
> > > Title: Unable to connect
> > > Copy: A network error occurred while trying to reach the site. 
> > > Button label: <Try again>
> > 
> > We see here two different groups:
> > * connectionFailure, netInterrupt, netTimeout & netReset: temporary error,
> > so possible to retry
> > * unknownSocketType, unknownProtocolFound & cspFrameAncestorBlocked:
> > permanent error, retry does not make sense
> 
> Ok, if it doesn't make sense, let's not include it. By the way, could you
> let me know the technical meanings of the connectionFailure and the
> unknownSocketType errors? 

connectionFailure is related with socket connections. Those can have 4 states: CONNECTING, OPEN, CLOSING and CLOSED. The error is triggered when the socket is closed while in CONNECTING state. At a higher level, for example connectionFailure will be produced when you try to open localhost:5000 on your pc and port 5000 is closed.

unknownSocketType is related to an inability to deal with SSL connections.

> > 
> > Besides we miss a default error message for the case of unexpected error not
> > in this list, something like "temporary server error", also including a
> > "retry" button
> 
> Could we use the same error as the other connection failures above?
> 
> Title: Unable to connect
> Copy: A network error occurred while trying to reach the site. 
> Button label: <Try again>

ok.

Comment 25

[Albert [:albert]]

Attachment: Screenshot error with retry

Comment 26

[Albert [:albert]]

Attachment: Screenshot error no retry

Comment 27

[Albert [:albert]]

Francis as we have two types of error screens I uploaded each of one, when I get your r+ I'll upload the whole screens.

I still need some clarifications about previous comments:

1) I go ahead making a group for connectionFailure, netInterrupt, netTimeout & netReset and another one for unknownSocketType, unknownProtocolFound & cspFrameAncestorBlocked. For the first one I used the title and text you provided in comment 21:

    Title: Unable to connect
    Copy: A network error occurred while trying to reach the site. 
    Button label: <Try again>

  What should I use for the second group?

2) phishingBlocked & malwareBlocked errors will not work because protection is not implemented in Firefox OS (I opened Bug 987684), so we can't allow the user to "proceed anyway". Despite both errors will not be triggered, I implemented the error screen with a close button.

Comment 28

[Francis Djabri [:djabber]]

(In reply to Albert [:albert] from comment #27)
> Francis as we have two types of error screens I uploaded each of one, when I
> get your r+ I'll upload the whole screens.

I just had a question about how these error screens appear. I've been assuming so far that these error messages would be shown with the browser chrome showing. Is it possible for these errors to appear with the browser chrome showing? If so, we should avoid using the "overlay" style, and instead show the errors in the style I showed in comment #21 above. However, if we know that the browser chrome will not show, then the overlay style is fine. I have some comments however that I'll add to the review requests. 

> 
> I still need some clarifications about previous comments:
> 
> 1) I go ahead making a group for connectionFailure, netInterrupt, netTimeout
> & netReset and another one for unknownSocketType, unknownProtocolFound &
> cspFrameAncestorBlocked. For the first one I used the title and text you
> provided in comment 21:
> 
>     Title: Unable to connect
>     Copy: A network error occurred while trying to reach the site. 
>     Button label: <Try again>
> 
>   What should I use for the second group?

Let's use the same Title and Copy but without the Try Again button, unless you feel that this doesn't make sense. 

> 
> 2) phishingBlocked & malwareBlocked errors will not work because protection
> is not implemented in Firefox OS (I opened Bug 987684), so we can't allow
> the user to "proceed anyway". Despite both errors will not be triggered, I
> implemented the error screen with a close button.

ok, that's fine with me.

Comment 29

[Francis Djabri [:djabber]]

Comment on attachment 8396466 [details]
Screenshot error with retry

The fonts look wrong to me here. Eric, could you provide the right fonts for Albert?

Comment 30

[Francis Djabri [:djabber]]

Comment on attachment 8396468 [details]
Screenshot error no retry

As with the other screen shot, the fonts look wrong and too small. In addition, if we only have one button to display, it should be full width.

Comment 31

[Albert [:albert]]

Attachment: Screenshot no frame error with retry

Comment 32

[Albert [:albert]]

Attachment: Screenshot no frame error no retry

Comment 33

[Albert [:albert]]

Attachment: Screenshot framed error

Comment 34

[Eric Pang [:epang] UX]

Hi, the font size still looks off to me.  Are the building blocks being used?  They should look like this: http://buildingfirefoxos.com/building-blocks/confirm.html

Thanks!

Comment 35

[Albert [:albert]]

(In reply to Eric Pang [:epang] from comment #34)
> Hi, the font size still looks off to me.  Are the building blocks being
> used?  They should look like this:
> http://buildingfirefoxos.com/building-blocks/confirm.html
> 
> Thanks!

Arnau told me to use 2.3rem for title and 1.5rem for the message. I'll check again with him.

Comment 36

[Albert [:albert]]

Attachment: Screenshot no frame error with retry

Comment 37

[Albert [:albert]]

Attachment: Screenshot no frame error no retry

Comment 38

[Albert [:albert]]

(In reply to Eric Pang [:epang] from comment #34)
> Hi, the font size still looks off to me.  Are the building blocks being
> used?  They should look like this:
> http://buildingfirefoxos.com/building-blocks/confirm.html
> 
> Thanks!

Some errors fixed.

Comment 39

[Francis Djabri [:djabber]]

Comment on attachment 8401123 [details]
Screenshot framed error

The alignment of the button with the text is wrong here. Amy, Eric, could you provide the right specs, please?

Comment 40

[Francis Djabri [:djabber]]

> > > notCached
> > > Title: Secure page expired
> > > Copy: As a security precaution, this secure page cannot be displayed by the
> > > device because it has expired.   
> > > Button: <Request again>
> > 
> > We do not understand why you refer a "secure" page
> 
> I did this on the advice of the Firefox team - they thought that this error
> can only be launched for https pages, which is why they use the term
> 'secure', but they are checking into this. 

Albert, thanks for the updates. The confirm-style dialogs look fine to me, there was just an issue around alignment for the framed style. 

Also, re: the "notCached" error, I received a correction from the FF team - the error is not just launched for https pages, so you're right, there is no need to mention a "secure" page. The error should therefore be:


Title: Page expired
Copy: As a security precaution, this page cannot be displayed by the device because it has expired.   
Button: <Request again>

Comment 41

[Albert [:albert]]

Attachment: Screenshot framed error

Comment 42

[Albert [:albert]]

Attachment: Patch

Comment 43

[Amy Lee [:amylee] UX]

Attachment: Browser_FileNotFound_Specs.png

Hi, 

Here is the spec for the "File not found" error message for the browser. Let me know if you have any questions

Comment 44

[Francis Djabri [:djabber]]

Comment on attachment 8402585 [details]
Screenshot framed error

Please correct as per Amy's spec in comment 43.

Comment 45

[Albert [:albert]]

Attachment: Screenshot framed error

Comment 46

[Michael Henretty [:mikehenrty][:mhenretty]]

Comment on attachment 8402590 [details]
Patch

Comments added on Github. We also need tests.

Comment 47

[Francis Djabri [:djabber]]

Comment on attachment 8403182 [details]
Screenshot framed error

Thanks, Albert!

Comment 48

[Albert [:albert]]

Comment on attachment 8402590 [details]
Patch

Changes from previous comments.

Regarding to tests, I've added one test. Currently we have three screens: ConfirmAppErrorView, AlertAppErrorView and FramedErrorView. Test for 'DnsNotFound' covers ConfirmAppErrorView and FramedErrorView, so I added one test for 'FileNotFound' in order to cover AlertAppErrorView. Is that enough or do you want one test per error message?

Comment 49

[Albert [:albert]]

Clearing ni because ui-review+

Comment 50

[Michael Henretty [:mikehenrty][:mhenretty]]

Comment on attachment 8402590 [details]
Patch

r+ with a couple of nits on github. Excellent job on this patch! (sorry about the long turnaround time)

Regarding tests, I agree with you that one additional test for AlertAppErrorView should be sufficient. Let's land this!

Comment 51

[Albert [:albert]]

Master: https://github.com/mozilla-b2g/gaia/commit/6fe41763570a82131ba3266a0ed92de8e9d92de4