1803678 - Enable on-demand/lazy loading for ESModule based reusable components

Status: RESOLVED FIXED

(Toolkit :: UI Widgets, task)

Description

[Hanna Jones [:hjones]]

We have some code in customElements.js that uses Services.scriptloader.loadSubScript and customElements.setElementCreationCallback to automatically load the JS files for custom elements when they are used. We are writing all of our new components as ESModules, and unfortunately this same loading strategy doesn't currently work. Long term we will want to get this working so we don't end up having to prematurely load a bunch of our components in browser.xhtml/somewhere more top level.

Comment 1

[Hanna Jones [:hjones]]

Attachment: Bug 1803678 - enable lazy loading of ESModule based moz- custom elements r=#recomp-reviewers

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/421fd8a0360c
enable lazy loading of ESModule based moz- custom elements r=reusable-components-reviewers,pip-reviewers,credential-management-reviewers,translations-reviewers,kpatenio,issammani,mstriemer

Comment 3

[Pulsebot]

Backout by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/37cb3811a1e1
Backed out changeset 421fd8a0360c for causing mochitest failures on browser_translations_select_panel_init_failure.js CLOSED TREE

Comment 4

[Aron Cseh]

Backed out for causing mochitest failures on browser_translations_select_panel_init_failure.js

• Backout link
• Push with failures
• Failure Log

[task 2024-04-23T14:25:08.628Z] 14:25:08     INFO - TEST-START | browser/components/translations/tests/browser/browser_translations_select_panel_init_failure.js
[task 2024-04-23T14:25:08.660Z] 14:25:08     INFO - GECKO(8725) | console.log: Translations: "Mocking RemoteSettings for the translations engine."
[task 2024-04-23T14:25:09.082Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Getting remote language models."
[task 2024-04-23T14:25:09.100Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Remote language models loaded in 0.019 seconds." ({})
[task 2024-04-23T14:25:09.105Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "maybeOfferTranslations - Do not offer translations in automation." "https://example.com/browser/toolkit/components/translations/tests/browser/translations-tester-select.html"
[task 2024-04-23T14:25:09.307Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Starting translation" 197568495617
[task 2024-04-23T14:25:09.309Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Creating a new engine for \"fr\" to \"en\"."
[task 2024-04-23T14:25:09.311Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Beginning model downloads: \"fr\" to \"en\""
[task 2024-04-23T14:25:09.314Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Getting remote bergamot-translator wasm records."
[task 2024-04-23T14:25:09.314Z] 14:25:09     INFO - GECKO(8725) | console.log: Download requested: test-translation-models-0 model.fren.intgemm.alphas.bin
[task 2024-04-23T14:25:09.314Z] 14:25:09     INFO - GECKO(8725) | console.log: Download requested: test-translation-models-0 lex.50.50.fren.s2t.bin
[task 2024-04-23T14:25:09.315Z] 14:25:09     INFO - GECKO(8725) | console.log: Download requested: test-translation-models-0 vocab.fren.spm
[task 2024-04-23T14:25:09.317Z] 14:25:09     INFO - GECKO(8725) | console.log: Translations: "Using bergamot-translator@undefined release version 1.0 first released on Fxundefined" ({id:"bb1205d4-f856-42dd-b9b5-3c73dedba2ad", name:"bergamot-translator", version:"1.0", last_modified:1713882308655, schema:1713882308655})
[task 2024-04-23T14:25:09.317Z] 14:25:09     INFO - GECKO(8725) | console.log: Download requested: test-translation-wasm-1 bergamot-translator
[task 2024-04-23T14:25:53.632Z] 14:25:53     INFO - TEST-INFO | started process screentopng
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - TEST-INFO | screentopng: exit 0
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Buffered messages logged at 14:25:08
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Entering test bound test_select_translations_panel_init_failure_cancel
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Loading test page starting at url: https://example.com/browser/toolkit/components/translations/tests/browser/translations-tester-select.html
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Buffered messages logged at 14:25:09
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Action: openPanel()
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Source: browser/components/translations/tests/browser/browser_translations_select_panel_init_failure.js:19:37
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Waiting for the contentAreaContextMenu popupshown event
[task 2024-04-23T14:25:53.809Z] 14:25:53     INFO - Console message: [JavaScript Warning: "initMouseEvent() is deprecated. Use the MouseEvent() constructor instead." {file: "chrome://mochikit/content/tests/SimpleTest/EventUtils.js" line: 296}]
[task 2024-04-23T14:25:53.813Z] 14:25:53     INFO - Waiting for the select-translations-panel popupshown event
[task 2024-04-23T14:25:53.814Z] 14:25:53     INFO - Waiting for SelectTranslationsPanel to change state from "translating" to "init-failure"
[task 2024-04-23T14:25:53.814Z] 14:25:53     INFO - Buffered messages finished
[task 2024-04-23T14:25:53.814Z] 14:25:53     INFO - TEST-UNEXPECTED-FAIL | browser/components/translations/tests/browser/browser_translations_select_panel_init_failure.js | Test timed out - 
[task 2024-04-23T14:25:53.814Z] 14:25:53     INFO - GECKO(8725) | Completed ShutdownLeaks collections in process 8725
[task 2024-04-23T14:25:53.814Z] 14:25:53     INFO - TEST-START | Shutdown

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/58e1e96263b7
enable lazy loading of ESModule based moz- custom elements r=reusable-components-reviewers,pip-reviewers,credential-management-reviewers,translations-reviewers,kpatenio,issammani,mstriemer

Comment 6

[Serban Stanca [:SerbanS]]

Backed out for causing mochitests failures in test_confirm_delete_dialog.html.

• Backout link
• Push with failures
• Failure Log
• Failure line: TEST-UNEXPECTED-FAIL | browser/components/aboutlogins/tests/chrome/test_confirm_delete_dialog.html | After opening the dialog and tabbing once, the cancel button should be focused - got null, expected [object HTMLButtonElement]

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/46e84060342c
enable lazy loading of ESModule based moz- custom elements r=reusable-components-reviewers,pip-reviewers,credential-management-reviewers,translations-reviewers,kpatenio,issammani,mstriemer

Comment 8

[Aron Cseh]

https://hg.mozilla.org/mozilla-central/rev/46e84060342c