1552313 - Custom elements: implement ElementInternals/disabledFeatures/element.attachInternals()

Status: RESOLVED FIXED

(Core :: DOM: Core & HTML, enhancement, P3)

Description

[Domenic Denicola]

Spec:

• Some steps of https://html.spec.whatwg.org/multipage/custom-elements.html#dom-customelementregistry-define for disabledFeatures
• Step 3 of https://dom.spec.whatwg.org/#dom-element-attachshadow for disabledFeatures = ['shadow'] specifically
• https://html.spec.whatwg.org/multipage/custom-elements.html#the-elementinternals-interface for attachInternals() and the (empty-for-now) ElementInternals class

Tests:

• https://github.com/web-platform-tests/wpt/blob/master/shadow-dom/Element-interface-attachShadow-custom-element.html
• https://github.com/web-platform-tests/wpt/blob/master/custom-elements/HTMLElement-attachInternals.html

A separate bug will be filed for form-associated custom elements, which will make ElementInternals not empty. But this seems like a separable chunk of work.

Comment 1

[John Dai[:jdai]]

Try: https://treeherder.mozilla.org/#/jobs?repo=try&revision=9d420a9a500e166195c3d787f6a37d42d406a004

Comment 2

[John Dai[:jdai]]

Attachment: Bug 1552313 - Implement custom element disabledFeatures and disableInternals;

• Introduce dom.webcomponents.elementInternals.enabled for custom element's elementInternals.
• Implement disabledFeatures static field and disableInternals.
• Refactor get observedAttributes sequence.

Comment 3

[John Dai[:jdai]]

Attachment: Bug 1552313 - Implement disableShadow;

Comment 4

[John Dai[:jdai]]

Attachment: Bug 1552313 - Implement element.attachInternals;

ElementInternals class is empty-for-now.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f26d61e06a9d
Implement custom element disabledFeatures and disableInternals; r=smaug,edgar
https://hg.mozilla.org/integration/autoland/rev/5f8c6c9f2d36
Implement disableShadow; r=smaug,edgar
https://hg.mozilla.org/integration/autoland/rev/27a01989152a
Implement element.attachInternals; r=smaug,edgar

Comment 9

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/20196 for changes under testing/web-platform/tests

Comment 10

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream web-platform-tests status checks passed, PR will merge once commit reaches central.

Comment 11

[Dorel Luca [:dluca]]

Backed out 3 changesets (bug 1552313) for WPT failures in custom-elements/CustomElementRegistry.html. CLOSED TREE

Log:
https://treeherder.mozilla.org/logviewer.html#/jobs?job_id=275630088&repo=autoland&lineNumber=14029

Push with failures:
https://treeherder.mozilla.org/#/jobs?repo=autoland&group_state=expanded&revision=27a01989152a79ebe94496525650be603eb38f4d

Backout:
https://hg.mozilla.org/integration/autoland/rev/ac493f0eacfc3eef5e66f432603261b768fa7800

Comment 12

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR was closed without merging

Comment 13

[John Dai[:jdai]]

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

Comment 14

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/055e0a0e4bf0
Implement custom element disabledFeatures and disableInternals; r=smaug,edgar
https://hg.mozilla.org/integration/autoland/rev/1f661e376de9
Implement disableShadow; r=smaug,edgar
https://hg.mozilla.org/integration/autoland/rev/e6b60876e668
Implement element.attachInternals; r=smaug,edgar

Comment 15

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream web-platform-tests status checks passed, PR will merge once commit reaches central.

Comment 16

[Alexandru Michis [:malexandru]]

https://hg.mozilla.org/mozilla-central/rev/055e0a0e4bf0
https://hg.mozilla.org/mozilla-central/rev/1f661e376de9
https://hg.mozilla.org/mozilla-central/rev/e6b60876e668

Comment 17

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot

Comment 18

[Aaron Anderson]

Has there been any recent progress made on supporting form associated custom elements?

I enabled the elementInternals configuration flag but calling form.validate() does not invoke my web components checkValidity() function nor does form.reset() invoke the component's formResetCallback() method. Also form.elements.namedItem() does not include my form associated components either.

I am successfully using form associated components in Chrome and since I can't find a pollyfill available for this functionality I am wondering if this support is forthcoming or if I should try to apply workarounds to support Firefox.

Comment 19

[rob]

I also wanted to check in on the progress here. More and more standards are being discussed as extensions of ElementInternals (declarative shadow dom, custom pseudo selectors, etc.). The lack of support for these APIs in Firefox is going to create an increasingly difficult problem for developers. We have many hacks to work around this in our form components already...and we spend a lot of time addressing related issues.

Comment 20

[mrts.pydev]

(In reply to rob from comment #19)

I also wanted to check in on the progress here. More and more standards are being discussed as extensions of ElementInternals (declarative shadow dom, custom pseudo selectors, etc.). The lack of support for these APIs in Firefox is going to create an increasingly difficult problem for developers. We have many hacks to work around this in our form components already...and we spend a lot of time addressing related issues.

@rob, throwing out a wild idea: could Microsoft help out the Mozilla folks with this? Microsoft browser teams contribute to Chromium, perhaps you could rally people to help to scratch this itch as well so your team could drop the hacks and workarounds?