1184779 - Make native javascript dialog windows look more like in-content preferences dialog

Status: RESOLVED DUPLICATE of bug 1678751

(Firefox :: Theme, defect)

Description

[Ryan Feeley [:rfeeley]]

Attachment: dialogs.zip

The current native javascript dialog windows are great in that they let users switch tabs, but they do not match the visual design of the in-content preferences dialogs.

Attached is a collection of the three kinds of windows shown in Firefox, Chrome and Safari on OS X.

Test them on Windows at the URL below.

Comment 1

[Michael Maslaney [:mmaslaney] ([e-mail])]

Proposed Design:
https://invis.io/T23RU01U5

Reference:
Shorlander's Panel Audit — 
https://bug1064257.bmoattachments.org/attachment.cgi?id=8504734
http://cl.ly/image/252B2g0K3P0H

Comment 2

[Ryan Feeley [:rfeeley]]

I like where this is headed, but what about single button dialogs? Or text input. Check the ZIP above. I think all the variations are covered.

Comment 3

[Ryan Feeley [:rfeeley]]

Bryan, take a look. These dialogs should arguably jive with control center visual design.

Comment 4

[Stephen Horlander [:shorlander]]

(In reply to Michael Maslaney [:mmaslaney] ([e-mail]) from comment #1)
> Proposed Design:
> https://invis.io/T23RU01U5
> 
> Reference:
> Shorlander's Panel Audit — 
> https://bug1064257.bmoattachments.org/attachment.cgi?id=8504734
> http://cl.ly/image/252B2g0K3P0H

Works for me. Although I don't know if we really need the Firefox icon in there.

(In reply to Ryan Feeley [:rfeeley] from comment #3)
> Bryan, take a look. These dialogs should arguably jive with control center
> visual design.

Yeah, should probably sync them up :)

Comment 5

[Justin Dolske [:Dolske]]

We should definitely not have the Firefox icon for in-content dialogs. They're invoked by web content, and can contain arbitrary content -- they're not messages from Firefox.

The main in-content prompts are from alert() / confirm() / prompt(), but it's an implementation shared with a common backend that can actually support more stuff in the dialog (4 buttons, a text field, a password field, and a checkbox). Although for the most past I think few of those extras are currently being used by us (dunno about addons).

Comment 6

[Ryan Feeley [:rfeeley]]

I'm not averse to the Firefox logo (Chrome and Safari both include their logos) as long as we include language that says something like they do (i.e. "The web page domain.com says:")

Good to know about extra features!

Comment 7

[Ryan Feeley [:rfeeley]]

I'm not sure if you want to make this a priority Phillip, but it seems like high impact & low effort way to improve the visual consistency of Firefox.

Comment 8

[(Currently slow to respond) Philipp Sackl [:phlsa] (Firefox UX) please use needinfo]

I have put this into our quality backlog.
I agree on the icon though — it would make the message look more official than it is (and it's attached to the tab anyway, so it always has the context of the Firefox window)

Comment 9

[Ryan Feeley [:rfeeley]]

Attachment: Leave Page

I see this dialog all the time and, because I assume it’s Firefox speaking, I think it could use a Firefox logo.

Comment 10

[Justin Dolske [:Dolske]]

That dialog in particular (aka onbeforeunload) has a long history of being abused by malicious sites trying to trap and/or scare the user into staying, so I'd especially not want to make it look like Firefox has anything to do with it.

Comment 11

[Ryan Feeley [:rfeeley]]

Attachment: facebook-leave-page.png

Semi-related: I noticed that Facebook has it's own UI for this. I don't want the Firefox logo to act as an endorsement, but a mediator with the preface "This webpage is asking…"

Comment 12

[Ryan Feeley [:rfeeley]]

Attachment: all.png

Comment 13

[Ryan Feeley [:rfeeley]]

Attachment: dialog-mismatch.png

Comment 14

[Tanvi Vyas[:tanvi]]

I agree with Justin that we don't want the Firefox logo in these dialogs.  We don't want them to appear like they are messages from Firefox.  They are messages from the actual content page.  It would be nice to add an indication of where the message is coming from though.  The way the second box in the last row does here - https://bug1184779.bmoattachments.org/attachment.cgi?id=8760828 (Safari Browser, w3schools asking for name input).

This may be particular useful if an iframe is invoking the prompt; that way the user knows which domain is asking for the information.

Comment 15

[Ryan Feeley [:rfeeley]]

No point in assigning this to Maslaney.

Comment 16

[Ryan Feeley [:rfeeley]]

Attachment: width.png

The maximum width could be reduced to make this dialog more legible. Match OS defaults?

Comment 17

[Mike Conley (:mconley) (:⚙️)]

I think with the Firefox 89 redesign changes, we can finally close this out.