Add code-comments to compute-kind-widget WPTs to clarify that their CSS rules are only used in a few of the tests.

The only manual changes in this patch are in the
build-compute-kind-widget-fallback-props.py script. The rest of this patch
was auto-generated by simply running that script.

Differential Revision: https://phabricator.services.mozilla.com/D234715

bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1941959
gecko-commit: 7018ade9a76362317275c9da9596f780663c3e4a
gecko-reviewers: zcorpan

Author: dholbert

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-background-attachment-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-background-color-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-block-start-color-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-block-start-style-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-block-start-width-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-image-source-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-top-color-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-top-left-radius-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-top-style-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>
 

css/css-ui/compute-kind-widget-generated/grouped-kind-of-widget-fallback-border-top-width-001.html

@@ -10,7 +10,9 @@
 <link rel="match" href="../compute-kind-widget-fallback-all-elements-ref.html">
 <style>
     #container { width: 500px; }
+    /* NOTE: This rule is only used in the search-text-input tests: */
     #container > #search-text-input { appearance: textfield; }
+    /* NOTE: This rule is only used in the select-menulist-button tests: */
     #container > #select-menulist-button { appearance: none; appearance: menulist-button; }
 </style>