From 817f94bfbac106f020ecfc0d0be4b9dd7ab671f1 Mon Sep 17 00:00:00 2001 From: Mason Freed Date: Tue, 14 Apr 2020 16:08:54 -0700 Subject: [PATCH 1/3] Add declarative shadow root support Corresponding HTML PR: https://github.com/whatwg/html/pull/5465. Tests: https://wpt.fyi/results/shadow-dom/declarative. Closes #831. --- dom.bs | 110 +++++++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 84 insertions(+), 26 deletions(-) diff --git a/dom.bs b/dom.bs index b4c0abd3..a595f120 100644 --- a/dom.bs +++ b/dom.bs @@ -4465,15 +4465,36 @@ dom-Range-extractContents, dom-Range-cloneContents --> copy, if copy is a document, and set copy's node document to document otherwise. -
  • Run any cloning steps defined for node in +

  • Run any cloning steps defined for node in other applicable specifications and pass copy, node, - document and the clone children flag if set, as parameters. + document, and the clone children flag if set, as parameters. -

  • If the clone children flag is set, clone all the - children of node and append them to copy, with - document as specified and the clone children flag being set. +

  • If the clone children flag is set, then for each child + child of node, in tree order: append the result of + cloning child with document and the + clone children flag set, to copy. -

  • Return copy. +
  • +

    If node is a shadow host whose shadow root's + clonable is true: + +

      +

    1. Run attach a shadow root with copy, node's + shadow root's mode, true, node's + shadow root's delegates focus, and node's + shadow root's slot assignment. + +

    2. Set copy's shadow root's declarative + to node's shadow root's declarative. + +

    3. If the clone children flag is set, then for each child + child of node's shadow root, in tree order: + append the result of cloning child with + document and the clone children flag set, to copy's + shadow root. +

    + +

  • Return copy.

    The cloneNode(deep) method steps are: @@ -4973,8 +4994,9 @@ known as documents. content type (a string), URL (a URL), origin (an origin), -type ("xml" or "html"), and -mode ("no-quirks", "quirks", or "limited-quirks"). +type ("xml" or "html"), +mode ("no-quirks", "quirks", or "limited-quirks"), and +allow declarative shadow roots (a boolean). [[!ENCODING]] [[!URL]] [[!HTML]] @@ -4983,8 +5005,8 @@ known as documents. encoding, content type is "application/xml", URL is "about:blank", origin is an opaque origin, -type is "xml", and its -mode is "no-quirks". +type is "xml", mode is "no-quirks", +and allow declarative shadow roots is false.

    A document is said to be an XML document if its type is "xml"; otherwise an HTML document. Whether a document is an @@ -5857,6 +5879,9 @@ It is initially set to false.

    Shadow roots have an associated available to element internals. It is initially set to false.

    +

    Shadow roots have an associated declarative +(a boolean). It is initially set to false.

    +

    Shadow roots's associated host is never null.

    @@ -5864,6 +5889,9 @@ It is initially set to false.

    Shadow roots have an associated slot assignment ("manual" or "named"). +

    Shadow roots have an associated clonable (a boolean). +It is initially set to false.

    +

    A shadow root's get the parent algorithm, given an event, returns null if event's composed flag is unset and shadow root is the root of event's path's first struct's @@ -6010,6 +6038,7 @@ dictionary ShadowRootInit { required ShadowRootMode mode; boolean delegatesFocus = false; SlotAssignmentMode slotAssignment = "named"; + boolean clonable = false; }; @@ -6857,23 +6886,38 @@ are: "span" +

    The attachShadow(init) method steps are:

      -

    1. If this's namespace is not the HTML namespace, +

    2. Run attach a shadow root with this, init["{{ShadowRootInit/mode}}"], + init["{{ShadowRootInit/clonable}}"], init["{{ShadowRootInit/delegatesFocus}}"], + and init["{{ShadowRootInit/slotAssignment}}"]. + +

    3. Return this's shadow root. +

    +
    + +
    +

    To attach a shadow root, given an +element element, a string mode, a boolean clonable, +a boolean delegatesFocus, and a boolean slotAssignment: + +

      +

    1. If element's namespace is not the HTML namespace, then throw a "{{NotSupportedError!!exception}}" {{DOMException}}.

    2. If this's local name is not a valid shadow host name, then throw a "{{NotSupportedError!!exception}}" {{DOMException}}.

    3. -

      If this's local name is a valid custom element name, or - this's is value is not null, then: +

      If element's local name is a valid custom element name, or + element's is value is non-null, then:

      1. Let definition be the result of looking up a custom element definition given - this's node document, its namespace, its + element's node document, its namespace, its local name, and its is value.

      2. If definition is not null and definition's @@ -6882,38 +6926,52 @@ are:

      4. -

    4. If this is a shadow host, then throw an - "{{NotSupportedError!!exception}}" {{DOMException}}. +

    5. +

      If element is a shadow host, then: + +

        +

      1. If element's shadow root's declarative + is false, then throw an "{{NotSupportedError!!exception}}" {{DOMException}}. + +

      2. Otherwise, remove all of element's + shadow root's children, in tree order, and return. + +

        This means that if multiple declarative shadow roots are contained within a single + shadow host, only the last one will remain. +

    6. Let shadow be a new shadow root whose node document - is this's node document, host is this, - and mode is init["{{ShadowRootInit/mode}}"]. + is element's node document, host is + element, and mode is mode. -

    7. Set shadow's delegates focus to - init["{{ShadowRootInit/delegatesFocus}}"]. +

    8. Set shadow's delegates focus to delegatesFocus.

    9. If this's custom element state is "precustomized" or "custom", then set shadow's available to element internals to true. -

    10. Set shadow's slot assignment to - init["{{ShadowRootInit/slotAssignment}}"]. +

    11. Set shadow's slot assignment to slotAssignment. -

    12. Set this's shadow root to shadow. +

    13. Set shadow's declarative to false. -

    14. Return shadow. +

    15. Set shadow's clonable to clonable. + +

    16. Set element's shadow root to shadow.

    +
    +

    The shadowRoot getter steps are:

    1. Let shadow be this's shadow root.

    2. If shadow is null or its mode is "closed", - then return null.

      3. + then return null.

    3. Return shadow.

    +
    @@ -10223,7 +10281,7 @@ Manish Tripathi, Marcos Caceres, Mark Miller, Martijn van der Ven, -Mason Freed, +Mason Freed, Mats Palmgren, Mounir Lamouri, Michael Stramel, From 27dda9a8fde82e56f63fc4ad492db203399c6058 Mon Sep 17 00:00:00 2001 From: Anne van Kesteren Date: Mon, 2 Oct 2023 14:45:00 +0200 Subject: [PATCH 2/3] more fixups --- dom.bs | 28 +++++++++++++++------------- 1 file changed, 15 insertions(+), 13 deletions(-) diff --git a/dom.bs b/dom.bs index a595f120..f1088aeb 100644 --- a/dom.bs +++ b/dom.bs @@ -5005,8 +5005,8 @@ known as documents. encoding, content type is "application/xml", URL is "about:blank", origin is an opaque origin, -type is "xml", mode is "no-quirks", -and allow declarative shadow roots is false. +type is "xml", mode is +"no-quirks", and its allow declarative shadow roots is false.

    A document is said to be an XML document if its type is "xml"; otherwise an HTML document. Whether a document is an @@ -6890,9 +6890,10 @@ are:

    The attachShadow(init) method steps are:

      -

    1. Run attach a shadow root with this, init["{{ShadowRootInit/mode}}"], - init["{{ShadowRootInit/clonable}}"], init["{{ShadowRootInit/delegatesFocus}}"], - and init["{{ShadowRootInit/slotAssignment}}"]. +

    2. Run attach a shadow root with this, + init["{{ShadowRootInit/mode}}"], init["{{ShadowRootInit/clonable}}"], + init["{{ShadowRootInit/delegatesFocus}}"], and + init["{{ShadowRootInit/slotAssignment}}"].

    3. Return this's shadow root.

    @@ -6907,8 +6908,8 @@ a boolean delegatesFocus, and a boolean slotAssignment:

  • If element's namespace is not the HTML namespace, then throw a "{{NotSupportedError!!exception}}" {{DOMException}}. -

  • If this's local name is not a valid shadow host name, then - throw a "{{NotSupportedError!!exception}}" {{DOMException}}. +

  • If element's is not a valid shadow host name, then throw a + "{{NotSupportedError!!exception}}" {{DOMException}}.

  • If element's local name is a valid custom element name, or @@ -6933,11 +6934,12 @@ a boolean delegatesFocus, and a boolean slotAssignment:

  • If element's shadow root's declarative is false, then throw an "{{NotSupportedError!!exception}}" {{DOMException}}. -

  • Otherwise, remove all of element's - shadow root's children, in tree order, and return. +

  • +

    Otherwise, remove all of element's shadow root's + children, in tree order, and return. -

    This means that if multiple declarative shadow roots are contained within a single - shadow host, only the last one will remain. +

    This means that if multiple declarative shadow roots are contained within a single + shadow host, only the last one will remain.

  • Let shadow be a new shadow root whose node document @@ -6946,8 +6948,8 @@ a boolean delegatesFocus, and a boolean slotAssignment:

  • Set shadow's delegates focus to delegatesFocus. -

  • If this's custom element state is "precustomized" or - "custom", then set shadow's +

  • If element's custom element state is + "precustomized" or "custom", then set shadow's available to element internals to true.

  • Set shadow's slot assignment to slotAssignment. From 17ede93b019cb319c9b786dfce950c2ba17ec3c3 Mon Sep 17 00:00:00 2001 From: Anne van Kesteren Date: Mon, 2 Oct 2023 14:47:53 +0200 Subject: [PATCH 3/3] Update dom.bs --- dom.bs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dom.bs b/dom.bs index f1088aeb..bbd155dc 100644 --- a/dom.bs +++ b/dom.bs @@ -6936,7 +6936,7 @@ a boolean delegatesFocus, and a boolean slotAssignment:

  • Otherwise, remove all of element's shadow root's - children, in tree order, and return. + children, in tree order, and return.

    This means that if multiple declarative shadow roots are contained within a single shadow host, only the last one will remain.