Bug 1647024 [wpt PR 24262] - Revert non-URL background images in Forc…

…ed Colors Mode, a=testonly Automatic update from web-platform-tests Revert non-URL background images in Forced Colors Mode As resolved by the CSSWG, non-URL background-images should be reverted in Forced Colors Mode. w3c/csswg-drafts#4916 Bug: 970285 Change-Id: I24c903f96da1921bb3da0388100062091afbb507 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2254441 Reviewed-by: Anders Hartvoll Ruud <[email protected]> Commit-Queue: Alison Maher <[email protected]> Cr-Commit-Position: refs/heads/master@{#780874} -- wpt-commits: 2e78e6d435f33d7c44e68978fe0b459a801c2ee8 wpt-pr: 24262
mozilla · Jun 24, 2020 · 94e77a3 · 94e77a3
1 parent 07a1e08
commit 94e77a3
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 0 deletions.
diff --git a/testing/web-platform/tests/forced-colors-mode/forced-colors-mode-28-ref.html b/testing/web-platform/tests/forced-colors-mode/forced-colors-mode-28-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Forced colors mode - background-image.
+</title>
+<style>
+  body {
+    forced-color-adjust: none;
+  }
+  div {
+    height: 20px;
+    width: 10px;
+  }
+  #div2, #div3 {
+    background-image: url("resources/test-image.jpg");
+  }
+</style>
+<body>
+  The background-image should be reverted in Forced Colors Mode unless the value
+  is a url() function.
+  <div id="div1"></div>
+  <div id="div2"></div>
+  <div id="div3"></div>
+  <div id="div4"></div>
+</body>
diff --git a/testing/web-platform/tests/forced-colors-mode/forced-colors-mode-28.html b/testing/web-platform/tests/forced-colors-mode/forced-colors-mode-28.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Forced colors mode - background-image.
+</title>
+<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-colors-properties">
+<link rel=match href="forced-colors-mode-28-ref.html">
+<style>
+  div {
+    height: 20px;
+    width: 10px;
+  }
+  #div1 {
+    background-image: url("resources/test-image.jpg");
+    background-image: linear-gradient(red, yellow);
+  }
+  #div2 {
+    background-image: linear-gradient(red, yellow);
+    background-image: url("resources/test-image.jpg");
+  }
+  #div3 {
+    background-image: url("resources/test-image.jpg");
+  }
+  #div4 {
+    background-image: linear-gradient(red, yellow);
+  }
+</style>
+<body>
+  The background-image should be reverted in Forced Colors Mode unless the value
+  is a url() function.
+  <div id="div1"></div>
+  <div id="div2"></div>
+  <div id="div3"></div>
+  <div id="div4"></div>
+</body>