1886362 - The 'import browsers' button on the about:welcome page lacks a collapse function, only expanding the list of browsers.

Status: VERIFIED FIXED

(Firefox :: Messaging System, defect, P1)

Description

[iamfindingbugs]

Attachment: The 'import browsers' button on the about:welcome page lacks a collapse function, only expanding the list of browsers.

Affected Version:

• Firefox 123.0.1 (64-bit)

Affected Platforms:

• MacOS 14.1 (23B2073)

Steps to Reproduce:

• 1.Start Firefox.
• 2.Navigate to about:welcome
• 3.Choose "Import from previous browser."
• 4.Click 'save and continue'.
• 5.Click the browser button to display the list of browsers.
• 6.Click the button again.

Actual Results:

• At step 6, clicking the browser button still expands the list of browsers without collapsing it.

Expected Results:

• At step 6, the expected behavior is for the list to collapse. The browser button should toggle between expanding and collapsing the list, not just expanding.

Comment 1

[Negin Sauermann]

This seems to be contained to about:welcome. I can't replicate the issue with the import modal in about:preferences or through spotlight in asrouter. Investigating what could be causing this!

Comment 2

[Meg Viar [:mviar]]

Hi @Negin, I did some investigation on this bug and found the following:

• This appears to be a bug with the panel-list element when it's used in any context that doesn't support XUL. For example, the about:welcome Migration Wizard case from this bug and use cases in FirefoxView (ex. here).
  • To replicate the latter, you can go to the FirefoxView tab and click Open Tabs, then click a three-dot menu on a tab item. When the panel list is open, try clicking the three-dot menu. The panel does not close.
• There are a few places where the code branches in migration-wizard.mjs and panel-list.js depending on whether XUL is supported. This is also touched on briefly in the element README.
  • When the migration wizard initializes the panel-list in a context that support XUL, it first creates a XUL panel element as the panel-list's parent, then appends the panel to a shadow root. If XUL is not supported, it just appends the panel-list to the shadow root with no wrapper (see here).
  • The show and hide methods on the panel-list element also have conditional logic that depends on whether the XUL panel mentioned above is used.
• I tracked down what events are being handled when a user clicks on the button#browser-profile-selector element while the panel-list menu is open:
  • In the working contexts of Spotlight Modal where XUL is supported:
    1. A click event is handled by the MigrationWizard.
    2. A resulting popuphidden event received by the panel-list triggers a call to the panel-list's hide method.
    3. No further events are received by the Migration Wizard.
  • In the buggy contexts of about:welcome:
    1. Same as a. above
    2. Same as b. above, but with a mousedown event instead of popuphidden.
    3. Another click event is received by the MigrationWizard, which triggers the panel to open again, keeping it from ever closing.

My guess is the XUL panel parent element stops the propagation of events to the Migration Wizard element. In contexts where that XUL panel isn't present, we may need to implement a way of preventing that final click event from firing in the Migration Wizard.

Comment 3

[Negin Sauermann]

(In reply to Meg Viar [:mviar] from comment #2)

Hi @Negin, I did some investigation on this bug and found the following:

• This appears to be a bug with the panel-list element when it's used in any context that doesn't support XUL. For example, the about:welcome Migration Wizard case from this bug and use cases in FirefoxView (ex. here).
  • To replicate the latter, you can go to the FirefoxView tab and click Open Tabs, then click a three-dot menu on a tab item. When the panel list is open, try clicking the three-dot menu. The panel does not close.
• There are a few places where the code branches in migration-wizard.mjs and panel-list.js depending on whether XUL is supported. This is also touched on briefly in the element README.
  • When the migration wizard initializes the panel-list in a context that support XUL, it first creates a XUL panel element as the panel-list's parent, then appends the panel to a shadow root. If XUL is not supported, it just appends the panel-list to the shadow root with no wrapper (see here).
  • The show and hide methods on the panel-list element also have conditional logic that depends on whether the XUL panel mentioned above is used.
• I tracked down what events are being handled when a user clicks on the button#browser-profile-selector element while the panel-list menu is open:
  • In the working contexts of Spotlight Modal where XUL is supported:
    1. A click event is handled by the MigrationWizard.
    2. A resulting popuphidden event received by the panel-list triggers a call to the panel-list's hide method.
    3. No further events are received by the Migration Wizard.
  • In the buggy contexts of about:welcome:
    1. Same as a. above
    2. Same as b. above, but with a mousedown event instead of popuphidden.
    3. Another click event is received by the MigrationWizard, which triggers the panel to open again, keeping it from ever closing.

My guess is the XUL panel parent element stops the propagation of events to the Migration Wizard element. In contexts where that XUL panel isn't present, we may need to implement a way of preventing that final click event from firing in the Migration Wizard.

Thanks Meg! I've been a bit stumped figuring this out so this is extremely helpful, and appreciate how you broke it down. I'll look into a way to prevent that final click event from firing in MigrationWizard.

Comment 4

[Negin Sauermann]

Attachment: Bug 1886362 - Fix about:welcome import button not collapsing on panel click

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/7b6284ac44a7
Fix about:welcome import button not collapsing on panel click r=mconley,reusable-components-reviewers,migration-reviewers,mstriemer

Comment 6

[Sandor Molnar[:smolnar]]

Backed out for causing bc failures @ browser_aboutwelcome_multistage_mr.js

Backout link: https://hg.mozilla.org/integration/autoland/rev/9fef88f56156b0aac7a8f73e812114f98e63a94f

Push with failures

Failure log -> TEST-UNEXPECTED-FAIL | browser/components/aboutwelcome/tests/browser/browser_aboutwelcome_multistage_mr.js | Test timed out

Buffered messages finished
[task 2024-04-25T23:30:49.159Z] 23:30:49     INFO - TEST-UNEXPECTED-FAIL | browser/components/aboutwelcome/tests/browser/browser_aboutwelcome_multistage_mr.js | Test timed out - 
[task 2024-04-25T23:30:49.159Z] 23:30:49     INFO - GECKO(5856) | Completed ShutdownLeaks collections in process 6784

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/cc34d337a204
Fix about:welcome import button not collapsing on panel click r=mconley,reusable-components-reviewers,migration-reviewers,omc-reviewers,mstriemer,emcminn

Comment 8

[Natalia Csoregi [:nataliaCs]]

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

Comment 9

[Ardelean Oana, Desktop Test Engineering [:oardelean]]

Reproducible on a 2024-04-25 Nightly build on Windows 10.
Verified as fixed on Firefox Nightly 128.0a1 and Firefox 127.0b2 on Windows 10, macOS 12, Ubuntu 22.