From 26a029d407be480d791972afb5975cf62c9360a6 Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Fri, 19 Apr 2024 02:47:55 +0200
Subject: Adding upstream version 124.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../css/css-pseudo/parsing/highlight-pseudos.html  |  22 ++
 .../marker-supported-properties-in-animation.html  | 397 +++++++++++++++++++++
 .../parsing/marker-supported-properties.html       | 102 ++++++
 .../parsing/tree-abiding-pseudo-elements.html      |  66 ++++
 4 files changed, 587 insertions(+)
 create mode 100644 testing/web-platform/tests/css/css-pseudo/parsing/highlight-pseudos.html
 create mode 100644 testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties-in-animation.html
 create mode 100644 testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties.html
 create mode 100644 testing/web-platform/tests/css/css-pseudo/parsing/tree-abiding-pseudo-elements.html

(limited to 'testing/web-platform/tests/css/css-pseudo/parsing')
diff --git a/testing/web-platform/tests/css/css-pseudo/parsing/highlight-pseudos.html b/testing/web-platform/tests/css/css-pseudo/parsing/highlight-pseudos.html
new file mode 100644
index 0000000000..aa3c4e20aa
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/parsing/highlight-pseudos.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Pseudo-Elements Test: highlight selectors parsing</title>
+<link rel="help" href="https://drafts.csswg.org/css-pseudo/#highlight-selectors">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+<script>
+  for (const pseudo of ["::selection", "::target-text", "::spelling-error", "::grammar-error"]) {
+    test_valid_selector(`${pseudo}`);
+    test_valid_selector(`.a${pseudo}`);
+    test_valid_selector(`div ${pseudo}`);
+    test_valid_selector(`::part(my-part)${pseudo}`);
+
+    test_invalid_selector(`::before${pseudo}`);
+    test_invalid_selector(`${pseudo}.a`);
+    test_invalid_selector(`${pseudo} div`);
+    test_invalid_selector(`${pseudo}::after`);
+    test_invalid_selector(`${pseudo}:hover`);
+    test_invalid_selector(`:not(${pseudo})`);
+  }
+</script>
diff --git a/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties-in-animation.html b/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties-in-animation.html
new file mode 100644
index 0000000000..e581a78636
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties-in-animation.html
@@ -0,0 +1,397 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Pseudo-Elements Test: Supported properties in ::marker animations</title>
+<link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#keyframes">
+<link rel="help" href="https://drafts.csswg.org/css-transitions-1/#transitions">
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<meta name="assert" content="This test checks ::marker supports animations and transitions, but only for the properties that apply to ::marker." />
+<style id="style"></style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="log"></div>
+<ul>
+  <li id="target">target</li>
+</ul>
+<script>
+const interpolationTests = [
+  // ::marker supports all font properties.
+  {
+    property: "font",
+    from: "oblique normal 100 ultra-condensed 5px / 20px serif",
+    to: "italic small-caps 900 ultra-expanded 25px / 50px Ahem",
+    midPoint: ["italic small-caps 500 expanded 15px / 35px Ahem", "italic small-caps 500 expanded 15px/35px Ahem"],
+  },
+  {
+    property: "font-family",
+    from: "serif",
+    to: "Ahem",
+    midPoint: "Ahem",
+  },
+  {
+    property: "font-feature-settings",
+    from: "'c2sc'",
+    to: "'smcp'",
+    midPoint: "\"smcp\"",
+  },
+  {
+    property: "font-kerning",
+    from: "normal",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "font-size",
+    from: "5px",
+    to: "25px",
+    midPoint: "15px",
+  },
+  {
+    property: "font-size-adjust",
+    from: "1",
+    to: "3",
+    midPoint: "2",
+  },
+  {
+    property: "font-stretch",
+    from: "ultra-condensed",
+    to: "ultra-expanded",
+    midPoint: ["expanded", "125%"],
+  },
+  {
+    property: "font-style",
+    from: "oblique",
+    to: "italic",
+    midPoint: "italic",
+  },
+  {
+    property: "font-synthesis",
+    from: "weight",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "font-synthesis-small-caps",
+    from: "auto",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "font-synthesis-style",
+    from: "auto",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "font-synthesis-weight",
+    from: "auto",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "font-variant",
+    from: "unicase",
+    to: "small-caps",
+    midPoint: "small-caps",
+  },
+  {
+    property: "font-variant-caps",
+    from: "unicase",
+    to: "small-caps",
+    midPoint: "small-caps",
+  },
+  {
+    property: "font-variant-east-asian",
+    from: "proportional-width",
+    to: "full-width",
+    midPoint: "full-width",
+  },
+  {
+    property: "font-variant-ligatures",
+    from: "no-historical-ligatures",
+    to: "historical-ligatures",
+    midPoint: "historical-ligatures",
+  },
+  {
+    property: "font-variant-numeric",
+    from: "ordinal",
+    to: "slashed-zero",
+    midPoint: "slashed-zero",
+  },
+  {
+    property: "font-variant-position",
+    from: "super",
+    to: "sub",
+    midPoint: "sub",
+  },
+  {
+    property: "font-weight",
+    from: "100",
+    to: "900",
+    midPoint: "500",
+  },
+
+  // `line-height` is not a font property but is a longhand of `font`, and is also supported.
+  {
+    property: "line-height",
+    from: "20px",
+    to: "50px",
+    midPoint: "35px",
+  },
+
+  // ::marker supports `white-space`
+  {
+    property: "white-space",
+    from: "pre-line",
+    to: "nowrap",
+    midPoint: "nowrap",
+  },
+
+  // ::marker supports `color`
+  {
+    property: "color",
+    from: "rgb(0, 100, 200)",
+    to: "rgb(100, 200, 0)",
+    midPoint: "rgb(50, 150, 100)",
+  },
+
+  // ::marker supports `text-combine-upright`, `unicode-bidi` and `direction`,
+  // but they are not animatable.
+  {
+    property: "text-combine-upright",
+    from: "all",
+    to: "all",
+    midPoint: null,
+  },
+  {
+    property: "unicode-bidi",
+    from: "embed",
+    to: "plaintext",
+    midPoint: null,
+  },
+  {
+    property: "direction",
+    from: "rtl",
+    to: "rtl",
+    midPoint: null,
+  },
+
+  // ::marker supports `content`
+  {
+    property: "content",
+    from: "'foo'",
+    to: "'bar'",
+    midPoint: "\"bar\"",
+  },
+
+  // ::marker supports text properties.
+  {
+    property: "hyphens",
+    from: "manual",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "letter-spacing",
+    from: "0px",
+    to: "20px",
+    midPoint: "10px",
+  },
+  {
+    property: "line-break",
+    from: "strict",
+    to: "anywhere",
+    midPoint: "anywhere",
+  },
+  {
+    property: "overflow-wrap",
+    from: "break-word",
+    to: "anywhere",
+    midPoint: "anywhere",
+  },
+  {
+    property: "tab-size",
+    from: "0px",
+    to: "20px",
+    midPoint: "10px",
+  },
+  {
+    property: "text-transform",
+    from: "lowercase",
+    to: "uppercase",
+    midPoint: "uppercase",
+  },
+  {
+    property: "word-break",
+    from: "break-all",
+    to: "break-word",
+    midPoint: "break-word",
+  },
+  {
+    property: "word-spacing",
+    from: "0px",
+    to: "20px",
+    midPoint: "10px",
+  },
+
+  // ::marker supports inherited text decoration properties.
+  {
+    property: "text-decoration-skip-ink",
+    from: "auto",
+    to: "none",
+    midPoint: "none",
+  },
+  {
+    property: "text-emphasis",
+    from: "dot rgb(0, 200, 0)",
+    to: "triangle rgb(100, 0, 200)",
+    midPoint: "triangle rgb(50, 100, 100)",
+  },
+  {
+    property: "text-emphasis-color",
+    from: "rgb(0, 200, 0)",
+    to: "rgb(100, 0, 200)",
+    midPoint: "rgb(50, 100, 100)",
+  },
+  {
+    property: "text-emphasis-position",
+    from: "over right",
+    to: "under left",
+    midPoint: "under left",
+  },
+  {
+    property: "text-emphasis-style",
+    from: "filled dot",
+    to: "filled triangle",
+    midPoint: "triangle",
+  },
+  {
+    property: "text-shadow",
+    from: "rgb(0, 200, 0) 1px 2px 3px",
+    to: "rgb(100, 0, 200) 3px 2px 1px",
+    midPoint: "rgb(50, 100, 100) 2px 2px 2px",
+  },
+
+  // ::marker does NOT support layout properties
+  {
+    property: "display",
+    from: "flex",
+    to: "none",
+    midPoint: ["block", "inline", "inline-block"],
+  },
+  {
+    property: "position",
+    from: "fixed",
+    to: "absolute",
+    midPoint: "static",
+  },
+  {
+    property: "float",
+    from: "left",
+    to: "right",
+    midPoint: "none",
+  },
+
+  // ::marker does NOT support list properties despite being affected by them,
+  // they apply to the list item instead.
+  {
+    property: "list-style",
+    from: "inside url('foo') square",
+    to: "inside url('bar') decimal",
+    midPoint: "outside none disc",
+  },
+  {
+    property: "list-style-image",
+    from: "url('foo')",
+    to: "url('bar')",
+    midPoint: "none",
+  },
+  {
+    property: "list-style-position",
+    from: "inside",
+    to: "inside",
+    midPoint: "outside",
+  },
+  {
+    property: "list-style-type",
+    from: "square",
+    to: "decimal",
+    midPoint: "disc",
+  },
+];
+
+const target = document.getElementById("target");
+const styleElement = document.getElementById("style");
+const markerStyle = getComputedStyle(target, "::marker");
+
+function check({property, from, to, midPoint}) {
+  assert_true(property in markerStyle, property + " doesn't seem to be supported in the computed style");
+  assert_true(CSS.supports(property, from), `'${from}' is a supported value for ${property}.`);
+  assert_true(CSS.supports(property, to), `'${to}' is a supported value for ${property}.`);
+  const computed = markerStyle.getPropertyValue(property);
+  if (Array.isArray(midPoint)) {
+    assert_in_array(computed, midPoint);
+  } else {
+    assert_equals(computed, midPoint);
+  }
+}
+
+function testAnimations(interpolationTests) {
+  styleElement.textContent = `
+    ::marker {
+      animation: anim 2s -1s paused linear;
+    }
+    @keyframes anim {
+      from {}
+      to {}
+    }
+  `;
+  const keyframes = styleElement.sheet.cssRules[1];
+  const fromStyle = keyframes.cssRules[0].style;
+  const toStyle = keyframes.cssRules[1].style;
+  for (let {property, from, to, midPoint} of interpolationTests) {
+    fromStyle.cssText = "";
+    toStyle.cssText = "";
+    if (midPoint == null) {
+      midPoint = markerStyle.getPropertyValue(property);
+    }
+    fromStyle.setProperty(property, from);
+    toStyle.setProperty(property, to);
+    test(() => {
+      check({property, from, to, midPoint});
+    }, `Animation of ${property} in ::marker`);
+  }
+}
+
+function testTransitions(interpolationTests) {
+  styleElement.textContent = `
+    .transition::marker {
+      transition: all 2s -1s linear;
+    }
+    .from::marker {}
+    .to::marker {}
+  `;
+  const fromStyle = styleElement.sheet.cssRules[1].style;
+  const toStyle = styleElement.sheet.cssRules[2].style;
+  for (let {property, from, to, midPoint} of interpolationTests) {
+    fromStyle.cssText = "";
+    toStyle.cssText = "";
+    if (midPoint == null) {
+      midPoint = to;
+    }
+    fromStyle.setProperty(property, from);
+    toStyle.setProperty(property, to);
+    target.className = "from";
+    markerStyle.width;
+    target.classList.add("transition");
+    markerStyle.width;
+    target.classList.add("to");
+    test(() => {
+      check({property, from, to, midPoint});
+    }, `Transition of ${property} in ::marker`);
+  }
+}
+
+testAnimations(interpolationTests);
+testTransitions(interpolationTests);
+</script>
diff --git a/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties.html b/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties.html
new file mode 100644
index 0000000000..700d04aa83
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/parsing/marker-supported-properties.html
@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Pseudo-Elements Test: Supported properties in ::marker</title>
+<link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<meta name="assert" content="This test checks that only certain properties apply to ::marker pseudo-elements." />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/computed-testcommon.js"></script>
+<div id="log"></div>
+<ul>
+  <li id="target">target</li>
+</ul>
+<script>
+// ::marker supports all font properties.
+test_pseudo_computed_value("::marker", "font", "italic small-caps 900 expanded 25px / 50px Ahem",
+  ["italic small-caps 900 expanded 25px / 50px Ahem", "italic small-caps 900 expanded 25px/50px Ahem"]);
+test_pseudo_computed_value("::marker", "font-family", "Ahem");
+test_pseudo_computed_value("::marker", "font-feature-settings", "\"smcp\"");
+test_pseudo_computed_value("::marker", "font-kerning", "none");
+test_pseudo_computed_value("::marker", "font-size", "25px");
+test_pseudo_computed_value("::marker", "font-size-adjust", "1");
+test_pseudo_computed_value("::marker", "font-stretch", "expanded", ["expanded", "125%"]);
+test_pseudo_computed_value("::marker", "font-style", "italic");
+test_pseudo_computed_value("::marker", "font-synthesis", "none");
+test_pseudo_computed_value("::marker", "font-synthesis-small-caps", "none");
+test_pseudo_computed_value("::marker", "font-synthesis-style", "none");
+test_pseudo_computed_value("::marker", "font-synthesis-weight", "none");
+test_pseudo_computed_value("::marker", "font-variant", "small-caps");
+test_pseudo_computed_value("::marker", "font-variant-caps", "small-caps");
+test_pseudo_computed_value("::marker", "font-variant-east-asian", "full-width");
+test_pseudo_computed_value("::marker", "font-variant-ligatures", "historical-ligatures");
+test_pseudo_computed_value("::marker", "font-variant-numeric", "slashed-zero");
+test_pseudo_computed_value("::marker", "font-variant-position", "sub");
+test_pseudo_computed_value("::marker", "font-weight", "900");
+
+// `line-height` is not a font property but is a longhand of `font`, and is also supported.
+test_pseudo_computed_value("::marker", "line-height", "50px", "50px");
+
+// ::marker supports `white-space`
+test_pseudo_computed_value("::marker", "white-space", "nowrap");
+
+// ::marker supports `color`
+test_pseudo_computed_value("::marker", "color", "rgb(0, 100, 200)");
+
+// ::marker supports `text-combine-upright`, `unicode-bidi` and `direction`
+test_pseudo_computed_value("::marker", "text-combine-upright", "all");
+test_pseudo_computed_value("::marker", "unicode-bidi", "plaintext");
+test_pseudo_computed_value("::marker", "direction", "rtl");
+
+// ::marker supports `content`
+test_pseudo_computed_value("::marker", "content", "\"foo\"");
+
+// ::marker supports animation properties.
+test_pseudo_computed_value("::marker", "animation", "1s linear 2s infinite alternate forwards paused anim");
+test_pseudo_computed_value("::marker", "animation-delay", "1s");
+test_pseudo_computed_value("::marker", "animation-direction", "alternate");
+test_pseudo_computed_value("::marker", "animation-duration", "2s");
+test_pseudo_computed_value("::marker", "animation-fill-mode", "forwards");
+test_pseudo_computed_value("::marker", "animation-iteration-count", "infinite");
+test_pseudo_computed_value("::marker", "animation-name", "anim");
+test_pseudo_computed_value("::marker", "animation-play-state", "paused");
+test_pseudo_computed_value("::marker", "animation-timing-function", "linear");
+test_pseudo_computed_value("::marker", "animation-composition", "add");
+
+// ::marker supports transition properties.
+test_pseudo_computed_value("::marker", "transition", "display 1s linear 2s");
+test_pseudo_computed_value("::marker", "transition-delay", "1s");
+test_pseudo_computed_value("::marker", "transition-duration", "2s");
+test_pseudo_computed_value("::marker", "transition-property", "display");
+test_pseudo_computed_value("::marker", "transition-timing-function", "linear");
+
+// ::marker supports text properties.
+test_pseudo_computed_value("::marker", "hyphens", "none");
+test_pseudo_computed_value("::marker", "letter-spacing", "10px");
+test_pseudo_computed_value("::marker", "line-break", "anywhere");
+test_pseudo_computed_value("::marker", "overflow-wrap", "anywhere");
+test_pseudo_computed_value("::marker", "tab-size", "10px");
+test_pseudo_computed_value("::marker", "text-transform", "uppercase");
+test_pseudo_computed_value("::marker", "word-break", "break-word");
+test_pseudo_computed_value("::marker", "word-spacing", "10px");
+
+// ::marker supports inherited text decoration properties.
+test_pseudo_computed_value("::marker", "text-decoration-skip-ink", "none");
+test_pseudo_computed_value("::marker", "text-emphasis", "dot rgb(0, 255, 0)");
+test_pseudo_computed_value("::marker", "text-emphasis-color", "rgb(0, 255, 0)");
+test_pseudo_computed_value("::marker", "text-emphasis-position", "under left");
+test_pseudo_computed_value("::marker", "text-emphasis-style", "dot");
+test_pseudo_computed_value("::marker", "text-shadow", "rgb(0, 255, 0) 1px 2px 3px");
+
+// ::marker does NOT support layout properties
+test_pseudo_computed_value("::marker", "display", "none", ["block", "inline", "inline-block"]);
+test_pseudo_computed_value("::marker", "position", "absolute", "static");
+test_pseudo_computed_value("::marker", "float", "right", "none");
+
+// ::marker does NOT support list properties despite being affected by them,
+// they apply to the list item instead.
+test_pseudo_computed_value("::marker", "list-style", "inside url('foo') decimal", "outside none disc");
+test_pseudo_computed_value("::marker", "list-style-image", "url('foo')", "none");
+test_pseudo_computed_value("::marker", "list-style-position", "inside", "outside");
+test_pseudo_computed_value("::marker", "list-style-type", "decimal", "disc");
+</script>
diff --git a/testing/web-platform/tests/css/css-pseudo/parsing/tree-abiding-pseudo-elements.html b/testing/web-platform/tests/css/css-pseudo/parsing/tree-abiding-pseudo-elements.html
new file mode 100644
index 0000000000..7839a38049
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/parsing/tree-abiding-pseudo-elements.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Pseudo-Elements Test: Parsing tree-abiding pseudo-elements</title>
+<link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#treelike">
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<meta name="assert" content="This test checks the validity of various selectors containing tree-abiding pseudo-elements." />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+<script>
+// Generated content pseudo-elements
+test_valid_selector("::before");
+test_valid_selector("*::before", "::before");
+test_valid_selector("foo.bar[baz]::before");
+test_invalid_selector("::before *");
+
+test_valid_selector("::after");
+test_valid_selector("*::after", "::after");
+test_valid_selector("foo.bar[baz]::after");
+test_invalid_selector("::after *");
+
+// List marker pseudo-element
+test_valid_selector("::marker");
+test_valid_selector("*::marker", "::marker");
+test_valid_selector("foo.bar[baz]::marker");
+test_invalid_selector("::marker *");
+
+// Placeholder input pseudo-element
+test_valid_selector("::placeholder");
+test_valid_selector("*::placeholder", "::placeholder");
+test_valid_selector("foo.bar[baz]::placeholder");
+test_invalid_selector("::placeholder *");
+
+// ::file-selector-button
+test_valid_selector("::file-selector-button");
+test_valid_selector("::file-selector-button:hover");
+test_valid_selector("::file-selector-button:focus");
+test_valid_selector("::file-selector-button:active");
+test_valid_selector("::file-selector-button:is(:hover)");
+
+test_invalid_selector("::file-selector-button::before");
+test_invalid_selector("::file-selector-button#id");
+test_invalid_selector("::file-selector-button#class");
+test_invalid_selector("::file-selector-button:host");
+
+// Combinations of the above
+test_invalid_selector("::before::before");
+test_invalid_selector("::after::before");
+test_invalid_selector("::marker::before");
+test_invalid_selector("::placeholder::before");
+
+test_invalid_selector("::before::after");
+test_invalid_selector("::after::after");
+test_invalid_selector("::marker::after");
+test_invalid_selector("::placeholder::after");
+
+test_valid_selector("::before::marker");
+test_valid_selector("::after::marker");
+test_invalid_selector("::marker::marker");
+test_invalid_selector("::placeholder::marker");
+
+test_invalid_selector("::before::placeholder");
+test_invalid_selector("::after::placeholder");
+test_invalid_selector("::marker::placeholder");
+test_invalid_selector("::placeholder::placeholder");
+</script>
-- 
cgit v1.2.3

