Skip to content

Commit ef8b555

Browse files
ericwilligerschromium-wpt-export-bot
ericwilligers
authored and
chromium-wpt-export-bot
committed
CSS: list-style shorthand matches updated spec
Update the list-style shorthand https://drafts.csswg.org/css-lists-3/#list-style-property to match spec change w3c/csswg-drafts#2624 w3c/csswg-drafts@8ac1376 Bug: 978433 Change-Id: I579c2272390487b429d5fe986c51cdd2041653d8
1 parent 87e1dab commit ef8b555

12 files changed

+290
-1
lines changed

‎css/css-lists/parsing/list-style-computed.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: getComputedValue().listStyletitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style">
7+
<meta name="assert" content="list-style computed value is as specified.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/computed-testcommon.js">script>
11+
head>
12+
<body>
13+
<div id="target">div>
14+
<script>
15+
test_computed_value('list-style', 'none', 'outside none none');
16+
17+
test_computed_value('list-style', 'inside', 'inside none disc');
18+
test_computed_value('list-style', 'url("https://example.com/")', 'outside url("https://example.com/") disc');
19+
test_computed_value('list-style', 'square', 'outside none square');
20+
21+
test_computed_value('list-style', 'inside url("https://example.com/") square');
22+
script>
23+
body>
24+
html>

‎css/css-lists/parsing/list-style-image-invalid.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-image with invalid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-image">
7+
<meta name="assert" content="list-style-image supports only the grammar ' | none'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_invalid_value('list-style-image', 'auto');
15+
test_invalid_value('list-style-image', 'url("https://example.com/") none');
16+
script>
17+
body>
18+
html>

‎css/css-lists/parsing/list-style-image-valid.html

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-image with valid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-image">
7+
<meta name="assert" content="list-style-image supports the full grammar ' | none'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_valid_value('list-style-image', 'none');
15+
16+
test_valid_value('list-style-image', 'url("https://example.com/")');
17+
18+
test_valid_value('list-style-image', 'linear-gradient(to left bottom, red, blue)');
19+
20+
// TODO: Add cross-fade tests when browsers add support.
21+
script>
22+
body>
23+
html>

‎css/css-lists/parsing/list-style-invalid.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style with invalid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style">
7+
<meta name="assert" content="list-style supports only the grammar '<'list-style-position'> || <'list-style-image'> || <'list-style-type'>'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_invalid_value('list-style', 'inside disc outside');
15+
test_invalid_value('list-style', 'square circle');
16+
script>
17+
body>
18+
html>

‎css/css-lists/parsing/list-style-position-computed.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: getComputedValue().listStylePositiontitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-position">
7+
<meta name="assert" content="list-style-position computed value is as specified.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/computed-testcommon.js">script>
11+
head>
12+
<body>
13+
<div id="target">div>
14+
<script>
15+
test_computed_value('list-style-position', 'inside');
16+
test_computed_value('list-style-position', 'outside');
17+
script>
18+
body>
19+
html>

‎css/css-lists/parsing/list-style-position-invalid.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-position with invalid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-position">
7+
<meta name="assert" content="list-style-position supports only the grammar 'inside | outside'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_invalid_value('list-style-position', 'auto');
15+
test_invalid_value('list-style-position', 'inside outside');
16+
script>
17+
body>
18+
html>

‎css/css-lists/parsing/list-style-position-valid.html

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-position with valid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-position">
7+
<meta name="assert" content="list-style-position supports the full grammar 'inside | outside'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_valid_value('list-style-position', 'inside');
15+
test_valid_value('list-style-position', 'outside');
16+
script>
17+
body>
18+
html>

‎css/css-lists/parsing/list-style-type-computed.html

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: getComputedValue().listStyleTypetitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-type">
7+
<meta name="assert" content="list-style-type computed value is as specified.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/computed-testcommon.js">script>
11+
head>
12+
<body>
13+
<div id="target">div>
14+
<script>
15+
test_computed_value('list-style-type', 'none');
16+
17+
test_computed_value('list-style-type', 'disc');
18+
test_computed_value('list-style-type', 'circle');
19+
test_computed_value('list-style-type', 'square');
20+
test_computed_value('list-style-type', 'decimal');
21+
test_computed_value('list-style-type', 'decimal-leading-zero');
22+
test_computed_value('list-style-type', 'lower-roman');
23+
test_computed_value('list-style-type', 'upper-roman');
24+
test_computed_value('list-style-type', 'lower-greek');
25+
test_computed_value('list-style-type', 'lower-latin');
26+
test_computed_value('list-style-type', 'upper-latin');
27+
test_computed_value('list-style-type', 'armenian');
28+
test_computed_value('list-style-type', 'georgian');
29+
test_computed_value('list-style-type', 'lower-alpha');
30+
test_computed_value('list-style-type', 'upper-alpha');
31+
32+
//
33+
test_computed_value('list-style-type', '"marker string"');
34+
test_computed_value('list-style-type', '"Note: "');
35+
36+
// = | symbols();
37+
test_computed_value('list-style-type', 'counter-Style-Name');
38+
test_computed_value('list-style-type', 'CounterStyleName');
39+
40+
// symbols() = symbols( ? [ | ]+ );
41+
// = cyclic | numeric | alphabetic | symbolic | fixed;
42+
test_computed_value('list-style-type', 'symbols(cyclic "string")');
43+
test_computed_value('list-style-type', 'symbols(cyclic "○" "●")');
44+
test_computed_value('list-style-type', 'symbols(fixed "1")');
45+
test_computed_value('list-style-type', 'symbols("string")');
46+
test_computed_value('list-style-type', 'symbols(alphabetic "first" "second")');
47+
test_computed_value('list-style-type', 'symbols(numeric "first" "second")');
48+
script>
49+
body>
50+
html>

‎css/css-lists/parsing/list-style-type-invalid.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-type with invalid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-type">
7+
<meta name="assert" content="list-style-type supports only the grammar ' | | none'.">
8+
<meta name="assert" content="If the system is alphabetic or numeric, there must be at least two s or s, or else the function is invalid.">
9+
<script src="/resources/testharness.js">script>
10+
<script src="/resources/testharnessreport.js">script>
11+
<script src="/css/support/parsing-testcommon.js">script>
12+
head>
13+
<body>
14+
<script>
15+
test_invalid_value('list-style-type', '"marker string" none');
16+
test_invalid_value('list-style-type', 'counter-Style-Name "marker string"');
17+
test_invalid_value('list-style-type', 'symbols(cyclic)');
18+
test_invalid_value('list-style-type', 'symbols(numeric "n")');
19+
test_invalid_value('list-style-type', 'symbols(alphabetic "a")');
20+
test_invalid_value('list-style-type', 'symbols("s" symbolic)');
21+
test_invalid_value('list-style-type', 'symbols(fixed url("https://example.com"))');
22+
23+
// Example in an early spec.
24+
test_invalid_value('list-style-type', "symbols(repeating '○' '●')");
25+
26+
script>
27+
body>
28+
html>

‎css/css-lists/parsing/list-style-type-valid.html

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style-type with valid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style-type">
7+
<link rel="help" href="https://www.w3.org/TR/CSS2/generate.html#propdef-list-style-type">
8+
<meta name="assert" content="list-style-type supports the full grammar ' | | none'.">
9+
<script src="/resources/testharness.js">script>
10+
<script src="/resources/testharnessreport.js">script>
11+
<script src="/css/support/parsing-testcommon.js">script>
12+
head>
13+
<body>
14+
<script>
15+
test_valid_value('list-style-type', 'none');
16+
17+
test_valid_value('list-style-type', 'disc');
18+
test_valid_value('list-style-type', 'circle');
19+
test_valid_value('list-style-type', 'square');
20+
test_valid_value('list-style-type', 'decimal');
21+
test_valid_value('list-style-type', 'decimal-leading-zero');
22+
test_valid_value('list-style-type', 'lower-roman');
23+
test_valid_value('list-style-type', 'upper-roman');
24+
test_valid_value('list-style-type', 'lower-greek');
25+
test_valid_value('list-style-type', 'lower-latin');
26+
test_valid_value('list-style-type', 'upper-latin');
27+
test_valid_value('list-style-type', 'armenian');
28+
test_valid_value('list-style-type', 'georgian');
29+
test_valid_value('list-style-type', 'lower-alpha');
30+
test_valid_value('list-style-type', 'upper-alpha');
31+
32+
//
33+
test_valid_value('list-style-type', '"marker string"');
34+
test_valid_value('list-style-type', '"Note: "');
35+
36+
// = | symbols();
37+
test_valid_value('list-style-type', 'counter-Style-Name');
38+
test_valid_value('list-style-type', 'CounterStyleName');
39+
40+
// symbols() = symbols( ? [ | ]+ );
41+
// = cyclic | numeric | alphabetic | symbolic | fixed;
42+
test_valid_value('list-style-type', 'symbols(cyclic "string")');
43+
test_valid_value('list-style-type', 'symbols(cyclic "○" "●")');
44+
test_valid_value('list-style-type', 'symbols(fixed "1")');
45+
test_valid_value('list-style-type', 'symbols(symbolic "string")', 'symbols("string")');
46+
test_valid_value('list-style-type', 'symbols(alphabetic "first" "second")');
47+
test_valid_value('list-style-type', 'symbols(numeric "first" "second")');
48+
script>
49+
body>
50+
html>

‎css/css-lists/parsing/list-style-valid.html

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>CSS Lists: parsing list-style with valid valuestitle>
6+
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style">
7+
<meta name="assert" content="list-style supports the full grammar '<'list-style-position'> || <'list-style-image'> || <'list-style-type'>'.">
8+
<script src="/resources/testharness.js">script>
9+
<script src="/resources/testharnessreport.js">script>
10+
<script src="/css/support/parsing-testcommon.js">script>
11+
head>
12+
<body>
13+
<script>
14+
test_valid_value('list-style', 'none');
15+
16+
test_valid_value('list-style', 'inside');
17+
test_valid_value('list-style', 'url("https://example.com/")');
18+
test_valid_value('list-style', 'square');
19+
20+
test_valid_value('list-style', 'square url("https://example.com/") inside', 'inside url("https://example.com/") square');
21+
script>
22+
body>
23+
html>

‎css/cssom/shorthand-values.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
'overflow-x: scroll; overflow-y: scroll;': 'overflow: scroll;',
3737
'outline-width: 2px; outline-style: dotted; outline-color: blue;': 'outline: blue dotted 2px;',
3838
'margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px;': 'margin: 1px 2px 3px 4px;',
39-
'list-style-type: circle; list-style-position: inside; list-style-image: initial;': 'list-style: circle inside;',
39+
'list-style-type: circle; list-style-position: inside; list-style-image: initial;': 'list-style: inside circle;',
4040
'list-style-type: lower-alpha;': 'list-style-type: lower-alpha;',
4141
'font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;': 'font-family: sans-serif; line-height: 2em; font-size: 3em; font-style: italic; font-weight: bold;',
4242
'padding-top: 1px; padding-right: 2px; padding-bottom: 3px; padding-left: 4px;': 'padding: 1px 2px 3px 4px;'

0 commit comments

Comments
 (0)