Bug 1611818 [wpt PR 21439] - [css-pseudo] Don't update non-normal markers if list-style-type changes, a=testonly
authorOriol Brufau <obrufau@igalia.com>
Wed, 29 Jan 2020 08:09:08 +0000
changeset 512300 1f016eef56a2b6ad168d622eeb711f19a3b86be8
parent 512299 48958cc7f042a58366dd803078fcaf514c50d4fd
child 512301 1bc768075328b6f75dcbaa66a64b43fb64ffbbf8
push id37078
push useropoprus@mozilla.com
push dateSat, 01 Feb 2020 09:28:06 +0000
treeherdermozilla-central@cd7d8aad0306 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1611818, 21439, 457718, 2020957, 736105
milestone74.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1611818 [wpt PR 21439] - [css-pseudo] Don't update non-normal markers if list-style-type changes, a=testonly Automatic update from web-platform-tests [css-pseudo] Don't update non-normal markers if list-style-type changes If a ::marker has the 'content' property set to something different than 'normal', then the contents of the marker should be determined according to that value, not from 'list-style-type'. Before this patch, the behavior was already correct when laying out the marker for the first time. But if 'list-style-type' changed afterwards, the marker was updated to reflect the new value, ignoring 'content'. BUG=457718 TEST=external/wpt/css/css-pseudo/marker-content-021.html The test fails in legacy since 'content' is not supported yet. Change-Id: Id845774739927c9c574a66e9d1cc94e6ea59d5e5 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2020957 Reviewed-by: Koji Ishii <kojii@chromium.org> Commit-Queue: Oriol Brufau <obrufau@igalia.com> Cr-Commit-Position: refs/heads/master@{#736105} -- wpt-commits: 937f0695552a0bea3bdc26e08e2e7195d4c3eced wpt-pr: 21439
testing/web-platform/tests/css/css-pseudo/marker-content-021-ref.html
testing/web-platform/tests/css/css-pseudo/marker-content-021.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/marker-content-021-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: ::marker pseudo elements styled with 'content' property</title>
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<style>
+::marker {
+  content: "[m]";
+}
+.inside {
+  list-style-position: inside;
+}
+</style>
+<ol class="inside">
+  <li>inside none→symbol</li>
+  <li>inside symbol→decimal</li>
+  <li>inside decimal→roman</li>
+  <li>inside roman→string</li>
+  <li>inside string→none</li>
+</ol>
+<ol class="outside">
+  <li>outside none→symbol</li>
+  <li>outside symbol→decimal</li>
+  <li>outside decimal→roman</li>
+  <li>outside roman→string</li>
+  <li>outside string→none</li>
+</ol>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-pseudo/marker-content-021.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>CSS Test: ::marker pseudo elements styled with 'content' property</title>
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<link rel="match" href="marker-content-021-ref.html">
+<link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
+<link rel="help" href="https://drafts.csswg.org/css-lists/#content-property">
+<meta name="assert" content="Checks that non-normal ::marker is not updated when 'list-style-type' changes dynamically.">
+<style>
+::marker {
+  content: "[m]";
+}
+.inside {
+  list-style-position: inside;
+}
+.none {
+  list-style-type: none;
+}
+.symbol {
+  list-style-type: disc;
+}
+.decimal {
+  list-style-type: decimal;
+}
+.roman {
+  list-style-type: lower-roman;
+}
+.string {
+  list-style-type: "string";
+}
+</style>
+<ol class="inside">
+  <li class="none">inside none→symbol</li>
+  <li class="symbol">inside symbol→decimal</li>
+  <li class="decimal">inside decimal→roman</li>
+  <li class="roman">inside roman→string</li>
+  <li class="string">inside string→none</li>
+</ol>
+<ol class="outside">
+  <li class="none">outside none→symbol</li>
+  <li class="symbol">outside symbol→decimal</li>
+  <li class="decimal">outside decimal→roman</li>
+  <li class="roman">outside roman→string</li>
+  <li class="string">outside string→none</li>
+</ol>
+<script src="/common/reftest-wait.js"></script>
+<script>
+"use strict";
+// Use a "load" event listener and requestAnimationFrame to ensure that
+// the markers will have been laid out.
+addEventListener("load", function() {
+  requestAnimationFrame(() => {
+    for (let list of document.querySelectorAll("ol")) {
+      // Rotate class names among list items
+      const firstClass = list.firstElementChild.className;
+      for (let item of list.children) {
+        const next = item.nextElementSibling;
+        item.className = next ? next.className : firstClass;
+      }
+    }
+    takeScreenshot();
+  });
+}, {once: true});
+</script>
+</html>