801891 - Fullscreen approval UI should be modal

Status: RESOLVED FIXED

(Firefox :: General, defect)

Description

[Chris Pearce [:cpearce (Not reading bugmail)]]

The fullscreen approval UI dialog should be modal, i.e. the user should not be able to interact with the page while the <browser> has dimmed its content while the fullscreen approval dialog is showing. This is to force the user to pay attention to the dialog, and increase the likelihood the user actually reads it.

I'd previously been using pointer-events:none thinking that it would achieve this, but it turns out I didn't test it properly and pointer-events:none isn't inherited into descendents of the <browser>, so I think we should use -moz-user-focus:none, which is what we use to make window.alert() modal.

Comment 1

[Chris Pearce [:cpearce (Not reading bugmail)]]

Attachment: Patch: Make fullscreen approval UI modal

Use -moz-user-focus:none; instead of pointer-events:none, so that users can't interact with web pages while the fullscreen approval UI is showing. This forces them to acknowledge the approval UI, making it more likely that they actually read it.

Comment 2

[Dão Gottwald [:dao]]

Comment on attachment 671621 [details] [diff] [review]
Patch: Make fullscreen approval UI modal

> #full-screen-warning-container {
>-  pointer-events: none;
>+  -moz-user-focus: none !important;
>   position: fixed;
>   top: 0;
>   left: 0;
>   width: 100%;
>   height: 100%;
> }

This node should already be unfocusable by default, -moz-user-focus:none should be a no-op. Seems like you just want to drop pointer-events:none.

(In reply to Chris Pearce (:cpearce) from comment #0)
> I'd previously been using pointer-events:none thinking that it would achieve
> this, but it turns out I didn't test it properly and pointer-events:none
> isn't inherited into descendents of the <browser>, so I think we should use
> -moz-user-focus:none, which is what we use to make window.alert() modal.

You weren't setting pointer-events:none on the browser, so it can't have any effect on that. As opposed to the tab-modal alert() UI, you're not setting -moz-user-focus:none on the browser either.

Comment 3

[Chris Pearce [:cpearce (Not reading bugmail)]]

Attachment: Patch v2: Remove pointer-events:none from fullscreen approval UI

Thanks for your comments Dão, removing pointer-events:none does the trick.

Comment 4

[Dão Gottwald [:dao]]

Comment on attachment 672020 [details] [diff] [review]
Patch v2: Remove pointer-events:none from fullscreen approval UI

This is probably good enough for now, although I suppose the content area can still be reached with the TAB key.

Comment 5

[Chris Pearce [:cpearce (Not reading bugmail)]]

https://hg.mozilla.org/integration/mozilla-inbound/rev/ff8cdd87d8c1

Comment 6

[(no longer active)]

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