[UX] Make the requestAutocomplete dialog feel more privileged (e.g. overlap chrome)




Form Manager
4 years ago
4 years ago


(Reporter: MattN, Assigned: phlsa)


Bug Flags:
firefox-backlog +

Firefox Tracking Flags

(Not tracked)


(Whiteboard: [ux] p=3 s=33.1 [qa-])


(1 attachment, 1 obsolete attachment)

+++ This bug was initially created as a clone of Bug #1020868 +++
UX version of bug 1020868.

Something like a tab-modal dialog which doesn't block page scripts and isn't trivial to spoof by content (e.g. overlapping the browser chrome). I don't know of any current Firefox UI doing this at the moment.

Also note that covering the identity of the website (i.e. the address bar) is probably not a good idea either as users should be able to verify the site they may be giving their information to.

Note that we should also do something about the case where a sub-frame (possibly on a different origin) calls requestAutocomplete (assuming this is allowed in the spec). We don't the user to be misled about the origin requesting autofill.
Flags: firefox-backlog+


4 years ago
Summary: [ux] Make the requestAutocomplete dialog feel more privileged (e.g. overlap chrome) → [UX] Make the requestAutocomplete dialog feel more privileged (e.g. overlap chrome)
Whiteboard: p= → [ux] p=0 [qa-]


4 years ago
Whiteboard: [ux] p=0 [qa-] → [ux] p=3 [qa-]


4 years ago
Assignee: nobody → philipp
Whiteboard: [ux] p=3 [qa-] → [ux] p=3 s=33.1 [qa-]
Matt, is there any preexisting UI for this or are we talking about the new autocomplete features that are currently in the works?
Flags: needinfo?(MattN+bmo)
It's not implemented yet. An initial version will come from bug 1020865. You can see what Chrome does by visiting https://googledrive.com/host/0B28BnxIvH5DueUxvWVNsQXd5dU0/ and trying to checkout.
Flags: needinfo?(MattN+bmo)
Created attachment 8439891 [details]
payment prompt mock

This uses the same tab-modal mechanism introduced in bug 977037.
I'm sure the content of the overlay can be further optimized. Michael, perhaps you can help me identify the things that diverge from the current chameleon spec.

But since this bug is just about the mechanism to display a form in the first place, that should help us move forward even in its current state.
Attachment #8439891 - Flags: ui-review?(mmaslaney)
Comment on attachment 8439891 [details]
payment prompt mock

Looking good, Philipp.

Couple tweaks I would recommend:

• The header should be using the "regular" weight
• Header should have equal top and bottom vertical spacing; try 24px for each
• Header needs to left-align with the labels
• Adjust the left and right margins to 14px, top and bottom to 24px-30px (see which looks best)
Attachment #8439891 - Flags: ui-review?(mmaslaney) → ui-review-
Created attachment 8441462 [details]
payment prompt mock v2

Thanks for the feedback Michael! Here's the updated mock.
Attachment #8439891 - Attachment is obsolete: true
Matt, does this cover the requirements you had in mind?

As for the iframe case: We should still leave the popup where it is, so that it looks privileged. The domain of the requesting site is shown inside the popup anyway.
Flags: needinfo?(MattN+bmo)
Yes, the design is fine except I'm wondering that the title would be when there is no payment information involved but I guess that may be another bug. The mockup has "Pay on someshopdomain.com". Did you always want to show the domain name in the title even when it matches the domain in the URL bar?
Flags: needinfo?(MattN+bmo)
Thanks Matt! Marking as resolved.
The domain should be shown at all times, possibly highlighted in some way if it doesn't match the domain in the location bar.
Last Resolved: 4 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.