Add support for non-positive resolutions to image-set

This change was triggered by the recently added wpt tests that started failing after auto import: third_party/blink/web_tests/external/wpt/css/css-images/image-set/image-set-zero-resolution-rendering.html third_party/blink/web_tests/external/wpt/css/css-images/image-set/image-set-zero-resolution-rendering-2.html Currently the spec does not restrict the range for resolution, thus non-positive resolutions are valid and should not be rejected at parse time. The current consensus is to parse the non-positive resolutions, but treat them as unsupported options for rendering purposes. With this change, image-set will match resolution parsing with media queries. An issue has been opend for the spec to define the valid argument range for resolution: w3c/csswg-drafts#8532 In the discussion on the issue new proposals were added about how to treat zero resolutions for rendering purposes. Until the spec is well defined in this area we will remove the zero resolution rendering tests. R=futhark, pdr Change-Id: I7b329519168f3c088f5c9ee8614931b0ead7a4df Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4312883 Commit-Queue: Philip Rogers <pdr@chromium.org> Commit-Queue: Traian Captan <tcaptan@chromium.org> Reviewed-by: Philip Rogers <pdr@chromium.org> Cr-Commit-Position: refs/heads/main@{#1114116}
web-platform-tests · Mar 7, 2023 · 6dd9e79 · 6dd9e79
1 parent 005a7ca
commit 6dd9e79
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 22 deletions.
diff --git a/...mage-set-zero-resolution-rendering-2.html → ...-set-negative-resolution-rendering-2.html b/...mage-set-zero-resolution-rendering-2.html → ...-set-negative-resolution-rendering-2.html
@@ -1,15 +1,14 @@
 <!DOCTYPE html>
-<title>Image set invalid resolution rendering</title>
-<link rel="author" title="Noam Rosenthal" href="mailto:noam@webkit.org">
+<title>Image set negative resolution rendering</title>
 <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org">
 <link rel="help" href="https://drafts.csswg.org/css-images-4/#image-set-notation">
 <link rel="match" href="reference/image-set-rendering-ref.html">
-<meta name="assert" content="image-set rendering with zero resolution">
+<meta name="assert" content="image-set rendering with negative resolution">
 <style>
   #test {
     background-image: url("/images/red.png");
     background-image: image-set(
-      url("/images/green.png") 0x,
+      url("/images/red.png") -1x,
       url("/images/green.png") 2x
     );
     width: 100px;

diff --git a/css/css-images/image-set/image-set-negative-resolution-rendering.html b/css/css-images/image-set/image-set-negative-resolution-rendering.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<title>Image set negative resolution rendering</title>
+<link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-images-4/#image-set-notation">
+<link rel="match" href="/css/reference/blank.html">
+<meta name="assert" content="image-set rendering with negative resolution">
+<style>
+  #test {
+    background-image: url("/images/red.png");
+    background-image: image-set(url("/images/green.png") -1x);
+    width: 100px;
+    height: 100px;
+  }
+</style>
+<div id="test"></div>
diff --git a/css/css-images/image-set/image-set-parsing.html b/css/css-images/image-set/image-set-parsing.html
@@ -142,6 +142,42 @@
   );
 }
 
+function test_non_positive_resolutions_parsing() {
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") 0x)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") 0dppx)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") 0dpi)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") 0dpcm)'
+  );
+
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") -1x)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") -3dppx)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") -96dpi)'
+  );
+  test_valid_value_variants(
+    'background-image',
+    'image-set(url("example.png") -113dpcm)'
+  );
+}
+
 function test_gradient_images_parsing() {
   test_valid_value_variants(
     'background-image',
@@ -257,14 +293,13 @@
 
   test_invalid_value_variants('background-image', "image-set(none, url(example.png) 1x)");
   test_invalid_value_variants('background-image', "image-set()");
-  test_invalid_value_variants('background-image', "image-set(url(example.png) 0x)");
-  test_invalid_value_variants('background-image', "image-set(url(example.png) -20x)");
   test_invalid_value_variants('background-image', "image-set('example.jpeg' 92pid url(example.png) 1x)");
   test_invalid_value_variants('background-image', "image-set(url(example.png) 1x url(example.jpeg))");
   test_invalid_value_variants('background-image', "image-set(url(example.png) 1x 2x)");
 
   test_default_resolution_parsing();
   test_resolution_units_parsing();
+  test_non_positive_resolutions_parsing();
   test_gradient_images_parsing();
   test_image_type_parsing();
   test_no_images_set_nesting();

diff --git a/css/css-images/image-set/image-set-zero-resolution-rendering.html b/css/css-images/image-set/image-set-zero-resolution-rendering.html