From abf6d911870e249ac00145bdee40e81ac44135eb Mon Sep 17 00:00:00 2001 From: Valerie R Young Date: Fri, 15 Mar 2019 16:56:42 -0400 Subject: [PATCH 1/5] Define :defined pseudo-class --- selectors-4/Overview.bs | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) diff --git a/selectors-4/Overview.bs b/selectors-4/Overview.bs index 49019d5c198..56458fd3442 100644 --- a/selectors-4/Overview.bs +++ b/selectors-4/Overview.bs @@ -1415,6 +1415,33 @@ Namespaces in Elemental Selectors that has not been previously declared is an invalid selector. +

+The Defined Pseudo-class: '':defined()''

+ + The :defined pseudo-class matches any element that is + defined. + + Note: The '':defined'' pseudo-class is used to differentiate between a custom element that + has been successfully constructed from custom elements that have not yet been constructed or have + failed to be constructed. + +
+ For example, the '':defined'' pseudo-class can be used to hide a custom element before a + script defines the custom element but after it is initially rendered: + +
custom-element { visibility: hidden }
+
custom-element:defined { visibility: visible }
+
+ + An element that is not a custom element will also match the '':defined'' pseudo-class. + +
+ For example, this style sheet will turn all paragraph text green: + +
p:defined { color: green }
+
+ +

Attribute selectors

From f74e6019d8a91697d859ce319900ee9d8781bf3f Mon Sep 17 00:00:00 2001 From: Valerie R Young Date: Fri, 15 Mar 2019 17:19:08 -0400 Subject: [PATCH 2/5] Replace space with tab --- selectors-4/Overview.bs | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/selectors-4/Overview.bs b/selectors-4/Overview.bs index 56458fd3442..645b7647418 100644 --- a/selectors-4/Overview.bs +++ b/selectors-4/Overview.bs @@ -1419,15 +1419,15 @@ Namespaces in Elemental Selectors The Defined Pseudo-class: '':defined()'' The :defined pseudo-class matches any element that is - defined. + defined. Note: The '':defined'' pseudo-class is used to differentiate between a custom element that - has been successfully constructed from custom elements that have not yet been constructed or have - failed to be constructed. + has been successfully constructed from custom elements that have not yet been constructed or have + failed to be constructed.
For example, the '':defined'' pseudo-class can be used to hide a custom element before a - script defines the custom element but after it is initially rendered: + script defines the custom element but after it is initially rendered:
custom-element { visibility: hidden }
custom-element:defined { visibility: visible }
@@ -1441,7 +1441,6 @@ The Defined Pseudo-class: '':defined()''
p:defined { color: green }
-

Attribute selectors

From edb9db539b91a6f016cef2c7f846f3268ab436d8 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Thu, 24 Oct 2019 11:43:23 +0200 Subject: [PATCH 3/5] Define a high-level :defined --- selectors-4/Overview.bs | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/selectors-4/Overview.bs b/selectors-4/Overview.bs index 645b7647418..3fd7729f376 100644 --- a/selectors-4/Overview.bs +++ b/selectors-4/Overview.bs @@ -1418,25 +1418,20 @@ Namespaces in Elemental Selectors

The Defined Pseudo-class: '':defined()''

- The :defined pseudo-class matches any element that is - defined. - - Note: The '':defined'' pseudo-class is used to differentiate between a custom element that - has been successfully constructed from custom elements that have not yet been constructed or have - failed to be constructed. + The :defined pseudo-class allows authors to + differentiate between elements that has been successfully constructed from + elements that have not yet been constructed or have failed to be constructed.
- For example, the '':defined'' pseudo-class can be used to hide a custom element before a + In HTML, the '':defined'' pseudo-class can be used to hide a custom element before a script defines the custom element but after it is initially rendered:
custom-element { visibility: hidden }
custom-element:defined { visibility: visible }
- An element that is not a custom element will also match the '':defined'' pseudo-class. -
- For example, this style sheet will turn all paragraph text green: + In HTML, an element that is not a custom element will also match the '':defined'' pseudo-class.
p:defined { color: green }
From cfa6d55c591ca3661b03805ad4bf9e53ce8e4383 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Mon, 3 Feb 2020 14:31:53 +0100 Subject: [PATCH 4/5] Apply suggestions from code review --- selectors-4/Overview.bs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/selectors-4/Overview.bs b/selectors-4/Overview.bs index 3fd7729f376..e2d80c292d6 100644 --- a/selectors-4/Overview.bs +++ b/selectors-4/Overview.bs @@ -1416,7 +1416,7 @@ Namespaces in Elemental Selectors is an invalid selector.

-The Defined Pseudo-class: '':defined()''

+The Defined Pseudo-class: '':defined'' The :defined pseudo-class allows authors to differentiate between elements that has been successfully constructed from From fb31fea8de13fb7ed9cf0238c43f9bedf2b74315 Mon Sep 17 00:00:00 2001 From: Tab Atkins Jr Date: Fri, 7 Feb 2020 16:27:21 -0800 Subject: [PATCH 5/5] Rephrase :defined to be a little less vague about what "defined" means. --- selectors-4/Overview.bs | 30 +++++++++++++++++++----------- 1 file changed, 19 insertions(+), 11 deletions(-) diff --git a/selectors-4/Overview.bs b/selectors-4/Overview.bs index e2d80c292d6..458be9f18f4 100644 --- a/selectors-4/Overview.bs +++ b/selectors-4/Overview.bs @@ -1418,24 +1418,32 @@ Namespaces in Elemental Selectors

The Defined Pseudo-class: '':defined''

- The :defined pseudo-class allows authors to - differentiate between elements that has been successfully constructed from - elements that have not yet been constructed or have failed to be constructed. + In some host languages, + elements can have a distinction between being “defined”/“constructed” or not. + The :defined pseudo-class matches elements + that are fully defined, + as dictated by the host language. + + If the host language does not have this sort of distinction, + all elements in it match '':defined''.
- In HTML, the '':defined'' pseudo-class can be used to hide a custom element before a - script defines the custom element but after it is initially rendered: + In HTML, all built-in elements are always considered to be defined, + so the following example will always match: + +
p:defined { ... }
+ + [=Custom elements=], on the other hand, + start out undefined, + and only become defined when [=element definition|properly registered=]. + This means the '':defined'' pseudo-class + can be used to hide a custom element + until it has been registered:
custom-element { visibility: hidden }
custom-element:defined { visibility: visible }
-
- In HTML, an element that is not a custom element will also match the '':defined'' pseudo-class. - -
p:defined { color: green }
-
-

Attribute selectors