1407576 - Error in module b not caught in a when WC is created with createElement

Status: NEW

(Core :: DOM: Core & HTML, defect, P2)

Description

[Adrian Aichner [:anaran]]

git clone https://github.com/anaran/import.git
git checkout 7b04f5b
python -m SimpleHTTPServer

Visit http://localhost:8000/ and notice how following stringified error is reported in the webpage:

{
  "fileName": "http://localhost:8000/b.js",
  "lineNumber": 10,
  "columnNumber": 20,
  "message": "this.attachShadow is not a function"
}

This is expected since Firefox Nightly does not implement web components (WC) v1 yet. 

Now for the problem I am reporting:

Above error is properly caught when the web component is instantiated with:
  let myJot = new typpo.Jot;
See https://github.com/anaran/import/commit/7b04f5bdaaa9c95d2a362ef8c394db97a5171aa2#diff-95f0a310f289230d56c3a4949c17963eR18

The error goes uncaught in module a when using the alternative,
  let myJot = document.createElement('my-jot');
See https://github.com/anaran/import/commit/98823dba8154a574cbeb829f192fdc4b63d26c22#diff-95f0a310f289230d56c3a4949c17963eR19

Verify the problem with
git checkout 98823db
and visiting http://localhost:8000/ again.

The webpage remains blank.

Only devtools console will reveal an error:
TypeError: "this" object does not implement interface HTMLElement.[Learn More]a.js:19:15

Even that does not help much in pinpointing the actual root cause of the problem.

I would hope the underlying runtime error could be caught and reported in this use case as well.

Comment 1

[Adrian Aichner [:anaran]]

Above testcase is now available at
https://anaran.github.io/import/
as well.

The exception is still not caught in a, but devtools console now pinpoints the problem as expected:

TypeError: this.attachShadow is not a function b.js:10:20

after setting

Services.prefs.setBoolPref('dom.webcomponents.enabled', false)
Services.prefs.setBoolPref('dom.webcomponents.customelements.enabled', true)

in the Browser Console.

--

Toggling both prefs to
Services.prefs.setBoolPref('dom.webcomponents.enabled', true)
Services.prefs.setBoolPref('dom.webcomponents.customelements.enabled', false)

catches

{
  "fileName": "https://anaran.github.io/import/a.js",
  "lineNumber": 13,
  "columnNumber": 7,
  "message": "customElements is not defined"
}

--

attachShadow is now implemented and works with
Services.prefs.setBoolPref('dom.webcomponents.enabled', true)
Services.prefs.setBoolPref('dom.webcomponents.customelements.enabled', true)

Comment 2

[Adrian Aichner [:anaran]]

To review and reproduce testcase locally, use this:

git clone https://github.com/anaran/import.git
git checkout gh-pages
python -m SimpleHTTPServer

Visit http://localhost:8000/

Comment 3

[Adrian Aichner [:anaran]]

testcase is also available as tarball at https://bugzilla.mozilla.org/show_bug.cgi?id=1419799#c4