1157526 - Replace super toasts with snackbar

Status: RESOLVED FIXED

(Firefox for Android Graveyard :: General, defect)

Description

[Martyn Haigh (:mhaigh)]

According to the docs [1] "Toasts are similar to snackbars but _do not contain actions_ ...".  We should remove our super toasts and replace them with snackbars [1] to ensure parity.


1: http://www.google.com/design/spec/components/snackbars-toasts.html#

Comment 1

[Mark Finkle (:mfinkle) (use needinfo?)]

Mr. Cranky Pants says "I'd rather get some of our stability work and glaring polish work underway, and delay this change for a while."

Comment 2

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

^ I'd agree, especially due to snack bar support for non-L versions. 

Maybe this is something we can do for just L versions? would that be easier?

Comment 3

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

^ Although, even then - I can see a lot of cases in our UI that this might be more finicky in than anticipated.

Comment 4

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

(In reply to Anthony Lam (:antlam) from comment #2)
> ^ I'd agree, especially due to snack bar support for non-L versions. 

Or any versions! Apparently there is no official API yet [1] so maybe we should hold out for the (presumably to-be-released) Google API.

[1]: https://stackoverflow.com/questions/25633695/is-there-code-for-snackbars-in-android-l-or-are-we-expected-to-implement-them-ou

Comment 5

[Paul [pwd]]

Any chance we can get this back up for consideration? With the changes to the tabs tray, the current toasts are now blocking content. This is something we wouldn't have to worry about if we used the suggested SnackBar experience since they hug the bottom of the screen. Meaning that if a user is swiping away a few tabs, the perception of the blocked area is significantly smaller.

Plus we now have backwards compatibility thanks to the Android Design Support Library: http://developer.android.com/tools/support-library/features.html#design

Comment 6

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

(In reply to Paul [pwd] from comment #5)
> Plus we now have backwards compatibility thanks to the Android Design
> Support Library:
> http://developer.android.com/tools/support-library/features.html#design

Note: there are some concerns about how this might grow our APK size (see bug 1189306). But presumably we'll need to add it eventually...

Comment 7

[:Margaret Leibovic]

Should we re-prioritize this? It would help with issues like bug 1204760.

Comment 8

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

How much engineering effort is this? I'd love to progress all our toasts to snack bars. I think this would move us a huge step closer to being more updated/polished.

Comment 9

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

(In reply to Anthony Lam (:antlam) from comment #8)
> How much engineering effort is this? I'd love to progress all our toasts to
> snack bars. I think this would move us a huge step closer to being more
> updated/polished.

The SnackBar API is simple so provided we have them draw over other views, it seems easy. I think some apps scroll the app content to get it out of the way of the SnackBar – that'd be much more difficult.

Comment 10

[Barbara Bermes [:barbara] - NI please!]

Looking at our roadmap, we are packed for 44...maybe something for 45?

(In reply to Paul [pwd] from comment #5)
> Any chance we can get this back up for consideration? With the changes to
> the tabs tray, the current toasts are now blocking content. 
Not sure if I understand the issue here. Do we have a screenshot?

Comment 11

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Attachment: Toast blocks tabs tray example

Comment 12

[Nick Alexander :nalexander [he/him]]

I really want this to happen.  I'm noting it dev-doc-needed because I think https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/NativeWindow/toast will need to be updated.

Comment 13

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

Barbara,

Comment 14

[Anthony Lam (:antlam) Find me, @antlam on Slack!]

^oops, i meant to attach this link for ya :P 

https://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-specs

Comment 15

[Mark Finkle (:mfinkle) (use needinfo?)]

(In reply to Nick Alexander :nalexander from comment #12)
> I really want this to happen.  I'm noting it dev-doc-needed because I think
> https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/
> NativeWindow/toast will need to be updated.

Would we change the API for add-ons? Or do you just mean talking about the fact that the UI representation is now different?

Comment 16

[Mark Finkle (:mfinkle) (use needinfo?)]

I'd also like to see bug 1052276 impl'd too.

Comment 17

[Nick Alexander :nalexander [he/him]]

(In reply to Mark Finkle (:mfinkle) from comment #15)
> (In reply to Nick Alexander :nalexander from comment #12)
> > I really want this to happen.  I'm noting it dev-doc-needed because I think
> > https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/
> > NativeWindow/toast will need to be updated.
> 
> Would we change the API for add-ons? Or do you just mean talking about the
> fact that the UI representation is now different?

I think we would change the API for add-ons, since the UI guidelines more or less forbid icons: "Snackbars should contain a single line of text directly related to the operation performed. They may contain a text action. They cannot contain icons."  (From http://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-usage.)

Comment 18

[Barbara Bermes [:barbara] - NI please!]

(In reply to Michael Comella (:mcomella) from comment #11)
> Created attachment 8669724 [details]
> Toast blocks tabs tray example

Thanks mcomella - not really sure if I get this here --> the toast will disappear though after a while, wouldn't the snackbar cover some of the tabs tray as well (even if it's docked)?

Just trying to understand the urgency here and to prioritize. I understand Anthony wants to polish things but we need to understand effort etc.

Comment 19

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

(In reply to Barbara Bermes [:barbara] from comment #18)
> Thanks mcomella - not really sure if I get this here --> the toast will
> disappear though after a while, wouldn't the snackbar cover some of the tabs
> tray as well (even if it's docked)?

Yes – our current toast is more inconvenient though (i.e. covers the center of the tabs), which is probably a reason why Android is moving away from toasts and towards SnackBars.

Comment 20

[Barbara Bermes [:barbara] - NI please!]

Alright, thanks Mike.

I created an Aha card to discuss priority in our funnel meeting: https://mozilla.aha.io/features/FENN-350

Thanks

Comment 21

[Sebastian Kaspari (:sebastian; :pocmo)]

(In reply to Michael Comella (:mcomella) from comment #19)
> (In reply to Barbara Bermes [:barbara] from comment #18)
> > Thanks mcomella - not really sure if I get this here --> the toast will
> > disappear though after a while, wouldn't the snackbar cover some of the tabs
> > tray as well (even if it's docked)?
> 
> Yes – our current toast is more inconvenient though (i.e. covers the center
> of the tabs), which is probably a reason why Android is moving away from
> toasts and towards SnackBars.

Additionally a snackbar supports swipe-to-dismiss if used in conjunction with a CoordinatorLayout.

Comment 22

[Chenxia Liu [:liuche]]

I noticed that for adding a bookmark, we still use toasts - is there a bug for that?

Comment 23

[Sebastian Kaspari (:sebastian; :pocmo)]

(In reply to Chenxia Liu [:liuche] from comment #22)
> I noticed that for adding a bookmark, we still use toasts - is there a bug
> for that?

I only migrated the "closed tab" toast for now. I'm planning on changing all other toasts here later.

Comment 24

[:Margaret Leibovic]

(In reply to Sebastian Kaspari (:sebastian) from comment #23)
> (In reply to Chenxia Liu [:liuche] from comment #22)
> > I noticed that for adding a bookmark, we still use toasts - is there a bug
> > for that?
> 
> I only migrated the "closed tab" toast for now. I'm planning on changing all
> other toasts here later.

We could file mentor bugs for the remaining button toasts. It would actually be pretty nice if we can remove our custom ButtonToast implementation (and deprecate the add-on API for buttons in toasts).

Comment 25

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 1) Replace "New tab" toast with snackbar. r?mcomella

Bug 1157526 - (Part 1) Replace "New tab" toast with snackbar. r?mcomella

Comment 26

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 2) Replace "New private tab" toast with snackbar. r?mcomella

Bug 1157526 - (Part 2) Replace "New private tab" toast with snackbar. r?mcomella

Comment 27

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 3) Replace "Image unblocked" toast with snackbar. r?mcomella

Bug 1157526 - (Part 3) Replace "Image unblocked" toast with snackbar. r?mcomella

Comment 28

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 4) Replace "Add-on installed" toast with snackbar. r?mcomella

Bug 1157526 - (Part 4) Replace "Add-on installed" toast with snackbar. r?mcomella

Comment 29

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 5) Remove unused toast method. r?mcomella

Bug 1157526 - (Part 5) Remove unused toast method. r?mcomella

Comment 30

[Sebastian Kaspari (:sebastian; :pocmo)]

Attachment: MozReview Request: Bug 1157526 - (Part 6) Replace "Already signed in" toast with snackbar. r?mcomella

Bug 1157526 - (Part 6) Replace "Already signed in" toast with snackbar. r?mcomella

Comment 31

[Sebastian Kaspari (:sebastian; :pocmo)]

This series of patches replaces all button toasts with snackbars. This is enough to let us deprecate adding buttons to toast via the API.

Note: Some toasts used "short" durations previously and are now using "long" as a snackbar. The snackbar dismissed just too fast to read the text and press the button (Long = 2750ms, Short = 1500ms). I feel like "short" is more suitable for feedback snackbars without buttons.

We have bug 1216051 filed for thinking about deprecating toasts. After those patches I'd at least deprecate the button part - because that's custom non-Android stuff. Developers can now use the Snackbar API for that.

I'll also file a bug about the remaining (non-button) toasts. I feel like some of them make sense. For example non-important feedback toasts (e.g. "Printing..."). A snackbar could be too disruptive. But that's something to discuss with antlam in the new bug.

Comment 32

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686689 [details]
MozReview Request: Bug 1157526 - (Part 1) Replace "New tab" toast with snackbar. r?mcomella

https://reviewboard.mozilla.org/r/25025/#review22607

Comment 33

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686690 [details]
MozReview Request: Bug 1157526 - (Part 2) Replace "New private tab" toast with snackbar. r?mcomella

https://reviewboard.mozilla.org/r/25027/#review22609

Comment 34

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686691 [details]
MozReview Request: Bug 1157526 - (Part 3) Replace "Image unblocked" toast with snackbar. r?mcomella

https://reviewboard.mozilla.org/r/25029/#review22611

Comment 35

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686692 [details]
MozReview Request: Bug 1157526 - (Part 4) Replace "Add-on installed" toast with snackbar. r?mcomella

https://reviewboard.mozilla.org/r/25031/#review22613

::: mobile/android/tests/browser/robocop/roboextender/base/robocop_prompt_gridinput.html:34
(Diff revision 1)
> -      { iconUri: "drawable://alert_addon", name: "Icon 11" },
> +      { iconUri: "drawable://icon", name: "Icon 11" },

Without digging deeper, I'm unsure this will pass but if it passes for you, wfm.

Comment 36

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686693 [details]
MozReview Request: Bug 1157526 - (Part 5) Remove unused toast method. r?mcomella

https://reviewboard.mozilla.org/r/25033/#review22615

Comment 37

[Michael Comella (:mcomella) [NI reported issues only: ex-Mozilla]]

Comment on attachment 8686694 [details]
MozReview Request: Bug 1157526 - (Part 6) Replace "Already signed in" toast with snackbar. r?mcomella

https://reviewboard.mozilla.org/r/25035/#review22617

Snackbars? [Give me a break!](https://www.youtube.com/watch?v=0nkcVz1mad0) ;)

Comment 38

[Sebastian Kaspari (:sebastian; :pocmo)]

(In reply to Michael Comella (:mcomella) from comment #35)
> Without digging deeper, I'm unsure this will pass but if it passes for you,
> wfm.

Yeah, it passed locally. But I'm now going to push everything to try.

Comment 39

[Sebastian Kaspari (:sebastian; :pocmo)]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=e5256fe15c6c

Comment 40

[Sebastian Kaspari (:sebastian; :pocmo)]

https://hg.mozilla.org/integration/fx-team/rev/4b30e5c0a1cd51dace28bf9939b8fbd9263de3df
Bug 1157526 - (Part 1) Replace "New tab" toast with snackbar. r=mcomella

https://hg.mozilla.org/integration/fx-team/rev/2cac2e4b0215cd3eb0f2e184b4d5d107a29b5e4a
Bug 1157526 - (Part 2) Replace "New private tab" toast with snackbar. r=mcomella

https://hg.mozilla.org/integration/fx-team/rev/8b14ccf741bbc4f8f7fd1f639c301e82fb3e1fdd
Bug 1157526 - (Part 3) Replace "Image unblocked" toast with snackbar. r=mcomella

https://hg.mozilla.org/integration/fx-team/rev/fa6c456d5640a02966186277402295c58e90e7c9
Bug 1157526 - (Part 4) Replace "Add-on installed" toast with snackbar. r=mcomella

https://hg.mozilla.org/integration/fx-team/rev/a0d08563a76e53b393b81d73538e43e6591b3797
Bug 1157526 - (Part 5) Remove unused toast method. r=mcomella

https://hg.mozilla.org/integration/fx-team/rev/68df6df19968bf7015ace65985e63a577a7d4725
Bug 1157526 - (Part 6) Replace "Already signed in" toast with snackbar. r=mcomella

Comment 41

[Phil Ringnalda (:philor)]

https://hg.mozilla.org/mozilla-central/rev/4b30e5c0a1cd
https://hg.mozilla.org/mozilla-central/rev/2cac2e4b0215
https://hg.mozilla.org/mozilla-central/rev/8b14ccf741bb
https://hg.mozilla.org/mozilla-central/rev/fa6c456d5640
https://hg.mozilla.org/mozilla-central/rev/a0d08563a76e
https://hg.mozilla.org/mozilla-central/rev/68df6df19968

Comment 42

[Teodora Vermesan (:TeoVermesan)]

Is it expected that going to the grid view in top sites and long tap on a page and choosing "Open in New Tab" / "Open in Private Tab", will not display a snackbar? If you long tap on a link from news.google.com and choose "Open Link in New Tab" / "Open Link in Private Tab" a snackbar will be displayed.
The same message is displayed on both toasts: "New tab opened | Switch"

Comment 43

[Sebastian Kaspari (:sebastian; :pocmo)]

(In reply to Teodora Vermesan (:TeoVermesan) from comment #42)
> Is it expected that going to the grid view in top sites and long tap on a
> page and choosing "Open in New Tab" / "Open in Private Tab", will not
> display a snackbar? If you long tap on a link from news.google.com and
> choose "Open Link in New Tab" / "Open Link in Private Tab" a snackbar will
> be displayed.
> The same message is displayed on both toasts: "New tab opened | Switch"

This has been fixed in bug 1224530. :)

Comment 44

[Will Bamberg [:wbamberg]]

As far as I can tell, the only docs update needed here is to add a deprecation notice to https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/NativeWindow/toast/show, pointing people at https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/Snackbars.jsm, but please let me know if I am wrong.

Comment 45

[Sebastian Kaspari (:sebastian; :pocmo)]

(In reply to Will Bamberg [:wbamberg] from comment #44)
> As far as I can tell, the only docs update needed here is to add a
> deprecation notice to
> https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/
> NativeWindow/toast/show, pointing people at
> https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/API/
> Snackbars.jsm, but please let me know if I am wrong.

Yeah, that's correct. Alex Johnson did a great job documenting Snackbars.jsm on MDN and adding deprecation warnings.

Comment 46

[Barbara Bermes [:barbara] - NI please!]

Release Note Request (optional, but appreciated)
[Why is this notable]:
[Suggested wording]: Replace super toasts with snackbar
[Links (documentation, blog post, etc)]:

Comment 47

[Sylvestre Ledru [:Sylvestre]]

Added to the release notes with "Replace super toasts with snackbar" as wording
With a link pointing to http://www.google.com/design/spec/components/snackbars-toasts.html