1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
|
<!DOCTYPE html>
<title>Image set parsing</title>
<link rel="author" title="Noam Rosenthal" href="mailto:noam.j.rosenthal@gmail.com">
<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);
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() {
// 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)'
);
}
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(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") 1dppx)');
test_valid_value_variants('background-image', 'image-set(url("example.png") 1dpi)');
test_valid_value_variants('background-image', 'image-set(url("example.png") 1dpcm)');
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(linear-gradient(black, white) 1x)");
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('content', "image-set(linear-gradient(black, white) 1x, 'example.png' 4x)", '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('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) 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) 1xtype('image/png'))");
test_invalid_value_variants('background-image', "image-set(type('image/png') url(example.png) 1x)");
test_invalid_value_variants('cursor', "image-set(linear-gradient(black, white) 1x)");
test_default_resolution();
</script>
|