diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule')
90 files changed, 2569 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom-ref.html new file mode 100644 index 0000000000..ee40f94bda --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom-ref.html @@ -0,0 +1,6 @@ +<!DOCTYPE html> +<ol> + <div>A.</div> + <div>B.</div> + <div>C.</div> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom.html new file mode 100644 index 0000000000..94ec03722b --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/access-from-shadow-dom.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<title>Counter styles defined in the document tree scope should be globally accessible</title> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<link rel="match" href="access-from-shadow-dom-ref.html"> + +<style> +@counter-style foo { + system: fixed; + symbols: A B C; +} +</style> + +<div id="host"></div> + +<script> +document.getElementById("host").attachShadow({mode: 'open'}).innerHTML = ` +<ol style="list-style-type: foo; list-style-position: inside"> + <li></li> + <li></li> + <li></li> +</ol> +` +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/additive-symbols-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/additive-symbols-syntax.html new file mode 100644 index 0000000000..b1c4a0e8be --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/additive-symbols-syntax.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-symbols"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_additive_symbols(value, expected) { + test_valid_counter_style_descriptor('additive-symbols', value, expected); +} + +function test_invalid_additive_symbols(value) { + test_invalid_counter_style_descriptor('additive-symbols', value); +} + +// [ <integer [0,∞]> && <symbol> ]# + +test_valid_additive_symbols('0 "X"'); +test_valid_additive_symbols('1 "X"'); +test_valid_additive_symbols('"X" 1', '1 "X"'); +test_valid_additive_symbols('5 "V", 1 "I"'); + +test_invalid_additive_symbols(''); + +// Weights must be non-negative +test_invalid_additive_symbols('-1 "X"'); + +// Weights must be in strictly decreasing order +test_invalid_additive_symbols('1 "I", 5 "V"'); +test_invalid_additive_symbols('1 "X", 1 "Y"'); +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols-ref.html new file mode 100644 index 0000000000..0247f65d3e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols-ref.html @@ -0,0 +1,3 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<ol><li>Should have "1." as bullet point.</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols.html new file mode 100644 index 0000000000..eea52a75b4 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/broken-symbols.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: invalid counter-style symbols</title> +<link rel="author" title="Anthony Ramine" href="mailto:n.oxyde@gmail.com"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#typedef-symbol"> +<link rel="match" href="broken-symbols-ref.html"> +<style type="text/css"> + @counter-style a { + system: alphabetic; + symbols: ⓐ inherit; + } +</style> +<ol style="list-style-type: a"><li>Should have "1." as bullet point.</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin-ref.html new file mode 100644 index 0000000000..a558ce29e6 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>一千、</div> +<div>一千零一、</div> +<div>一千零二、</div> +<div>一千零三、</div> +<div>一千零四、</div> +<div>一〇〇五、</div> +<div>一〇〇六、</div> +<div>一〇〇七、</div> +<div>一〇〇八、</div> +<div>一〇〇九、</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin.html new file mode 100644 index 0000000000..553dd72dca --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/dependent-builtin.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: dependent builtin</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#extends-system"> +<link rel="match" href="dependent-builtin-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends simp-chinese-informal; + range: 1000 1004; + } +</style> +<ol start="1000" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid-ref.html new file mode 100644 index 0000000000..4b1c78b204 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>00. </div> +<div>A. </div> +<div>B. </div> +<div>C. </div> +<div>D. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid.html new file mode 100644 index 0000000000..e19d9d649a --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-invalid.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor fallback, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-fallback"> +<link rel="match" href="descriptor-fallback-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends upper-alpha; + fallback: decimal-leading-zero; + fallback: decimal cjk-decimal; + fallback: "*"; + } +</style> +<ol start="0" style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-ref.html new file mode 100644 index 0000000000..1dc3f4561c --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback-ref.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>d. </div> +<div>e. </div> +<div>f. </div> +<div>7. </div> +<div>8. </div> +<div>9. </div> +<!-- list-style-type: b --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>d. </div> +<div>e. </div> +<div>f. </div> +<div>7. </div> +<div>8. </div> +<div>9. </div> +<!-- list-style-type: c --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>d. </div> +<div>e. </div> +<div>f. </div> +<div>g. </div> +<div>h. </div> +<div>i. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback.html new file mode 100644 index 0000000000..7cbfb88592 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-fallback.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor fallback</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-fallback"> +<link rel="match" href="descriptor-fallback-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: fixed; + symbols: a b c; + fallback: b; + } + @counter-style b { + system: fixed 4; + symbols: d e f; + fallback: a; + } + @counter-style c { + system: fixed 7; + symbols: g h i; + fallback: a; + } +</style> +<ol style="list-style-type: a"> + <li><li><li> + <li><li><li> + <li><li><li> +</ol> +<ol style="list-style-type: b"> + <li><li><li> + <li><li><li> + <li><li><li> +</ol> +<ol style="list-style-type: c"> + <li><li><li> + <li><li><li> + <li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid-ref.html new file mode 100644 index 0000000000..a14d7b40be --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>!2. </div> +<div>!1. </div> +<div>0. </div> +<div>1. </div> +<div>2. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid.html new file mode 100644 index 0000000000..f7376ea5dd --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor negative, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-negative"> +<link rel="match" href="descriptor-negative-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + negative: '!'; + negative: 0; + negative: ~; + negative: '(' 'x' ')'; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-ref.html new file mode 100644 index 0000000000..9216a87fc7 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>⁻2. </div> +<div>⁻1. </div> +<div>0. </div> +<div>1. </div> +<div>2. </div> +<!-- list-style-type: b --> +<div>(2). </div> +<div>(1). </div> +<div>0. </div> +<div>1. </div> +<div>2. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative.html new file mode 100644 index 0000000000..cf06bc4c7c --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-negative.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor negative</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-negative"> +<link rel="match" href="descriptor-negative-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + negative: \207B; + } + @counter-style b { + system: extends decimal; + negative: '(' ')'; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid-ref.html new file mode 100644 index 0000000000..1da956e3d5 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>001. </div> +<div>002. </div> +<div>003. </div> +<div>004. </div> +<div>005. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid.html new file mode 100644 index 0000000000..4145eb7889 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor pad, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-pad"> +<link rel="match" href="descriptor-pad-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + pad: 3 "0"; + pad: -1 "X"; + pad: "#"; + pad: 2 0; + } +</style> +<ol style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-ref.html new file mode 100644 index 0000000000..444368a61a --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>-III. </div> +<div>-II. </div> +<div>-*I. </div> +<div>0. </div> +<div>**I. </div> +<div>*II. </div> +<div>III. </div> +<div>*IV. </div> +<div>**V. </div> +<div>6. </div> +<!-- list-style-type: b --> +<div>(2). </div> +<div>(1). </div> +<div>000. </div> +<div>001. </div> +<div>002. </div> +<!-- list-style-type: c --> +<div>ooā</div> +<div>ooá</div> +<div>oāá</div> +<div>oǎà</div> +<div>āáǎ</div> +<div>àāá</div> +<!-- list-style-type: d --> +<div>001. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad.html new file mode 100644 index 0000000000..220e36b787 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-pad.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor pad</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-pad"> +<link rel="match" href="descriptor-pad-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends upper-roman; + range: infinite 5; + pad: 3 '*'; + } + @counter-style b { + system: extends decimal; + negative: '(' ')'; + pad: 3 '0'; + } + @counter-style c { + system: alphabetic; + symbols: a\0304 a\0301 a\030c a\0300; + pad: 3 o; + suffix: ''; + } + @counter-style d { + system: extends decimal; + pad: '0' 3; + } +</style> +<ol start="-3" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> +</ol> +<ol style="list-style-type: c"> + <li><li> + <li value="6"><li value="16"> + <li value="27"><li value="70"> +</ol> +<ol style="list-style-type: d"> + <li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid-ref.html new file mode 100644 index 0000000000..4d5b82e7c3 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>#-2. </div> +<div>#-1. </div> +<div>#0. </div> +<div>#1. </div> +<div>#2. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid.html new file mode 100644 index 0000000000..33aa5452ac --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor prefix, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-prefix"> +<link rel="match" href="descriptor-prefix-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + prefix: "#"; + prefix: *; + prefix: 0; + prefix: '$' '$'; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-ref.html new file mode 100644 index 0000000000..aa32f53639 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- ol --> +<div>Appendix -2. </div> +<div>Appendix -1. </div> +<div>Appendix 0. </div> +<div>Appendix I. </div> +<div>Appendix II. </div> +<!-- section --> +<p>-2</p> +<p>-1</p> +<p>0</p> +<p>I</p> +<p>II</p> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix.html new file mode 100644 index 0000000000..ecf18420aa --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-prefix.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor prefix</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-prefix"> +<link rel="match" href="descriptor-prefix-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends upper-roman; + prefix: "Appendix "; + } + section { + counter-reset: p -3; + } + p { + counter-increment: p; + } + p::before { + content: counter(p, a); + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> +<section> + <p><p><p><p><p> +</section> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid-ref.html new file mode 100644 index 0000000000..88922a293f --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>a. </div> +<div>b. </div> +<div>3. </div> +<div>4. </div> +<div>5. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid.html new file mode 100644 index 0000000000..2f55ef074b --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor range, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-range"> +<link rel="match" href="descriptor-range-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends lower-alpha; + range: 1 2; + range: 1; + range: 3 1; + range: xx yy; + } +</style> +<ol style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-ref.html new file mode 100644 index 0000000000..8b35eea997 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>-III. </div> +<div>-2. </div> +<div>-I. </div> +<div>0. </div> +<div>I. </div> +<div>II. </div> +<div>3. </div> +<div>IV. </div> +<div>5. </div> +<div>6. </div> +<div>VII. </div> +<div>VIII. </div> +<div>IX. </div> +<div>10. </div> +<div>XI. </div> +<div>MMMCMXCIX. </div> +<div>MMMM. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range.html new file mode 100644 index 0000000000..699c985431 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-range.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor range</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-range"> +<link rel="match" href="descriptor-range-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends upper-roman; + range: infinite -3, -1 2, 4 4, 7 9, 11 infinite; + } +</style> +<ol start="-3" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> + <li><li><li><li><li> + <li value="3999"><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid-ref.html new file mode 100644 index 0000000000..e350778122 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>-2,</div> +<div>-1,</div> +<div>0,</div> +<div>1,</div> +<div>2,</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid.html new file mode 100644 index 0000000000..f62181bf9c --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor suffix, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-suffix"> +<link rel="match" href="descriptor-suffix-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + suffix: ','; + suffix: *; + suffix: 0; + suffix: '$' '$'; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-ref.html new file mode 100644 index 0000000000..ccbb7bdd69 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<style type="text/css"> + div { + padding: 0; margin: 0; + line-height: 150%; + } +</style> +<!-- list-style-type: a --> +<div>-2,-2</div> +<div>-1,-1</div> +<div>0,0</div> +<div>1,1</div> +<div>2,2</div> +<!-- list-style-type: b --> +<div>-2、-2</div> +<div>-1、-1</div> +<div>0、0</div> +<div>1、1</div> +<div>2、2</div> +<!-- section --> +<div>-2</div> +<div>-1</div> +<div>0</div> +<div>1</div> +<div>2</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix.html new file mode 100644 index 0000000000..c558d6b30d --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-suffix.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor suffix</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-suffix"> +<link rel="match" href="descriptor-suffix-ref.html"> +<style type="text/css"> + @counter-style a { + system: extends decimal; + suffix: ","; + } + @counter-style b { + system: extends decimal; + suffix: \3001; + } + ol { + list-style-position: inside; + } + ol, section, p { + padding: 0; margin: 0; + line-height: 150%; + } + section { + counter-reset: p -3; + } + p { + counter-increment: p; + } + p::before { + content: counter(p, a); + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>-2<li>-1<li>0<li>1<li>2 +</ol> +<ol start="-2" style="list-style-type: b"> + <li>-2<li>-1<li>0<li>1<li>2 +</ol> +<section> + <p><p><p><p><p> +</section> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid-ref.html new file mode 100644 index 0000000000..50e1ee8468 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>4. </div> +<div>5. </div> +<!-- list-style-type: b --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>ca. </div> +<div>cb. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid.html new file mode 100644 index 0000000000..a0d0e3560b --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-invalid.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor symbols, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-symbols"> +<link rel="match" href="descriptor-symbols-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: fixed; + symbols: a b c; + symbols: 0 1 2; + } + @counter-style b { + system: additive; + additive-symbols: 3 c, 2 b, 1 a; + additive-symbols: 1 x, 2 y, 3 z; + additive-symbols: x, y, z; + additive-symbols: 1, 2, 3; + } +</style> +<ol style="list-style-type: a"> + <li><li><li><li><li> +</ol> +<ol style="list-style-type: b"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-ref.html new file mode 100644 index 0000000000..e353cc9536 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<!-- list-style-type: b --> +<div>a. </div> +<div>b. </div> +<div>c. </div> +<div>d. </div> +<div>e. </div> +<div>f. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols.html new file mode 100644 index 0000000000..15568f08e4 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/descriptor-symbols.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: descriptor symbols</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-symbols"> +<link rel="match" href="descriptor-symbols-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: fixed; + symbols: a "b" \63; + } + @counter-style b { + system: additive; + additive-symbols: \66 6, 'e' 5, d 4, 3 \63, 2 "b", 1 a; + } +</style> +<ol style="list-style-type: a"> + <li><li><li> +</ol> +<ol style="list-style-type: b"> + <li><li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles-ref.html new file mode 100644 index 0000000000..a1dafa7560 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles-ref.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<style type="text/css"> + @counter-style disclosure-closed2-ltr { + system: cyclic; + symbols: \25b8; + suffix: ' '; + } + @counter-style disclosure-closed2-rtl { + system: cyclic; + symbols: \25c2; + suffix: ' '; + } + @counter-style disclosure-open2 { + system: cyclic; + symbols: \25be; + suffix: ' '; + } + .open { list-style-type: disclosure-open2; } + .closed:dir(ltr) { list-style-type: disclosure-closed2-ltr; } + .closed:dir(rtl) { list-style-type: disclosure-closed2-rtl; } + ul { + padding: 0; + list-style-position: inside; + } +</style> +<ul dir="ltr"> + <li class="closed">closed ltr + <li class="open">open ltr +</ul> +<ul dir="rtl"> + <li class="closed">closed rtl + <li class="open">open rtl +</ul> +<p dir="ltr">▸ closed ltr +<p dir="rtl">◂ closed rtl diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles.html new file mode 100644 index 0000000000..79ac6ca145 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/disclosure-styles.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: disclosure styles</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#disclosure-open"> +<link rel="match" href="disclosure-styles-ref.html"> +<style type="text/css"> + @counter-style disclosure-closed2 { + system: extends disclosure-closed; + } + @counter-style disclosure-open2 { + system: extends disclosure-open; + } + ul { + padding: 0; + list-style-position: inside; + } + .closed { list-style-type: disclosure-closed2; } + .open { list-style-type: disclosure-open2; } + p::before { + content: counter(a, disclosure-closed) " "; + } +</style> +<ul dir="ltr"> + <li class="closed">closed ltr + <li class="open">open ltr +</ul> +<ul dir="rtl"> + <li class="closed">closed rtl + <li class="open">open rtl +</ul> +<p dir="ltr">closed ltr +<p dir="rtl">closed rtl diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallback.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallback.html new file mode 100644 index 0000000000..5c844fbccf --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallback.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-fallback"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_fallback(value) { + test_valid_counter_style_descriptor('fallback', value); +} + +function test_invalid_fallback(value) { + test_invalid_counter_style_descriptor('fallback', value); +} + +// <counter-style-name> + +test_valid_fallback('bar'); + +// Counter style names are custom identifiers, not strings +test_invalid_fallback('"bar"'); + +// The following are not valid counter style names +test_invalid_fallback('none'); +test_invalid_fallback('initial'); +test_invalid_fallback('inherit'); +test_invalid_fallback('unset'); + +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom-ref.html new file mode 100644 index 0000000000..53e467bb39 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> + +<ol> + <div>This list style should fallback to 'foo' in the parent tree scope</div> + <div>A.</div> + <div>B.</div> + <div>C.</div> +</ol> + +<ol> + <div>This list style should fallback to 'foo' in the shadow tree scope</div> + <div>X.</div> + <div>Y.</div> + <div>Z.</div> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom.html new file mode 100644 index 0000000000..d51f70bc31 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/fallbacks-in-shadow-dom.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<title>Counter style references are tree-scoped, the same name may dereference to different rules</title> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<link rel="match" href="fallbacks-in-shadow-dom-ref.html"> + +<style> +@counter-style foo { + system: cyclic; + symbols: A B C; +} + +@counter-style bar { + system: fixed 4; + symbols: D E F; + fallback: foo; +} +</style> + +<div id="host"> +</div> + +<script> +document.getElementById("host").attachShadow({mode: 'open'}).innerHTML = ` +<style> +@counter-style foo { + system: cyclic; + symbols: X Y Z; +} + +@counter-style baz { + system: fixed 4; + symbols: G H I; + fallback: foo; +} +</style> + +<ol style="list-style-type: bar; list-style-position: inside"> + <div>This list style should fallback to 'foo' in the parent tree scope</div> + <li></li> + <li></li> + <li></li> +</ol> + +<ol style="list-style-type: baz; list-style-position: inside"> + <div>This list style should fallback to 'foo' in the shadow tree scope</div> + <li></li> + <li></li> + <li></li> +</ol> +` +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity-ref.html new file mode 100644 index 0000000000..96a848a792 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity-ref.html @@ -0,0 +1,77 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<style type="text/css"> + ol, div, p { + padding: 0; margin: 0; + line-height: 150%; + } + ol { + list-style-position: inside; + } + li, div, p { + float: left; + } + @counter-style decimal-leading-zero { + system: extends decimal; + pad: 3 '0'; + } + @counter-style custom-style { + system: cyclic; + symbols: \2023; + } +</style> + +<!-- list-style --> +<ol><li style="list-style: hiragana inside;"></li></ol> +<ol><li style="list-style: decimal-leading-zero inside;"></li></ol> +<ol><li style="list-style: custom-style inside;"></li></ol> +<ol><li style="list-style: decimal inside;"></li></ol> + +<!-- list-style-type --> +<ol><li style="list-style-type: hiragana;"></li></ol> +<ol><li style="list-style-type: decimal-leading-zero;"></li></ol> +<ol><li style="list-style-type: custom-style;"></li></ol> +<ol><li style="list-style-type: decimal;"></li></ol> + +<!-- counter() --> +<style type="text/css"> + #counter { counter-reset: a 1; } + #counter-a::before { content: counter(a, hiragana); } + #counter-b::before { content: counter(a, decimal-leading-zero); } + #counter-c::before { content: counter(a, custom-style); } + #counter-d::before { content: counter(a, decimal); } +</style> +<div id="counter"> + <p id="counter-a"></p> + <p id="counter-b"></p> + <p id="counter-c"></p> + <p id="counter-d"></p> +</div> + +<!-- counters() --> +<style type="text/css"> + #counters { counter-reset: a 1; } + #counters-a::before { content: counters(a, '', hiragana); } + #counters-b::before { content: counters(a, '', decimal-leading-zero); } + #counters-c::before { content: counters(a, '', custom-style); } + #counters-d::before { content: counters(a, '', decimal); } +</style> +<div id="counters"> + <p id="counters-a"></p> + <p id="counters-b"></p> + <p id="counters-c"></p> + <p id="counters-d"></p> +</div> + +<style type="text/css"> + @counter-style a { system: extends hiragana; } + @counter-style b { system: extends decimal-leading-zero; } + @counter-style c { system: extends custom-style; } + @counter-style d { system: extends decimal; } +</style> +<ol><li style="list-style-type: a;"></li></ol> +<ol><li style="list-style-type: b;"></li></ol> +<ol><li style="list-style-type: c;"></li></ol> +<ol><li style="list-style-type: d;"></li></ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity.html new file mode 100644 index 0000000000..1e478bf17e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-case-sensitivity.html @@ -0,0 +1,79 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: name case sensitivity</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#typedef-counter-style-name"> +<link rel="match" href="name-case-sensitivity-ref.html"> +<style type="text/css"> + ol, div, p { + padding: 0; margin: 0; + line-height: 150%; + } + ol { + list-style-position: inside; + } + li, div, p { + float: left; + } + @counter-style decimal-leading-zero { + system: extends decimal; + pad: 3 '0'; + } + @counter-style custom-style { + system: cyclic; + symbols: \2023; + } +</style> + +<!-- list-style --> +<ol><li style="list-style: Hiragana inside;"></li></ol> +<ol><li style="list-style: Decimal-Leading-Zero inside;"></li></ol> +<ol><li style="list-style: custom-style inside;"></li></ol> +<ol><li style="list-style: Custom-Style inside;"></li></ol> + +<!-- list-style-type --> +<ol><li style="list-style-type: Hiragana;"></li></ol> +<ol><li style="list-style-type: Decimal-Leading-Zero;"></li></ol> +<ol><li style="list-style-type: custom-style;"></li></ol> +<ol><li style="list-style-type: Custom-Style;"></li></ol> + +<!-- counter() --> +<style type="text/css"> + #counter { counter-reset: a 1; } + #counter-a::before { content: counter(a, Hiragana); } + #counter-b::before { content: counter(a, Decimal-leading-Zero); } + #counter-c::before { content: counter(a, custom-style); } + #counter-d::before { content: counter(a, Custom-Style); } +</style> +<div id="counter"> + <p id="counter-a"></p> + <p id="counter-b"></p> + <p id="counter-c"></p> + <p id="counter-d"></p> +</div> + +<!-- counters() --> +<style type="text/css"> + #counters { counter-reset: a 1; } + #counters-a::before { content: counters(a, '', Hiragana); } + #counters-b::before { content: counters(a, '', Decimal-leading-Zero); } + #counters-c::before { content: counters(a, '', custom-style); } + #counters-d::before { content: counters(a, '', Custom-Style); } +</style> +<div id="counters"> + <p id="counters-a"></p> + <p id="counters-b"></p> + <p id="counters-c"></p> + <p id="counters-d"></p> +</div> + +<style type="text/css"> + @counter-style a { system: extends HiRaGaNa; } + @counter-style b { system: extends Decimal-leading-ZERO; } + @counter-style c { system: extends custom-style; } + @counter-style d { system: extends Custom-Style; } +</style> +<ol><li style="list-style-type: a;"></li></ol> +<ol><li style="list-style-type: b;"></li></ol> +<ol><li style="list-style-type: c;"></li></ol> +<ol><li style="list-style-type: d;"></li></ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-syntax.html new file mode 100644 index 0000000000..73d3f968c1 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/name-syntax.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +test_valid_name('foo'); +test_valid_name('decimal-leading-zero'); +test_valid_name('lower-alpha'); +test_valid_name('cjk-decimal'); +test_valid_name('japanese-informal'); +test_valid_name('ethiopic-numeric'); + +test_invalid_name(''); +test_invalid_name('none'); +test_invalid_name('initial'); +test_invalid_name('inherit'); +test_invalid_name('unset'); + +test_invalid_name('decimal'); +test_invalid_name('disc'); +test_invalid_name('square'); +test_invalid_name('circle'); +test_invalid_name('disclosure-open'); +test_invalid_name('disclosure-closed'); +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/negative-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/negative-syntax.html new file mode 100644 index 0000000000..5314201e5d --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/negative-syntax.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-negative"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_negative(value) { + test_valid_counter_style_descriptor('negative', value); +} + +function test_invalid_negative(value) { + test_invalid_counter_style_descriptor('negative', value); +} + +// <symbol> <symbol>? + +test_valid_negative('"X"'); +test_valid_negative('"X" "X"'); +test_invalid_negative('"X" "X" "X"'); + +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom-ref.html new file mode 100644 index 0000000000..aa398f73a7 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> + +<ol> + <div>A.</div> + <div>B.</div> + <div>C.</div> +</ol> + +<ol> + <div>D.</div> + <div>E.</div> + <div>F.</div> +</ol> + +<ol> + <div>G.</div> + <div>H.</div> + <div>I.</div> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom.html new file mode 100644 index 0000000000..62064eb6fe --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/override-in-shadow-dom.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<title>Counter style rules in shadow DOM can override rules in ancestor scopes</title> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<link rel="match" href="override-in-shadow-dom-ref.html"> + +<style> +@counter-style foo { + system: fixed; + symbols: A B C; +} +</style> + +<ol style="list-style-type: foo; list-style-position: inside"> + <li></li> + <li></li> + <li></li> +</ol> + +<div id="host1"></div> +<div id="host2"></div> + +<script> +document.getElementById("host1").attachShadow({mode: 'open'}).innerHTML = ` +<style> +@counter-style foo { + system: fixed; + symbols: D E F; +} +</style> +<ol style="list-style-type: foo; list-style-position: inside"> + <li></li> + <li></li> + <li></li> +</ol> +`; + +document.getElementById("host2").attachShadow({mode: 'open'}).innerHTML = ` +<style> +@counter-style foo { + system: fixed; + symbols: G H I; +} +</style> +<ol style="list-style-type: foo; list-style-position: inside"> + <li></li> + <li></li> + <li></li> +</ol> +`; +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/pad-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/pad-syntax.html new file mode 100644 index 0000000000..f82dd9d738 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/pad-syntax.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-pad"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_pad(value, expected) { + test_valid_counter_style_descriptor('pad', value, expected); +} + +function test_invalid_pad(value) { + test_invalid_counter_style_descriptor('pad', value); +} + +// <integer [0,∞]> && <symbol> + +test_invalid_pad('10'); +test_invalid_pad('"X"'); +test_valid_pad('0 "X"'); +test_valid_pad('10 "X"'); +test_valid_pad('"X" 10', '10 "X"'); +test_invalid_pad('-1 "X"'); +test_invalid_pad('"X" -1'); +test_invalid_pad('10 "X" "Y"'); +test_invalid_pad('10 10 "X"'); + +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/prefix-suffix-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/prefix-suffix-syntax.html new file mode 100644 index 0000000000..4f53b9afe6 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/prefix-suffix-syntax.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-prefix"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-suffix"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_prefix_suffix(value, expected) { + test_valid_counter_style_descriptor('prefix', value, expected); + test_valid_counter_style_descriptor('suffix', value, expected); +} + +function test_invalid_prefix_suffix(value) { + test_invalid_counter_style_descriptor('prefix', value); + test_invalid_counter_style_descriptor('suffix', value); +} + +// <symbol> +// <symbol> = <string> | <image> | <custom-ident> + +// string values +test_valid_prefix_suffix('"string"'); +test_valid_prefix_suffix('"initial"'); +test_valid_prefix_suffix('"inherit"'); +test_valid_prefix_suffix('"unset"'); + +// custom-ident values +test_valid_prefix_suffix('custom-ident') +test_invalid_prefix_suffix('initial'); +test_invalid_prefix_suffix('inherit'); +test_invalid_prefix_suffix('unset'); + +// image values +test_valid_prefix_suffix('url("https://example.com/foo.png")'); +test_valid_prefix_suffix('url(https://example.com/foo.png)', 'url("https://example.com/foo.png")'); +test_valid_prefix_suffix('linear-gradient(yellow, blue)'); + +// Must be exactly one symbol +test_invalid_prefix_suffix(''); +test_invalid_prefix_suffix('foo bar'); + +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/range-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/range-syntax.html new file mode 100644 index 0000000000..26cea66a0e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/range-syntax.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-range"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_range(value) { + test_valid_counter_style_descriptor('range', value); +} + +function test_invalid_range(value) { + test_invalid_counter_style_descriptor('range', value); +} + +// [ <integer> | infinite ]{2} ]# | auto + +test_valid_range('auto'); + +test_valid_range('infinite infinite'); +test_valid_range('infinite 0'); +test_valid_range('0 infinite'); + +test_valid_range('infinite 0, 5 10, 100 infinite'); +test_valid_range('infinite 10, 5 20, 15 infinite'); + +test_invalid_range(''); +test_invalid_range('0 -1'); +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping-ref.html new file mode 100644 index 0000000000..385efdf018 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + .circle { list-style-type: circle; } + .square { list-style-type: square; } + .hiragana { list-style-type: hiragana; } + .katakana { list-style-type: katakana; } + .hiragana-iroha { list-style-type: hiragana-iroha; } + .katakana-iroha { list-style-type: katakana-iroha; } + ::marker { font-family: inherit; } +</style> +<ul class="circle"><li></ul> +<ul class="square"><li></ul> + +<ol><li></ol> +<ol class="hiragana"><li></ol> +<ol class="katakana"><li></ol> +<ol class="hiragana-iroha"><li></ol> +<ol class="katakana-iroha"><li></ol> + +<ul> + <li class="circle"> + <li class="square"> + <li class="hiragana"> + <li class="katakana"> + <li class="hiragana-iroha"> + <li class="katakana-iroha"> +</ul> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping.html new file mode 100644 index 0000000000..1656f9f33e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-attr-mapping.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: redefine attr mapping</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="match" href="redefine-attr-mapping-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style triangle { + system: cyclic; + symbols: \2023; + suffix: ""; + } + @counter-style circle { + system: extends triangle; + } + @counter-style square { + system: extends triangle; + } + @counter-style lower-roman { + system: extends hiragana; + } + @counter-style upper-roman { + system: extends katakana; + } + @counter-style lower-alpha { + system: extends hiragana-iroha; + } + @counter-style upper-alpha { + system: extends katakana-iroha; + } + ::marker { font-family: inherit; } +</style> +<ul type="circle"><li></ul> +<ul type="square"><li></ul> + +<ol><li></ol> +<ol type="i"><li></ol> +<ol type="I"><li></ol> +<ol type="a"><li></ol> +<ol type="A"><li></ol> + +<ul> + <li type="circle"> + <li type="square"> + <li type="i"> + <li type="I"> + <li type="a"> + <li type="A"> +</ul> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin-ref.html new file mode 100644 index 0000000000..1d32dacacf --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin-ref.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<ol> + <li style="list-style-type: none">foo + <li style="list-style-type: decimal">bar + <li style="list-style-type: disc">baz + <li style="list-style-type: cjk-decimal"> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin.html new file mode 100644 index 0000000000..af90fcab8c --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/redefine-builtin.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: redefine builtin</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="match" href="redefine-builtin-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style none { + system: extends lower-roman; + } + @counter-style decimal { + system: extends upper-roman; + } + @counter-style disc { + system: extends decimal; + } + @counter-style hebrew { + system: extends cjk-decimal; + } +</style> +<ol> + <li style="list-style-type: none">foo + <li style="list-style-type: decimal">bar + <li style="list-style-type: disc">baz + <li style="list-style-type: hebrew"> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part-ref.html new file mode 100644 index 0000000000..7f1af75320 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE html> + +<ol> + <div>A.</div> + <div>B.</div> + <div>C.</div> +</ol> + diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part.html new file mode 100644 index 0000000000..cc43eee8ef --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/shadow-dom-part.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<title>Counter style tree-scoped references</title> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#the-counter-style-rule"> +<link rel="help" href="https://drafts.csswg.org/css-scoping/#shadow-names"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<link rel="match" href="shadow-dom-part-ref.html"> +<meta name="assert" content="The list in the shadow tree should use the counter style defined in the outer document, because it's styled by the outer document"> + +<style> +@counter-style foo { + system: fixed; + symbols: A B C; +} +#host::part(list) { + list-style-type: foo; +} +</style> + +<div id="host"></div> + +<script> +document.getElementById("host").attachShadow({mode: 'open'}).innerHTML = ` +<style> +@counter-style foo { + system: fixed; + symbols: D E F; +} +</style> +<ol part="list" style="list-style-position: inside"> + <li></li> + <li></li> + <li></li> +</ol> +`; +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-manual.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-manual.html new file mode 100644 index 0000000000..50f35ec142 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-manual.html @@ -0,0 +1,186 @@ +<!doctype html> +<title>CSS counter style accessibility test</title> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles/#counter-style-speak-as"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<p> + This is a manual test. To run the tests, open the browser's developer tools + and navigate to the Accessibility pane (may need to activate it in Settings), + or use an OS-level accessibility inspector, and verify that the accessible + name of the list markers matches the text in the list items (excluding + quotation marks). + + <br><br> + + The following issue discusses ways to automate these tests: + + <br><br> + + https://github.com/web-platform-tests/wpt/issues/8355 +</p> +<style> + @counter-style base { + system: cyclic; + symbols: 'One' 'Two' 'Three'; + suffix: '. '; + } + + @counter-style explicit-bullets { + system: extends base; + speak-as: bullets; + } + @counter-style explicit-numbers { + system: extends base; + speak-as: numbers; + } + @counter-style explicit-words { + system: extends base; + speak-as: words; + } + + @counter-style auto-alphabetic { + system: alphabetic; + symbols: 'One' 'Two' 'Three'; + suffix: '. '; + speak-as: auto; + } + @counter-style auto-cyclic { + system: cyclic; + symbols: 'One' 'Two' 'Three'; + suffix: '. '; + speak-as: auto; + } + @counter-style auto-extends { + system: extends base; + speak-as: auto; + } + @counter-style auto-fixed { + system: fixed; + symbols: 'One' 'Two' 'Three'; + suffix: '. '; + speak-as: auto; + } + @counter-style auto-symbolic { + system: symbolic; + symbols: 'One' 'Two' 'Three'; + suffix: '. '; + speak-as: auto; + } + @counter-style auto-numeric { + system: numeric; + symbols: 'Zero' 'One' 'Two' 'Three'; + suffix: '. '; + speak-as: auto; + } + @counter-style auto-additive { + system: additive; + additive-symbols: 3 'Three', 2 'Two', 1 'One'; + suffix: '. '; + speak-as: auto; + } + + @counter-style reference-bullets { + system: fixed; + symbols: 'Yi' 'Er' 'San'; + suffix: '> '; + speak-as: explicit-bullets; + } + @counter-style reference-numbers { + system: fixed; + symbols: 'Yi' 'Er' 'San'; + suffix: '> '; + speak-as: explicit-numbers; + } + @counter-style reference-words { + system: fixed; + symbols: 'Yi' 'Er' 'San'; + suffix: '> '; + speak-as: explicit-words; + } + +</style> +<body> + <ul style="list-style-type: disc"> + <li>"• "</li> + </ul> + <ul style="list-style-type: circle"> + <li>"◦ "</li> + </ul> + <ul style="list-style-type: square"> + <li>"◾ "</li> + </ul> + <ul style="list-style-type: disclosure-open"> + <li>"▾ "</li> + </ul> + <ul style="list-style-type: disclosure-closed"> + <li>"▸ "</li> + </ul> + + <ul style="list-style-type: explicit-bullets"> + <li>"• "</li> + <li>"• "</li> + <li>"• "</li> + </ul> + <ul style="list-style-type: explicit-numbers"> + <li>"1. "</li> + <li>"2. "</li> + <li>"3. "</li> + </ul> + <ul style="list-style-type: explicit-words"> + <li>"One. "</li> + <li>"Two. "</li> + <li>"Three. "</li> + </ul> + + <ul style="list-style-type: auto-alphabetic"> + <li>"One. "</li> + <li>"Two. "</li> + <li>"Three. "</li> + </ul> + <ul style="list-style-type: auto-cyclic"> + <li>"• "</li> + <li>"• "</li> + <li>"• "</li> + </ul> + <ul style="list-style-type: auto-extends"> + <li>"• "</li> + <li>"• "</li> + <li>"• "</li> + </ul> + <ul style="list-style-type: auto-fixed"> + <li>"1. "</li> + <li>"2. "</li> + <li>"3. "</li> + </ul> + <ul style="list-style-type: auto-symbolic"> + <li>"1. "</li> + <li>"2. "</li> + <li>"3. "</li> + </ul> + <ul style="list-style-type: auto-numeric"> + <li>"1. "</li> + <li>"2. "</li> + <li>"3. "</li> + </ul> + <ul style="list-style-type: auto-additive"> + <li>"1. "</li> + <li>"2. "</li> + <li>"3. "</li> + </ul> + + <ul style="list-style-type: reference-bullets"> + <li>"• "</li> + <li>"• "</li> + <li>"• "</li> + </ul> + <ul style="list-style-type: reference-numbers"> + <li>"1> "</li> + <li>"2> "</li> + <li>"3> "</li> + </ul> + <ul style="list-style-type: reference-words"> + <li>"One> "</li> + <li>"Two> "</li> + <li>"Three> "</li> + </ul> + +</body> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-syntax.html new file mode 100644 index 0000000000..f67896633f --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/speak-as-syntax.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-speak_as"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_speak_as(value) { + test_valid_counter_style_descriptor('speak-as', value); +} + +function test_invalid_speak_as(value) { + test_invalid_counter_style_descriptor('speak-as', value); +} + +// auto | bullets | numbers | words | spell-out | <counter-style-name> + +test_valid_speak_as('auto'); +test_valid_speak_as('bullets'); +test_valid_speak_as('numbers'); +test_valid_speak_as('words'); +test_valid_speak_as('spell-out'); + +test_valid_speak_as('bar'); +test_valid_speak_as('spellout'); // 'spellout' is a valid counter style name + +test_invalid_speak_as('bullets numbers'); + +// The following are not valid counter style names +test_invalid_speak_as('none'); +test_invalid_speak_as('initial'); +test_invalid_speak_as('inherit'); +test_invalid_speak_as('unset'); + +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/counter-style-testcommon.js b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/counter-style-testcommon.js new file mode 100644 index 0000000000..a3615e92ff --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/counter-style-testcommon.js @@ -0,0 +1,83 @@ +function test_counter_style_descriptor(descriptor, value, expected) { + let descriptors = []; + descriptors.push(`${descriptor}: ${value}`); + + // Fill out the remaining necessary descriptors + if (descriptor === 'system') { + if (value === 'additive') + descriptors.push('additive-symbols: 1 "I"'); + else if (!value.startsWith('extends')) + descriptors.push('symbols: "X" "Y"'); + } else if (descriptor === 'symbols') { + descriptors.push('system: symbolic'); + } else if (descriptor === 'additive-symbols') { + descriptors.push('system: additive'); + } else { + descriptors.push('system: symbolic'); + descriptors.push('symbols: "X" "Y"'); + } + + let style = document.createElement('style'); + style.textContent = `@counter-style foo { ${descriptors.join(';')} }`; + document.head.appendChild(style); + + test(() => { + let rule = style.sheet.cssRules[0]; + // TODO: The spec is inconsistent on when the entire rule is invalid + // (and hence absent from OM), and when only the descriptor is invalid. + // Revise when spec issue is resolved. + // See https://github.com/w3c/csswg-drafts/issues/5717 + if (!rule) { + assert_equals(expected, undefined); + return; + } + + assert_equals(rule.constructor.name, 'CSSCounterStyleRule'); + + let text = rule.cssText; + if (expected) + assert_not_equals(text.indexOf(`${descriptor}: ${expected}`), -1); + else + assert_equals(text.indexOf(`${descriptor}:`), -1); + }, `@counter-style '${descriptor}: ${value}' is ${expected ? 'valid' : 'invalid'}`); + + style.remove(); +} + +function test_valid_counter_style_descriptor(descriptor, value, expected) { + expected = expected || value; + test_counter_style_descriptor(descriptor, value, expected); +} + +function test_invalid_counter_style_descriptor(descriptor, value) { + test_counter_style_descriptor(descriptor, value, undefined); +} + +function test_counter_style_name(name, isValid) { + let style = document.createElement('style'); + style.textContent = `@counter-style ${name} { system: symbolic; symbols: 'X' 'Y'; }`; + document.head.appendChild(style); + + test(() => { + let rule = style.sheet.cssRules[0]; + if (!isValid) { + assert_equals(rule, undefined); + return; + } + + assert_not_equals(rule, undefined); + assert_equals(rule.constructor.name, 'CSSCounterStyleRule'); + assert_equals(rule.name, name); + }, `@counter-style name ${name} is ${isValid ? 'valid' : 'invalid'}`); + + style.remove(); +} + +function test_valid_name(name) { + test_counter_style_name(name, true); +} + +function test_invalid_name(name) { + test_counter_style_name(name, false); +} + diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/ref-common.css b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/ref-common.css new file mode 100644 index 0000000000..92d77de0e5 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/ref-common.css @@ -0,0 +1,12 @@ +body { + /* to match ua.css, see bug 1020143 */ + font-variant-numeric: tabular-nums; +} +div, p { + padding: 0; margin: 0; + line-height: 150%; + float: left; +} +p { + padding-right: .5em; +} diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/test-common.css b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/test-common.css new file mode 100644 index 0000000000..218dfcb770 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/support/test-common.css @@ -0,0 +1,22 @@ +body { + /* to match ua.css, see bug 1020143 */ + font-variant-numeric: tabular-nums; +} +ol, ul, section, p { + padding: 0; margin: 0; + line-height: 150%; +} +ol, ul { + list-style-position: inside; +} +li, p { + float: left; + padding: 0; +} +p { + padding-right: .5em; +} +li::marker { + /* Blink workaround of https://bugzilla.mozilla.org/show_bug.cgi?id=1688769 */ + white-space: pre; +} diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid-ref.html new file mode 100644 index 0000000000..e07de5f1f9 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + .invalid { + list-style-type: lower-greek; + } +</style> +<ol start="-2" class="invalid"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid.html new file mode 100644 index 0000000000..35aa832587 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-invalid.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#symbols-function"> +<link rel="match" href="symbols-function-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + .invalid { + list-style-type: lower-greek; + list-style-type: symbols(a b c); + list-style-type: symbols(alphabetic a b c); + list-style-type: symbols(numeric 0 1 2); + list-style-type: symbols(additive 'a' 'b'); + list-style-type: symbols(fixed); + list-style-type: symbols(alphabetic 'a'); + list-style-type: symbols(numeric '0'); + } +</style> +<ol start="-2" class="invalid"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-ref.html new file mode 100644 index 0000000000..d2291bd1ef --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function-ref.html @@ -0,0 +1,89 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style cyclic { + system: cyclic; + symbols: '*' '\2020' '\2021' '\A7'; + suffix: ' '; + } + @counter-style numeric { + system: numeric; + symbols: '0' '1' '2'; + suffix: ' '; + } + @counter-style alphabetic { + system: alphabetic; + symbols: '\26AA' '\26AB'; + suffix: ' '; + } + @counter-style symbolic { + system: symbolic; + symbols: '*' '\2020' '\2021' '\A7'; + suffix: ' '; + } + @counter-style fixed { + system: fixed; + symbols: '\25F0' '\25F1' '\25F2' '\25F3'; + suffix: ' '; + } + @counter-style counter { + symbols: '*'; + } + @counter-style counters { + system: numeric; + symbols: '0' '1'; + } + .counter { counter-reset: a; } + .counter p { counter-increment: a 1; } + .counter p::after { + content: counter(a, counter); + } + .counter, .counters { + list-style-type: none; + counter-reset: a; + } + .counter li, .counters li { + counter-increment: a; + padding-right: .5em; + } + .counter li::after { + content: counter(a, counter); + } + .counters .counters li::after { + content: counters(a, '.', counters); + } +</style> +<ol start="-2" style="list-style-type: symbolic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: cyclic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: numeric"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: alphabetic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: symbolic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: fixed"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol class="counter"> + <li><li><li><li><li> +</ol> +<ol class="counters"> + <li><ol class="counters"><li><li><li><li><li></ol></li> + <li><ol class="counters"><li><li><li><li><li></ol></li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function.html new file mode 100644 index 0000000000..9f129582ff --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-function.html @@ -0,0 +1,72 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: symbols function</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#symbols-function"> +<link rel="match" href="symbols-function-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + .default { + list-style-type: symbols('*' '\2020' '\2021' '\A7'); + } + .cyclic { + list-style-type: symbols(cyclic '*' '\2020' '\2021' '\A7'); + } + .numeric { + list-style-type: symbols(numeric '0' '1' '2'); + } + .alphabetic { + list-style-type: symbols(alphabetic '\26AA' '\26AB'); + } + .symbolic { + list-style-type: symbols(symbolic '*' '\2020' '\2021' '\A7'); + } + .fixed { + list-style-type: symbols(fixed '\25F0' '\25F1' '\25F2' '\25F3'); + } + .counter, .counters { + list-style-type: none; + counter-reset: a; + } + .counter li, .counters li { + counter-increment: a; + padding-right: .5em; + } + .counter li::after { + content: counter(a, symbols('*')); + } + .counters .counters li::after { + content: counters(a, '.', symbols(numeric '0' '1')); + } +</style> +<ol start="-2" class="default"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" class="cyclic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" class="numeric"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" class="alphabetic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" class="symbolic"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" class="fixed"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol class="counter"> + <li><li><li><li><li> +</ol> +<ol class="counters"> + <li><ol class="counters"><li><li><li><li><li></ol></li> + <li><ol class="counters"><li><li><li><li><li></ol></li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-syntax.html new file mode 100644 index 0000000000..df0824d6d7 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/symbols-syntax.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-symbols"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_symbols(value, expected) { + test_valid_counter_style_descriptor('symbols', value, expected); +} + +function test_invalid_symbols(value) { + test_invalid_counter_style_descriptor('symbols', value); +} + +// <symbol>+ + +test_valid_symbols('"X"'); +test_valid_symbols('"X" "X"'); +test_valid_symbols('ident "X"'); +test_valid_symbols('ident "X" url("foo.jpg")'); + +test_invalid_symbols(''); +test_invalid_symbols('initial "X" "X"'); +test_invalid_symbols('inherit "X" "X"'); +test_invalid_symbols('unset "X" "X"'); +test_invalid_symbols('default "X"'); +test_invalid_symbols('revert "X"'); +test_invalid_symbols('revert-layer "X"'); +</script> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-invalid.html new file mode 100644 index 0000000000..1a8f94c041 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-invalid.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system additive, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#additive-system"> +<link rel="match" href="system-common-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: additive; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-ref.html new file mode 100644 index 0000000000..b45ab5fcec --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive-ref.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>-2</div> +<div>-1</div> +<div>0</div> +<div>⚀</div> +<div>⚁</div> +<div>⚂</div> +<div>⚃</div> +<div>⚄</div> +<div>⚅</div> +<div>⚅⚀</div> +<div>⚅⚃</div> +<div>⚅⚄</div> +<div>⚅⚅</div> +<div>⚅⚅⚀</div> +<div><script type="text/javascript"> + document.write(Array(61).join('⚅')); +</script></div> +<!-- list-style-type: b --> +<div>-2</div> +<div>-1</div> +<div>☷</div> +<div>☶</div> +<div>☵</div> +<!-- list-style-type: c --> +<div>1. </div> +<div>b. </div> +<div>a. </div> +<div>4. </div> +<div>ab. </div> +<!-- list-style-type: d --> +<div><script type="text/javascript"> + document.write(Array(61).join('𐌀')); +</script>. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive.html new file mode 100644 index 0000000000..74568bccd1 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-additive.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system additive</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#additive-system"> +<link rel="match" href="system-additive-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: additive; + additive-symbols: 6 \2685, 5 \2684, 4 \2683, 3 \2682, 2 \2681, 1 \2680; + suffix: ""; + } + @counter-style b { + system: additive; + additive-symbols: 7 \2630, 6 \2631, 5 \2632, 4 \2633, 3 \2634, 2 \2635, 1 \2636, 0 \2637; + suffix: ""; + } + @counter-style c { + system: additive; + additive-symbols: 3 "a", 2 "b"; + } + @counter-style d { + system: additive; + additive-symbols: 1 \10300; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> + <li value="10"><li><li><li> + <li value="360"><!-- 60 code points --> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> +</ol> +<ol style="list-style-type: c"> + <li><li><li><li><li> +</ol> +<ol style="list-style-type: d"> + <li value="60"><!-- 60 code points --> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-invalid.html new file mode 100644 index 0000000000..c0f8ae926d --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-invalid.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system alphabetic, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#alphabetic-system"> +<link rel="match" href="system-common-invalid2-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: alphabetic; + suffix: ":"; + } + @counter-style b { + system: alphabetic; + symbols: A; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> +<ol start="-2" style="list-style-type: b"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-ref.html new file mode 100644 index 0000000000..331d96ea4c --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>-2</div> +<div>-1</div> +<div>0</div> +<div>⚪</div> +<div>⚫</div> +<div>⚪⚪</div> +<div>⚪⚫</div> +<div>⚫⚪</div> +<div>⚫⚫</div> +<div>⚪⚪⚪</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic.html new file mode 100644 index 0000000000..9447eaf940 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-alphabetic.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system alphabetic</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#alphabetic-system"> +<link rel="match" href="system-alphabetic-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: alphabetic; + symbols: \26AA \26AB; + suffix: ''; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid-ref.html new file mode 100644 index 0000000000..0b91fd4ccf --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<ol start="-2" style="list-style-type: decimal"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid2-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid2-ref.html new file mode 100644 index 0000000000..c0292b7d54 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-common-invalid2-ref.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<ol start="-2" style="list-style-type: decimal"> + <li>foo<li>bar<li>foo<li>bar +</ol> +<ol start="-2" style="list-style-type: decimal"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-invalid.html new file mode 100644 index 0000000000..602df64451 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-invalid.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system cyclic, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#cyclic-system"> +<link rel="match" href="system-common-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: cyclic; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-ref.html new file mode 100644 index 0000000000..605a7ecda9 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>‣</div> +<div>‣</div> +<div>‣</div> +<div>‣</div> +<div>‣</div> +<!-- list-style-type: b --> +<div>‡</div> +<div>†</div> +<div>‡</div> +<div>†</div> +<div>‡</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic.html new file mode 100644 index 0000000000..9d96b820e7 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-cyclic.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system cyclic</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#cyclic-system"> +<link rel="match" href="system-cyclic-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: cyclic; + symbols: \2023; + suffix: ""; + } + @counter-style b { + system: cyclic; + symbols: \2020 \2021; + suffix: ""; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid-ref.html new file mode 100644 index 0000000000..3360e90f7e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/test-common.css"> +<link rel="stylesheet" href="support/ref-common.css"> +<style type="text/css"> + ol { + list-style: decimal inside; + } +</style> +<div>a1b</div> +<div>2b</div> +<div>c3. </div> +<div>d4. </div> +<div>e5. </div> +<ol start="6"> + <li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid.html new file mode 100644 index 0000000000..446fe45e56 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-invalid.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system extends, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#extends-system"> +<link rel="match" href="system-extends-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends b; + prefix: a; + } + @counter-style b { + system: extends c; + suffix: b; + } + @counter-style c { + system: extends b; + pad: 2 c; + } + @counter-style d { + system: extends d; + prefix: d; + } + @counter-style e { + system: extends unknown; + prefix: e; + } + @counter-style f { + system: extends decimal; + symbols: a; + } + @counter-style g { + system: extends decimal; + additive-symbols: 1 a; + } +</style> +<ol> + <li style="list-style-type: a;"> + <li style="list-style-type: b;"> + <li style="list-style-type: c;"> + <li style="list-style-type: d;"> + <li style="list-style-type: e;"> + <li style="list-style-type: f;">foo + <li style="list-style-type: g;">bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-ref.html new file mode 100644 index 0000000000..c988310c25 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>Chapter -2. </div> +<div>Chapter -1. </div> +<div>Chapter 0. </div> +<div>Chapter I. </div> +<div>Chapter II. </div> +<div>Chapter III. </div> +<div>Chapter IV. </div> +<div>Chapter V. </div> +<div>Chapter 6. </div> +<div>Chapter 7. </div> +<!-- list-style-type: b --> +<div>Section -2. </div> +<div>Section -1. </div> +<div>Section 0. </div> +<div>Section I. </div> +<div>Section II. </div> +<div>Section III. </div> +<div>Section IV. </div> +<div>Section V. </div> +<div>Section VI. </div> +<div>Section 7. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends.html new file mode 100644 index 0000000000..287930d0f6 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-extends.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system extends</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#extends-system"> +<link rel="match" href="system-extends-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: extends upper-roman; + prefix: "Chapter "; + range: 1 5; + } + @counter-style b { + system: extends a; + prefix: "Section "; + range: 1 6; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-invalid.html new file mode 100644 index 0000000000..b12b786bf3 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-invalid.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system fixed, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#fixed-system"> +<link rel="match" href="system-common-invalid2-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: fixed; + suffix: ":"; + } + @counter-style b { + system: fixed invalid; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> +<ol start="-2" style="list-style-type: b"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-ref.html new file mode 100644 index 0000000000..0de7bb8368 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>-2:</div> +<div>-1:</div> +<div>0:</div> +<div>◰:</div> +<div>◱:</div> +<div>◲:</div> +<div>◳:</div> +<div>5:</div> +<div>6:</div> +<div>7:</div> +<!-- list-style-type: b --> +<div>-2:</div> +<div>◴:</div> +<div>◵:</div> +<div>◶:</div> +<div>◷:</div> +<div>3:</div> +<div>4:</div> +<div>5:</div> +<div>6:</div> +<div>7:</div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed.html new file mode 100644 index 0000000000..900c95297e --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-fixed.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system fixed</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#fixed-system"> +<link rel="match" href="system-fixed-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: fixed; + symbols: \25F0 \25F1 \25F2 \25F3; + suffix: ':'; + } + @counter-style b { + system: fixed -1; + symbols: \25F4 \25F5 \25F6 \25F7; + suffix: ':'; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> +<ol start="-2" style="list-style-type: b"> + <li><li><li><li><li> + <li><li><li><li><li> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-invalid.html new file mode 100644 index 0000000000..064da8eec7 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-invalid.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system numeric, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#numeric-system"> +<link rel="match" href="system-common-invalid2-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: numeric; + suffix: ":"; + } + @counter-style b { + system: numeric; + symbols: A; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> +<ol start="-2" style="list-style-type: b"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-ref.html new file mode 100644 index 0000000000..c7e70d6f3a --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<div>-11. </div> +<div>-10. </div> +<div>-2. </div> +<div>-1. </div> +<div>0. </div> +<div>1. </div> +<div>2. </div> +<div>10. </div> +<div>11. </div> +<div>12. </div> +<div>10201. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric.html new file mode 100644 index 0000000000..b5be591368 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-numeric.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system numeric</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#numeric-system"> +<link rel="match" href="system-numeric-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: numeric; + symbols: '0' '1' '2'; + } +</style> +<ol start="-4" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> + <li value="100"> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-invalid.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-invalid.html new file mode 100644 index 0000000000..1c0fac4ee8 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-invalid.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system symbolic, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#symbolic-system"> +<link rel="match" href="system-common-invalid-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + system: symbolic; + suffix: ":"; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li>foo<li>bar<li>foo<li>bar +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-ref.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-ref.html new file mode 100644 index 0000000000..7229c895ff --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Reference: symbols function, invalid</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="stylesheet" href="support/ref-common.css"> +<!-- list-style-type: a --> +<div>-2</div> +<div>-1</div> +<div>0</div> +<div>*</div> +<div>⁑</div> +<div>†</div> +<div>‡</div> +<div>**</div> +<div>⁑⁑</div> +<div>††</div> +<div><script type="text/javascript"> + document.write(Array(61).join('‡')); +</script></div> +<!-- list-style-type: b --> +<div><script type="text/javascript"> + document.write(Array(61).join('𐌀')); +</script>. </div> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic.html new file mode 100644 index 0000000000..a3ab8b1a98 --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-symbolic.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<meta charset="UTF-8"> +<title>CSS Test: system symbolic</title> +<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/"> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#symbolic-system"> +<link rel="match" href="system-symbolic-ref.html"> +<link rel="stylesheet" href="support/test-common.css"> +<style type="text/css"> + @counter-style a { + /* system: symbolic; */ + symbols: '*' \2051 \2020 \2021; + suffix: ''; + } + @counter-style b { + symbols: \10300; + } +</style> +<ol start="-2" style="list-style-type: a"> + <li><li><li><li><li> + <li><li><li><li><li> + <li value="240"><!-- 60 code points --> +</ol> +<ol style="list-style-type: b"> + <li value="60"><!-- 60 code points --> +</ol> diff --git a/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-syntax.html b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-syntax.html new file mode 100644 index 0000000000..be593c436b --- /dev/null +++ b/testing/web-platform/tests/css/css-counter-styles/counter-style-at-rule/system-syntax.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-counter-styles-3/#counter-style-system"> +<link rel="author" href="mailto:xiaochengh@chromium.org"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/counter-style-testcommon.js"></script> +<script> +function test_valid_system(value) { + test_valid_counter_style_descriptor('system', value); +} + +function test_invalid_system(value) { + test_invalid_counter_style_descriptor('system', value); +} + +// cyclic | numeric | alphabetic | symbolic | additive | +// [fixed <integer>?] | [ extends <counter-style-name> ] + +test_valid_system('cyclic'); +test_valid_system('fixed'); +test_valid_system('fixed 100'); +test_valid_system('fixed -1'); +test_valid_system('symbolic'); +test_valid_system('alphabetic'); +test_valid_system('numeric'); +test_valid_system('additive'); +test_valid_system('extends bar'); + +test_invalid_system('float'); +test_invalid_system('cyclic cyclic'); + +// The following are not valid counter style names +test_invalid_system('extends none'); +test_invalid_system('extends initial'); +test_invalid_system('extends inherit'); +test_invalid_system('extends unset'); + +</script> |