1812135 - Use moz-toggle in about:newtab personalization panel

Status: RESOLVED FIXED

(Toolkit :: UI Widgets, task)

Description

[Hanna Jones [:hjones]]

For consistency we should replace the toggles in the about:newtab personalization panel with moz-toggle. There may be a bit of extra work here as this will be the first time we're using the new element in a React based part of Firefox.

Comment 1

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

Attachment: Bug 1812135 - Use moz-toggle in the about:newtab personalization panel. r?thecount!,amy!,hjones!

This adds moz-toggle.mjs as a module to load in the main newtab document
(cached or otherwise), and then converts the existing toggles to use
moz-toggle.

This also required me to bring in design-tokens-brand.css to get the right
colours for the toggle to appear.

There was some markup in the original panel that had the label exist outside
of the toggle, and some CSS grid styling to make it appear alongside it.
Thankfully, moz-toggle takes care of a lot of that for us, so I was able
to get rid of the external label element and the associated styles.

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c2341f2f6212
Use moz-toggle in the about:newtab personalization panel. r=thecount,amy,hjones,desktop-theme-reviewers,bolsson

Comment 3

[Iulian Moraru]

Backed out for causing multiple crashes.
This has caused crashes of multiple jobs, so far, this appeared for devtools, browser-chrome, mochitest-plain jobs.

• Push with failures

• Failure log

• Backout link

[task 2023-09-25T17:42:46.301Z] 17:42:46     INFO - GECKO(1580) | [Child 1831: Main Thread]: I/DocShellAndDOMWindowLeak ++DOMWINDOW == 3 (7fc4ad421400) [pid = 1831] [serial = 3] [outer = 7fc4b2777200]
[task 2023-09-25T17:42:46.303Z] 17:42:46     INFO - GECKO(1580) | 1695663766300	Marionette	DEBUG	1 -> [0,2,"Addon:Install",{"path":"/tmp/tmpwnpkjs90.zip","temporary":false}]
[task 2023-09-25T17:42:46.317Z] 17:42:46     INFO - GECKO(1580) | there is no JSContext on the stack!
[task 2023-09-25T17:42:46.317Z] 17:42:46     INFO - GECKO(1580) | Hit MOZ_CRASH(Missing chrome or resource URLs: chrome://global/skin/design-tokens-brand.css) at /builds/worker/checkouts/gecko/netwerk/base/nsNetUtil.cpp:3961
[task 2023-09-25T17:42:46.326Z] 17:42:46     INFO -  Initializing stack-fixing for the first stack frame, this may take a while...
[task 2023-09-25T17:42:47.576Z] 17:42:47     INFO - runtests.py | Waiting for browser...
[task 2023-09-25T17:43:17.224Z] 17:43:17     INFO - GECKO(1580) | #01: mozilla::net::CheckForBrokenChromeURL(nsILoadInfo*, nsIURI*) [netwerk/base/nsNetUtil.cpp:3961]
[task 2023-09-25T17:43:17.225Z] 17:43:17     INFO - GECKO(1580) | #02: nsJARChannel::OnOpenLocalFileComplete(nsresult, bool) [modules/libjar/nsJARChannel.cpp:498]
[task 2023-09-25T17:43:17.231Z] 17:43:17     INFO - GECKO(1580) | #03: mozilla::detail::RunnableMethodImpl<RefPtr<nsJARChannel>, nsresult (nsJARChannel::*)(nsresult, bool), true, (mozilla::RunnableKind)0, nsresult, bool>::Run() [xpcom/threads/nsThreadUtils.h:1216]
[task 2023-09-25T17:43:17.231Z] 17:43:17     INFO - GECKO(1580) | #04: mozilla::RunnableTask::Run() [xpcom/threads/TaskController.cpp:560]
[task 2023-09-25T17:43:17.232Z] 17:43:17     INFO - GECKO(1580) | #05: mozilla::TaskController::DoExecuteNextTaskOnlyMainThreadInternal(mozilla::detail::BaseAutoLock<mozilla::Mutex&> const&) [xpcom/threads/TaskController.cpp:886]
[task 2023-09-25T17:43:17.232Z] 17:43:17     INFO - GECKO(1580) | #06: mozilla::TaskController::ExecuteNextTaskOnlyMainThreadInternal(mozilla::detail::BaseAutoLock<mozilla::Mutex&> const&) [xpcom/threads/TaskController.cpp:0]
[task 2023-09-25T17:43:17.232Z] 17:43:17     INFO - GECKO(1580) | #07: mozilla::TaskController::ProcessPendingMTTask(bool) [xpcom/threads/TaskController.cpp:495]
[task 2023-09-25T17:43:17.232Z] 17:43:17     INFO - GECKO(1580) | #08: mozilla::detail::RunnableFunction<mozilla::TaskController::TaskController()::$_0>::Run() [xpcom/threads/nsThreadUtils.h:549]
[task 2023-09-25T17:43:17.232Z] 17:43:17     INFO - GECKO(1580) | #09: nsThread::ProcessNextEvent(bool, bool*) [xpcom/threads/nsThread.cpp:1203]
[task 2023-09-25T17:43:17.233Z] 17:43:17     INFO - GECKO(1580) | #10: NS_ProcessNextEvent(nsIThread*, bool) [xpcom/threads/nsThreadUtils.cpp:480]
[task 2023-09-25T17:43:17.233Z] 17:43:17     INFO - GECKO(1580) | #11: mozilla::ipc::MessagePump::Run(base::MessagePump::Delegate*) [ipc/glue/MessagePump.cpp:85]
[task 2023-09-25T17:43:17.233Z] 17:43:17     INFO - GECKO(1580) | #12: MessageLoop::Run() [ipc/chromium/src/base/message_loop.cc:346]
[task 2023-09-25T17:43:17.234Z] 17:43:17     INFO - GECKO(1580) | #13: nsBaseAppShell::Run() [widget/nsBaseAppShell.cpp:150]
[task 2023-09-25T17:43:17.234Z] 17:43:17     INFO - GECKO(1580) | #14: XRE_RunAppShell() [toolkit/xre/nsEmbedFunctions.cpp:721]
[task 2023-09-25T17:43:17.234Z] 17:43:17     INFO - GECKO(1580) | #15: mozilla::ipc::MessagePumpForChildProcess::Run(base::MessagePump::Delegate*) [ipc/glue/MessagePump.cpp:235]
[task 2023-09-25T17:43:17.234Z] 17:43:17     INFO - GECKO(1580) | #16: MessageLoop::Run() [ipc/chromium/src/base/message_loop.cc:346]
[task 2023-09-25T17:43:17.234Z] 17:43:17     INFO - GECKO(1580) | #17: XRE_InitChildProcess(int, char**, XREChildData const*) [toolkit/xre/nsEmbedFunctions.cpp:660]
[task 2023-09-25T17:43:17.295Z] 17:43:17     INFO - GECKO(1580) | #18: main [browser/app/nsBrowserApp.cpp:375]
[task 2023-09-25T17:43:17.298Z] 17:43:17     INFO - GECKO(1580) | #19: __libc_start_main [/lib/x86_64-linux-gnu/libc.so.6 + 0x21b97]
[task 2023-09-25T17:43:17.299Z] 17:43:17     INFO - GECKO(1580) | #20: ??? [/builds/worker/workspace/build/application/firefox/firefox-bin + 0x3dec9]
[task 2023-09-25T17:43:17.300Z] 17:43:17     INFO - GECKO(1580) | #21: ??? (???:???)
[task 2023-09-25T17:43:17.301Z] 17:43:17     INFO - GECKO(1580) | [WARN  glean_core::upload] Attempted to enqueue a duplicate ping a80e6425-6b22-4d7c-989b-5ab7d192f410 at /submit/firefox-desktop/baseline/1/a80e6425-6b22-4d7c-989b-5ab7d192f410.

Comment 4

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

D'oh, a patch that landed recently changed some paths on me, and that didn't get handled in the rebase. Fixing.

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/6a7f708c3d04
Use moz-toggle in the about:newtab personalization panel. r=thecount,amy,hjones,desktop-theme-reviewers,bolsson

Comment 6

[Cosmin Sabou [:CosminS]]

Backed out for causing crashtest failures on 1662259.html

Push with failures: https://treeherder.mozilla.org/jobs?repo=autoland&resultStatus=testfailed%2Cbusted%2Cexception&revision=6a7f708c3d0458c9b30efa2bdfde6e7812554d1e&searchStr=crashtest&selectedTaskRun=Bj1ClmO-SzSMUaxu4fkpww.0

Failure log: https://treeherder.mozilla.org/logviewer?job_id=430278184&repo=autoland

Backout link: https://hg.mozilla.org/integration/autoland/rev/93867a0f165313a5ff0768e1c960d4ded11b404a

Comment 7

[Cosmin Sabou [:CosminS]]

Those crashes are most likely not from there, it's actually one that turned into high frequency. Will reland this.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/3cee6a90a6ad
Use moz-toggle in the about:newtab personalization panel. r=thecount,amy,hjones,desktop-theme-reviewers,bolsson

Comment 9

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/3cee6a90a6ad

Comment 10

[Alex Finder]

(In reply to Pulsebot from comment #5)

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/6a7f708c3d04
Use moz-toggle in the about:newtab personalization panel.
r=thecount,amy,hjones,desktop-theme-reviewers,bolsson

== Change summary for alert #39665 (as of Wed, 27 Sep 2023 14:57:17 GMT) ==

Regressions:

Ratio	Test	Platform	Options	Absolute values (old vs new)
3%	startup_about_home_paint_cached	windows10-64-shippable-qr	e10s fission stylo webrender-sw	575.04 -> 590.25

For up to date results, see: https://treeherder.mozilla.org/perfherder/alerts?id=39665

Comment 11

[Acasandrei Beatrice (needinfo me)]

(In reply to Pulsebot from comment #5)

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/6a7f708c3d04
Use moz-toggle in the about:newtab personalization panel.
r=thecount,amy,hjones,desktop-theme-reviewers,bolsson

== Change summary for alert #39667 (as of Wed, 27 Sep 2023 17:23:36 GMT) ==

Regressions:

Ratio	Test	Platform	Options	Absolute values (old vs new)
12%	Images	macosx1015-64-shippable-qr	fission tp6	5,794,009.96 -> 6,465,473.82

For up to date results, see: https://treeherder.mozilla.org/perfherder/alerts?id=39667