Element.attachShadow() - doc for options.customElementRegistry#43593
Element.attachShadow() - doc for options.customElementRegistry#43593hamishwillee wants to merge 1 commit intomdn:mainfrom
Conversation
github-actions
bot
added
Content:WebAPI
|
Preview URLs (2 pages) (comment last updated: 2026-03-31 05:50:38) |
hamishwillee
force-pushed
the
ff150_attachshadow_options_customElementRegistry
branch
from
0fe36cf to
d502a02
Compare
hamishwillee
requested review from
chrisdavidmills
and removed request for
a team
chrisdavidmills
left a comment
chrisdavidmills
left a comment
There was a problem hiding this comment.
@hamishwillee a few bits for you to look at, but this is mostly fine!
| - `clonable` {{Optional_Inline}} | ||
| - : A boolean that specifies whether the shadow root is clonable: when set to `true`, the shadow host cloned with {{domxref("Node.cloneNode()")}} or {{domxref("Document.importNode()")}} will include shadow root in the copy. Its default value is `false`. | ||
|
|
||
| - `customElementRegistry` {{Optional_Inline}} |
There was a problem hiding this comment.
As an FYI, looking at the preview page, the nested DL formatting is broken.
There was a problem hiding this comment.
Also, there are a couple of big sections up top that need dumping into a "Description" section further down. Not sure if you fancy fixing that while you are here? I won't block on it, if not ;-)
|
|
||
| - `customElementRegistry` {{Optional_Inline}} | ||
| - : A {{DOMxRef('CustomElementRegistry')}} that will be used as the [scoped custom element registry](/en-US/docs/Web/API/Web_components/Using_custom_elements#scoped_custom_element_registries) of the attached shadow root. | ||
| If `null` or `undefined`, the shadow root will use the global registry provided by {{domxref("Window.customElements")}}. |
There was a problem hiding this comment.
| If `null` or `undefined`, the shadow root will use the global registry provided by {{domxref("Window.customElements")}}. | |
| If `null` or `undefined`, the shadow root will use the global registry referenced by {{domxref("Window.customElements")}}. |
| - : Elements are not automatically assigned to {{HTMLElement("slot")}} elements. Instead, they must be manually assigned with {{domxref("HTMLSlotElement.assign()")}}. | ||
| Its default value is `named`. | ||
|
|
||
| Note that if you pass a {{DOMxRef('ShadowRoot')}} the method will read the corresponding properties as though it was an [`options`](#options) object. |
There was a problem hiding this comment.
Feels like this should be formatted as a note, and begin the sentence with "If..."
Also, it is a bit confusing — it is not clear where you pass this ShadowRoot. Is it one of the option values? Does it take the place of the options object? It feels like the note is referencing one of the option descriptions, but I'm not sure which one.
| - where the element definition static property `disabledFeatures` has been given a value of `"shadow"`. | ||
| - that already has a shadow root that was not created declaratively. | ||
| - that has a [declarative shadow root](/en-US/docs/Web/HTML/Reference/Elements/template#declarative_shadow_dom) but the specified `mode` does not match the existing mode. | ||
| - passing a `customElementRegistry` value that isn't `null` or a locally scoped registry (that you created using `new CustomElementRegistry()`). |
There was a problem hiding this comment.
| - passing a `customElementRegistry` value that isn't `null` or a locally scoped registry (that you created using `new CustomElementRegistry()`). | |
| - while passing a `customElementRegistry` value that isn't `null` or a locally scoped registry (that you created using `new CustomElementRegistry()`). |
| ### Basic usage | ||
|
|
||
| The most common example you'll see of this property being used is to get access to the {{domxref("CustomElementRegistry.define()")}} method to define and register a new custom element. | ||
| For example: |
There was a problem hiding this comment.
Maybe put this "For example:" on a new line?
Also, the line later on — "However, it is usually shortened to something like the following:" — makes very little sense, as the code snippet that follows it is longer than the first code snippet ;-)
If you fancy it, maybe replace that line with something like "However, the custom element class is usually defined directly inside the define() call, something like this:"
3 participants
Adds
customElementRegistryoption for theElement.attachShadow()Fixes #43237
Fixes #38266
Related docs work can be tracked in #43555