Update web-platform-tests to revision b'468d01bbd84da2babf265c6af46947be68713440'

tests/wpt/web-platform-tests/css/css-pseudo/support/highlights.css

@@ -0,0 +1,68 @@
+/**
+ * Container for the interesting part of a highlight reftest, to be
+ * used on both the test page and any reference pages.
+ */
+.highlight_reftest {
+    /*
+        https://drafts.csswg.org/css-pseudo-4/#highlight-bounds
+        For text, the corresponding overlay must cover at least
+        the entire em box and may extend further above/below the
+        em box to the line box edges.
+    */
+    line-height: 1;
+}
+
+/**
+ * Container for layers. All text is transparent by default, and each direct
+ * child creates a layer that overlaps any text content.
+ */
+.hrt_layers,
+.hrt_layers * {
+    color: transparent;
+}
+.hrt_layers {
+    position: relative;
+}
+.hrt_layers > * {
+    position: absolute;
+}
+
+/**
+ * Cover to clip text from the right. Usage:
+ *
+ *  <div class="hrt_layers">
+ *      <div><!-- content to clip to “foo” from right --></div>
+ *      <div><span class="hrt_cover">bar</span>foobar</div>
+ *      foobar
+ *  </div>
+ */
+.hrt_cover {
+    background: white;
+    position: absolute;
+    padding: 0.5em 0;
+    top: -0.5em;
+    right: 0;
+}
+
+/**
+ * Hider to clip text from the left. Usage:
+ *
+ *  <div class="hrt_layers">
+ *      <div>foo<span class="hrt_hider">
+ *          <div><!-- content to clip to “bar” from left --></div>
+ *          bar
+ *      </span></div>
+ *      foobar
+ *  </div>
+ */
+.hrt_hider {
+    display: inline-block;
+    overflow: hidden;
+    position: relative;
+    padding: 0.5em 0;
+    top: -0.5em;
+}
+.hrt_hider > * {
+    position: absolute;
+    right: 0;
+}

tests/wpt/web-platform-tests/css/css-pseudo/support/selections.js

@@ -1,6 +1,15 @@
 /**
  * Replaces the current selection (if any) with a new range, after
  * it’s configured by the given function.
+ *
+ * See also: selectNodeContents
+ * Example:
+ *
+ * selectRangeWith(range => {
+ *     range.selectNodeContents(foo);
+ *     range.setStart(foo.childNodes[0], 3);
+ *     range.setEnd(foo.childNodes[0], 5);
+ * });
  */
 function selectRangeWith(fun) {
     const selection = getSelection();
@@ -37,17 +46,20 @@ function selectNodeContents(node) {
 }
 
 /**
- * Tries to convince a UA with lazy spellcheck to check and mark the
- * contents of the given nodes (form fields or @contenteditables).
+ * Tries to convince a UA with lazy spellcheck to check and highlight
+ * the contents of the given nodes (form fields or @contenteditables).
  *
- * Both focus and selection can be used for this purpose, but only
- * focus works for @contenteditables.
+ * Each node is focused then immediately unfocused. Both focus and
+ * selection can be used for this purpose, but only focus works for
+ * @contenteditables.
  */
 function trySpellcheck(...nodes) {
     // This is inherently a flaky test risk, but Chromium (as of 87)
     // seems to cancel spellcheck on a node if it wasn’t the last one
     // focused for “long enough” (though immediate unfocus is ok).
-    // setInterval(0) is usually not long enough.
+    // Using requestAnimationFrame or setInterval(0) are usually not
+    // long enough (see <https://bucket.daz.cat/work/igalia/0/0.html>
+    // under “trySpellcheck strategy” for an example).
     const interval = setInterval(() => {
         if (nodes.length > 0) {
             const node = nodes.shift();