summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html')
-rw-r--r--testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html319
1 files changed, 319 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html b/testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html
new file mode 100644
index 0000000000..fece0bef3a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-images/image-set/image-set-parsing.html
@@ -0,0 +1,319 @@
+<!DOCTYPE html>
+<title>Image set parsing</title>
+<link rel="author" title="Noam Rosenthal" href="mailto:noam.j.rosenthal@gmail.com">
+<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">
+<meta name="assert" content="General image-set parsing follows CSS Images 4 rules.">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/css/support/parsing-testcommon.js"></script>
+<body>
+<script>
+function test_valid_value_variants(property, value, serializedValue) {
+ if (!serializedValue) serializedValue = value;
+ test_valid_value(property, value, serializedValue);
+
+ // The '-webkit-' prefixed 'image-set' is expected to serialize to the same
+ // value as standard 'image-set'.
+ // https://drafts.csswg.org/css-images-4/#deprecated
+ // "Implementations must accept -webkit-image-set() as a parse-time alias of
+ // image-set(). (It’s a valid value, with identical arguments to image-set(),
+ // and is turned into image-set() during parsing.)"
+ test_valid_value(property, "-webkit-" + value, serializedValue);
+}
+
+function test_invalid_value_variants(property, value) {
+ test_invalid_value(property, value);
+ test_invalid_value(property, "-webkit-" + value);
+}
+
+function test_default_resolution_parsing() {
+ // Based on the spec, the resolution is optional and should default
+ // to 1x if not specified.
+ // This set of tests verify this expectation.
+
+ // Test when the only image is missing it's resolution
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url(foo))',
+ 'image-set(url("foo") 1x)'
+ );
+
+ // Test when the 1st of 2 images is missing it's resolution
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url(foo), url(bar) 1x)',
+ 'image-set(url("foo") 1x, url("bar") 1x)'
+ );
+
+ // Test when the 2nd of 2 images is missing it's resolution
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url(foo) 1x, url(bar))',
+ 'image-set(url("foo") 1x, url("bar") 1x)'
+ );
+
+ // Test when both images are missing their resolutions
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url(foo), url(bar))',
+ 'image-set(url("foo") 1x, url("bar") 1x)'
+ );
+
+ // Test when the middle of 3 images is missing it's resolution
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url(foo) 1x, url(bar), url(baz) 2x)',
+ 'image-set(url("foo") 1x, url("bar") 1x, url("baz") 2x)'
+ );
+}
+
+function test_resolution_units_parsing() {
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1x)'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(2x * 3))',
+ 'image-set(url("example.png") calc(6dppx))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1dppx)'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(1dppx * 1))',
+ 'image-set(url("example.png") calc(1dppx))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1dpi)'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(96dpi * 2))',
+ 'image-set(url("example.png") calc(2dppx))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1dpcm)'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(1dpcm * 96/2.54))',
+ 'image-set(url("example.png") calc(1dppx))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1x, url("example.png") 2dppx, "example.png" 250dpi, "example.png" 1dpcm)',
+ 'image-set(url("example.png") 1x, url("example.png") 2dppx, url("example.png") 250dpi, url("example.png") 1dpcm)'
+ );
+ test_valid_value_variants(
+ 'content',
+ 'image-set(url("example.png") 1dpi)'
+ );
+ test_valid_value_variants(
+ 'content',
+ 'image-set(url("example.png") calc(1 * 96dpi))',
+ 'image-set(url("example.png") calc(1dppx))'
+ );
+
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1invalidResUnit)'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(3 * 4))'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(2 - 1))'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(2x - 1))'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") calc(1 + 4dpi))'
+ );
+}
+
+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_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") -1x)'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") -3dppx)'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") -96dpi)'
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") -113dpcm)'
+ );
+}
+
+function test_gradient_images_parsing() {
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(linear-gradient(black, white) 1x)"
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(repeating-linear-gradient(red, blue 25%) 1x)"
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(radial-gradient(black, white) 1x)"
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(repeating-radial-gradient(red, blue 25%) 1x)"
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(conic-gradient(black, white) 1x)"
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(repeating-conic-gradient(red, blue 25%) 1x)"
+ );
+ test_valid_value_variants(
+ 'content',
+ 'image-set(linear-gradient(black, white) 1x, url("example.png") 4x)'
+ );
+ test_valid_value_variants(
+ 'content',
+ 'image-set(url("example.png") 192dpi, linear-gradient(black, white) 1x)'
+ );
+
+ test_invalid_value_variants(
+ 'cursor',
+ "image-set(linear-gradient(black, white) 1x)"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(linear-gradient(red) 1x)"
+ );
+}
+
+function test_image_type_parsing() {
+ test_valid_value_variants(
+ 'background-image',
+ 'image-set(url("example.png") 1x type("image/png"))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type('image/png'))",
+ 'image-set(url("example.png") 1x type("image/png"))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type('image/png') 1x)",
+ 'image-set(url("example.png") 1x type("image/png"))'
+ );
+ test_valid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) 1x type('image/jpeg'))",
+ 'image-set(url("example.png") 1x type("image/jpeg"))'
+ );
+
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type(image/png))"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type('image/png') type('image/png'))"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type('image/png' 'image/png'))"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) type(url('image/png')))"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(url(example.png) 1xtype('image/png'))"
+ );
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(type('image/png') url(example.png) 1x)"
+ );
+}
+
+function test_no_images_set_nesting() {
+ // Spec definition:
+ // "The image-set() function can not be nested inside of itself,
+ // either directly or indirectly (as an argument to another <image> type)."
+
+ // Direct nesting
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(image-set(url(example.png)) 2x)"
+ );
+
+ // Indirect nesting
+ test_invalid_value_variants(
+ 'background-image',
+ "image-set(image(image-set(url(example.png)) 2x) 2x)"
+ );
+}
+
+function test_image_set_parsing() {
+ test_valid_value_variants('background-image', "image-set(url(example.png) 1x)", 'image-set(url("example.png") 1x)');
+ test_valid_value_variants('background-image', "image-set('example.jpg' 1x)", 'image-set(url("example.jpg") 1x)');
+ test_valid_value_variants('background-image', "image-set(url(example.png) 1x, 'example.png' 2x)", 'image-set(url("example.png") 1x, url("example.png") 2x)');
+ test_valid_value_variants('background-image', "image-set(url(example.png) 1dpcm, 'example.png' 2x)", 'image-set(url("example.png") 1dpcm, url("example.png") 2x)');
+ test_valid_value_variants('background-image', "image-set('example.jpeg' 222dpi, url(example.png) 3.5x)", 'image-set(url("example.jpeg") 222dpi, url("example.png") 3.5x)');
+ test_valid_value_variants('background-image', 'image-set(url("example.png") 0x)');
+ test_valid_value_variants('background-image', 'image-set(url("example.png") -20x)');
+
+ test_valid_value_variants('content', 'image-set(url("example.png") 1x)', 'image-set(url("example.png") 1x)');
+ test_valid_value_variants('content', 'image-set(url("example.png") 1x, "example.png" 3x)', 'image-set(url("example.png") 1x, url("example.png") 3x)');
+ test_valid_value_variants('border-image-source', 'image-set(url("example.png") 1x)', 'image-set(url("example.png") 1x)');
+ test_valid_value_variants('border-image-source', 'image-set(url("example.png") 1x, "example.png" 3x)', 'image-set(url("example.png") 1x, url("example.png") 3x)');
+
+ 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('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();
+}
+
+test_image_set_parsing();
+</script>