Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-11 20:35:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1510315 [wpt PR 14259] - [css-multicol] property parsing, computed values, a=testonly

Browse Source 
Automatic update from web-platform-tests
[css-multicol] property parsing, computed values (#14259)

Test that CSS Multi-column Layout properties parse exactly the grammar
specified in the spec.
https://drafts.csswg.org/css-multicol/

Test that computed values are as specified, with lengths made absolute.
--

wpt-commits: fa234f78976ca7abea803fceb3eb53ad3a8603d2
wpt-pr: 14259
This commit is contained in:
Eric Willigers 2018-11-30 18:04:23 +00:00 committed by moz-wptsync-bot
parent 4d2295f922
commit e2921452c4
28 changed files with 622 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
testing/web-platform/tests/css/css-multicol/parsing/column-count-computed.html Normal file
View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnCount</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-count">
<meta name="assert" content="column-count computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("column-count", "auto");
test_computed_value("column-count", "1");
test_computed_value("column-count", "234");
test_computed_value("column-count", "calc(1 + 234)", "235");
</script>
</body>
</html>

24
testing/web-platform/tests/css/css-multicol/parsing/column-count-invalid.html Normal file
View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-count with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-count">
<meta name="assert" content="column-count supports only the grammar 'auto | <integer>'.">
<meta name="assert" content="column-count rejects non-positive integers.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-count", "none");
test_invalid_value("column-count", "2.5");
test_invalid_value("column-count", "-1");
test_invalid_value("column-count", "0");
test_invalid_value("column-count", "auto 1");
test_invalid_value("column-count", "1 234");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/column-count-valid.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-count with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-count">
<meta name="assert" content="column-count supports the full grammar 'auto | <integer>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-count", "auto");
test_valid_value("column-count", "1");
test_valid_value("column-count", "234");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/column-fill-computed.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnFill</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-fill">
<meta name="assert" content="column-fill computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("column-fill", "auto");
test_computed_value("column-fill", "balance");
test_computed_value("column-fill", "balance-all");
</script>
</body>
</html>

18
testing/web-platform/tests/css/css-multicol/parsing/column-fill-invalid.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-fill with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-fill">
<meta name="assert" content="column-fill supports only the grammar 'auto | balance | balance-all'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-fill", "none");
test_invalid_value("column-fill", "auto balance");
</script>
</body>
</html>

19
testing/web-platform/tests/css/css-multicol/parsing/column-fill-valid.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-fill with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-fill">
<meta name="assert" content="column-fill supports the full grammar 'auto | balance | balance-all'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-fill", "auto");
test_valid_value("column-fill", "balance");
test_valid_value("column-fill", "balance-all");
</script>
</body>
</html>

28
testing/web-platform/tests/css/css-multicol/parsing/column-gap-computed.html Normal file
View File

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnGap</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-gap">
<meta name="assert" content="column-gap computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<style>
#target {
font-size: 40px;
}
</style>
<script>
test_computed_value("column-gap", "normal");
test_computed_value("column-gap", "calc(10px + 0.5em)", "30px");
test_computed_value("column-gap", "calc(10px - 0.5em)", "0px");
test_computed_value("column-gap", "40%");
test_computed_value("column-gap", "calc(50% + 60px)");
</script>
</body>
</html>

23
testing/web-platform/tests/css/css-multicol/parsing/column-gap-invalid.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-gap with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-gap">
<meta name="assert" content="column-gap supports only the grammar '<length-percentage> | normal'.">
<meta name="assert" content="column-gap rejects negative <length-percentage>.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-gap", "auto");
test_invalid_value("column-gap", "10");
test_invalid_value("column-gap", "10px 20px");
test_invalid_value("column-gap", "-1px");
test_invalid_value("column-gap", "-10%");
</script>
</body>
</html>

23
testing/web-platform/tests/css/css-multicol/parsing/column-gap-valid.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-gap with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-gap">
<meta name="assert" content="column-gap supports the full grammar '<length-percentage> | normal'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-gap", "normal");
test_valid_value("column-gap", "0", "0px");
test_valid_value("column-gap", "1px");
test_valid_value("column-gap", "calc(2em + 3ex)");
test_valid_value("column-gap", "4%");
test_valid_value("column-gap", "5vmin");
</script>
</body>
</html>

25
testing/web-platform/tests/css/css-multicol/parsing/column-rule-color-computed.html Normal file
View File

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnRuleColor</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-color">
<meta name="assert" content="column-rule-color computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<style>
#target {
color: lime;
}
</style>
<script>
test_computed_value("column-rule-color", "currentcolor", "rgb(0, 255, 0)");
test_computed_value("column-rule-color", "red", "rgb(255, 0, 0)");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/column-rule-color-invalid.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-color with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-color">
<meta name="assert" content="column-rule-color supports only the grammar '<color>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-rule-color", "auto");
test_invalid_value("column-rule-color", "green blue");
test_invalid_value("column-rule-color", "green, blue");
</script>
</body>
</html>

19
testing/web-platform/tests/css/css-multicol/parsing/column-rule-color-valid.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-color with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-color">
<meta name="assert" content="column-rule-color supports the full grammar '<color>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-rule-color", "currentcolor");
test_valid_value("column-rule-color", "red");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/column-rule-invalid.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule">
<meta name="assert" content="column-rule supports only the grammar '<column-rule-width> || <column-rule-style> || <column-rule-color>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-rule", "reverse");
test_invalid_value("column-rule", "10");
test_invalid_value("column-rule", "red medium green");
</script>
</body>
</html>

26
testing/web-platform/tests/css/css-multicol/parsing/column-rule-style-computed.html Normal file
View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnRuleStyle</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-style">
<meta name="assert" content="column-rule-style computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("column-rule-style", "none");
test_computed_value("column-rule-style", "hidden");
test_computed_value("column-rule-style", "dotted");
test_computed_value("column-rule-style", "dashed");
test_computed_value("column-rule-style", "solid");
test_computed_value("column-rule-style", "double");
test_computed_value("column-rule-style", "groove");
test_computed_value("column-rule-style", "ridge");
test_computed_value("column-rule-style", "inset");
</script>
</body>
</html>

18
testing/web-platform/tests/css/css-multicol/parsing/column-rule-style-invalid.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-style with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-style">
<meta name="assert" content="column-rule-style supports only the <line-style> grammar 'none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-rule-style", "auto");
test_invalid_value("column-rule-style", "double dashed");
</script>
</body>
</html>

25
testing/web-platform/tests/css/css-multicol/parsing/column-rule-style-valid.html Normal file
View File

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-style with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-style">
<meta name="assert" content="column-rule-style supports the full <line-style> grammar 'none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-rule-style", "none");
test_valid_value("column-rule-style", "hidden");
test_valid_value("column-rule-style", "dotted");
test_valid_value("column-rule-style", "dashed");
test_valid_value("column-rule-style", "solid");
test_valid_value("column-rule-style", "double");
test_valid_value("column-rule-style", "groove");
test_valid_value("column-rule-style", "ridge");
test_valid_value("column-rule-style", "inset");
</script>
</body>
</html>

21
testing/web-platform/tests/css/css-multicol/parsing/column-rule-valid.html Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule">
<meta name="assert" content="column-rule supports the full grammar '<column-rule-width> || <column-rule-style> || <column-rule-color>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-rule", "10px");
test_valid_value("column-rule", "dotted");
test_valid_value("column-rule", "red");
test_valid_value("column-rule", "currentcolor hidden medium", "medium hidden currentcolor");
</script>
</body>
</html>

44
testing/web-platform/tests/css/css-multicol/parsing/column-rule-width-computed.html Normal file
View File

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnRuleWidth</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-width">
<meta name="assert" content="column-rule-width computed value is absolute length.">
<meta name="assert" content="column-rule-width computed value is 0 if the column rule style is none or hidden.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<style>
#target {
font-size: 40px;
column-rule-style: dotted;
}
</style>
<script>
test_computed_value("column-rule-width", "calc(10px + 0.5em)", "30px");
test_computed_value("column-rule-width", "calc(10px - 0.5em)", "0px");
// thin, medium, thick computed values not yet tested
test(() => {
target.style.columnRuleWidth = '10px';
assert_equals(getComputedStyle(target).columnRuleWidth, '10px');
target.style.columnRuleStyle = 'none';
assert_equals(getComputedStyle(target).columnRuleWidth, '0px');
target.style.columnRuleStyle = 'outset';
assert_equals(getComputedStyle(target).columnRuleWidth, '10px');
target.style.columnRuleStyle = 'hidden';
assert_equals(getComputedStyle(target).columnRuleWidth, '0px');
target.style.columnRuleStyle = '';
}, 'column-rule-width is 0 when column-rule-style is none or hidden');
</script>
</body>
</html>

24
testing/web-platform/tests/css/css-multicol/parsing/column-rule-width-invalid.html Normal file
View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-width with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-width">
<meta name="assert" content="column-rule-width supports only the <line-width> grammar '<length> | thin | medium | thick'.">
<meta name="assert" content="column-rule-width rejects negative lengths.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-rule-width", "auto");
test_invalid_value("column-rule-width", "10");
test_invalid_value("column-rule-width", "-20px");
test_invalid_value("column-rule-width", "30%");
test_invalid_value("column-rule-width", "medium 40px");
</script>
</body>
</html>

22
testing/web-platform/tests/css/css-multicol/parsing/column-rule-width-valid.html Normal file
View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-rule-width with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule-width">
<meta name="assert" content="column-rule-width supports the full <line-width> grammar '<length> | thin | medium | thick'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-rule-width", "thin");
test_valid_value("column-rule-width", "medium");
test_valid_value("column-rule-width", "thick");
test_valid_value("column-rule-width", "0", "0px");
test_valid_value("column-rule-width", "10px");
</script>
</body>
</html>

19
testing/web-platform/tests/css/css-multicol/parsing/column-span-computed.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnSpan</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-span">
<meta name="assert" content="column-span computed value is as specified.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<script>
test_computed_value("column-span", "none");
test_computed_value("column-span", "all");
</script>
</body>
</html>

18
testing/web-platform/tests/css/css-multicol/parsing/column-span-invalid.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-span with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-span">
<meta name="assert" content="column-span supports only the grammar 'none | all'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-span", "auto");
test_invalid_value("column-span", "none all");
</script>
</body>
</html>

18
testing/web-platform/tests/css/css-multicol/parsing/column-span-valid.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-span with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-span">
<meta name="assert" content="column-span supports the full grammar 'none | all'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-span", "none");
test_valid_value("column-span", "all");
</script>
</body>
</html>

26
testing/web-platform/tests/css/css-multicol/parsing/column-width-computed.html Normal file
View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: getComputedValue().columnWidth</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-width">
<meta name="assert" content="column-width computed value is the keyword auto or an absolute length.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
</head>
<body>
<div id="target"></div>
<style>
#target {
font-size: 40px;
}
</style>
<script>
test_computed_value("column-width", "auto");
test_computed_value("column-width", "calc(10px + 0.5em)", "30px");
test_computed_value("column-width", "calc(10px - 0.5em)", "0px");
</script>
</body>
</html>

23
testing/web-platform/tests/css/css-multicol/parsing/column-width-invalid.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-width with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-width">
<meta name="assert" content="column-width supports only the grammar 'auto | <length>'.">
<meta name="assert" content="column-width rejects negative lengths.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("column-width", "none");
test_invalid_value("column-width", "10");
test_invalid_value("column-width", "-20px");
test_invalid_value("column-width", "30%");
test_invalid_value("column-width", "auto 40px");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/column-width-valid.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing column-width with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-width">
<meta name="assert" content="column-width supports the full grammar 'auto | <length>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("column-width", "auto");
test_valid_value("column-width", "0", "0px");
test_valid_value("column-width", "10px");
</script>
</body>
</html>

20
testing/web-platform/tests/css/css-multicol/parsing/columns-invalid.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing columns with invalid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-columns">
<meta name="assert" content="columns supports only the grammar '<column-width> || <column-count>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_invalid_value("columns", "none");
test_invalid_value("columns", "10px 20px");
test_invalid_value("columns", "10 20");
</script>
</body>
</html>

17
testing/web-platform/tests/css/css-multicol/parsing/columns-valid.html Normal file
View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Multi-column Layout: parsing columns with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-columns">
<meta name="assert" content="columns supports the full grammar '<column-width> || <column-count>'.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value("columns", "2 10px", "10px 2");
</script>
</body>
</html>