diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/css-box/parsing | |
| parent | Initial commit. (diff) | |
| download | firefox-upstream.tar.xz firefox-upstream.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-box/parsing')
29 files changed, 888 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-box/parsing/clear-computed.html b/testing/web-platform/tests/css/css-box/parsing/clear-computed.html new file mode 100644 index 0000000000..9571cb7e40 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/clear-computed.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: getComputedStyle().clear</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-clear"> +<link rel="help" href="https://drafts.csswg.org/css-logical/#float-clear"> +<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("clear", "none"); +test_computed_value("clear", "left"); +test_computed_value("clear", "right"); +test_computed_value("clear", "both"); + +test_computed_value("clear", "inline-start"); +test_computed_value("clear", "inline-end"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/clear-invalid.html b/testing/web-platform/tests/css/css-box/parsing/clear-invalid.html new file mode 100644 index 0000000000..38d1821bc8 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/clear-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing clear with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-clear"> +<meta name="assert" content="clear supports only the grammar 'none | left | right | both'."> +<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("clear", "auto"); +test_invalid_value("clear", "left right"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/clear-valid.html b/testing/web-platform/tests/css/css-box/parsing/clear-valid.html new file mode 100644 index 0000000000..fc1947f71d --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/clear-valid.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing clear with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-clear"> +<link rel="help" href="https://drafts.csswg.org/css-logical/#float-clear"> +<meta name="assert" content="clear supports the full grammar 'none | left | right | both'."> +<meta name="assert" content="clear also supports inline-start and inline-end."> +<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("clear", "none"); +test_valid_value("clear", "left"); +test_valid_value("clear", "right"); +test_valid_value("clear", "both"); + +test_valid_value("clear", "inline-start"); +test_valid_value("clear", "inline-end"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/float-computed.html b/testing/web-platform/tests/css/css-box/parsing/float-computed.html new file mode 100644 index 0000000000..9d680e16c6 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/float-computed.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: getComputedStyle().float</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-float"> +<link rel="help" href="https://drafts.csswg.org/css-logical/#float-clear"> +<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("float", "none"); +test_computed_value("float", "left"); +test_computed_value("float", "right"); + +test_computed_value("float", "inline-start"); +test_computed_value("float", "inline-end"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/float-invalid.html b/testing/web-platform/tests/css/css-box/parsing/float-invalid.html new file mode 100644 index 0000000000..c11f4e2e66 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/float-invalid.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing float with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-float"> +<meta name="assert" content="float supports only the grammar 'left | right | top | bottom | start | end | none | <page-floats>'."> +<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("float", "auto"); +test_invalid_value("float", "right bottom"); +test_invalid_value("float", "top, left"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/float-valid.html b/testing/web-platform/tests/css/css-box/parsing/float-valid.html new file mode 100644 index 0000000000..32cf7edefd --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/float-valid.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing float with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-float"> +<link rel="help" href="https://drafts.csswg.org/css-logical/#float-clear"> +<meta name="assert" content="float supports the full grammar 'left | right | top | bottom | start | end | none | <page-floats>'."> +<meta name="assert" content="float supports 'inline-start | inline-end'."> +<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("float", "left"); +test_valid_value("float", "right"); +test_valid_value("float", "none"); + +test_valid_value("float", "inline-start"); +test_valid_value("float", "inline-end"); + +// The following are not yet supported by browsers: +// test_valid_value("float", "top"); +// test_valid_value("float", "bottom"); +// test_valid_value("float", "start"); // not permitted in https://drafts.csswg.org/css-page-floats/#float-property +// test_valid_value("float", "end"); // not permitted in https://drafts.csswg.org/css-page-floats/#float-property + +// Page floats are now defined in +// https://drafts.csswg.org/css-page-floats/#float-property +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/height-invalid.html b/testing/web-platform/tests/css/css-box/parsing/height-invalid.html new file mode 100644 index 0000000000..dcd4d1afbe --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/height-invalid.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing height with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-height"> +<meta name="assert" content="height supports only the grammar '[<length> | <percentage>] | available | min-content | max-content | fit-content | complex | auto'."> +<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("height", "none"); + +test_invalid_value("height", "min-content available"); +test_invalid_value("height", "max-content 10px"); +test_invalid_value("height", "20% available"); + +test_invalid_value("height", "-10px"); +test_invalid_value("height", "-20%"); +test_invalid_value("height", "60"); +test_invalid_value("height", "10px 20%"); + +test_invalid_value("height", "10px border-box"); +test_invalid_value("height", "content-box 20%"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/height-valid.html b/testing/web-platform/tests/css/css-box/parsing/height-valid.html new file mode 100644 index 0000000000..7cc09a594e --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/height-valid.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing height with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-height"> +<meta name="assert" content="height supports the full grammar '[<length> | <percentage>] | available | min-content | max-content | fit-content | complex | auto'."> +<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("height", "auto"); + +test_valid_value("height", "10px"); +test_valid_value("height", "20%"); +test_valid_value("height", "calc(2em + 3ex)"); + +test_valid_value("height", "min-content"); +test_valid_value("height", "max-content"); +test_valid_value("height", "fit-content"); + +// The following are not yet supported by browsers: +// test_valid_value("height", "available"); +// test_valid_value("height", "complex"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-computed.html b/testing/web-platform/tests/css/css-box/parsing/margin-computed.html new file mode 100644 index 0000000000..6c3b321c72 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-computed.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: getComputedStyle().margin</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-margin"> +<meta name="assert" content="margin computed value has absolute lengths."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/computed-testcommon.js"></script> +<style> + #parent { + width: 200px; + } + #target { + width: 0px; + font-size: 40px; + } +</style> +</head> +<body> +<div id="parent"> + <div id="target"></div> +</div> +<script> +const target = document.getElementById("target"); + +test_computed_value("margin", "10px"); +test_computed_value("margin", "10px 20px 30px 40px"); +test_computed_value("margin", "calc(0.5em + 10px)", "30px"); +test_computed_value("margin", "30%", "60px"); + +// Since what should the margin be in presence of other margins is a bit +// unclear (https://github.com/w3c/csswg-drafts/issues/2328), reset the margin +// before testing. +target.style.margin = "0"; +test_computed_value("margin-top", "10px"); +target.style.margin = "0"; +test_computed_value("margin-right", "20px"); +target.style.margin = "0"; +test_computed_value("margin-bottom", "30px"); +target.style.margin = "0"; +test_computed_value("margin-left", "40px"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-invalid.html b/testing/web-platform/tests/css/css-box/parsing/margin-invalid.html new file mode 100644 index 0000000000..7700917093 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-invalid.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing margin with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-margin"> +<meta name="assert" content="margin supports only the grammar '[ <length> | <percentage> | auto]{1,4}'."> +<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("margin", "available"); +test_invalid_value("margin", "10px border-box"); +test_invalid_value("margin", "1% 2% 3% 4% 5%"); + +test_invalid_value("margin-top", "calc(2em + 3ex) auto"); +test_invalid_value("margin-right", "auto calc(2em + 3ex) 20%"); +test_invalid_value("margin-bottom", "10px 20% calc(2em + 3ex) auto"); +test_invalid_value("margin-bottom-left", "none"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-shorthand.html b/testing/web-platform/tests/css/css-box/parsing/margin-shorthand.html new file mode 100644 index 0000000000..293927983e --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-shorthand.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: margin sets longhands</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-margin"> +<meta name="assert" content="margin supports the full grammar '<length-percentage>{1,4}'."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/shorthand-testcommon.js"></script> +</head> +<body> +<script> +test_shorthand_value('margin', '1px 2px 3px 4px', { + 'margin-top': '1px', + 'margin-right': '2px', + 'margin-bottom': '3px', + 'margin-left': '4px' +}); + +test_shorthand_value('margin', '1px 2px 3px', { + 'margin-top': '1px', + 'margin-right': '2px', + 'margin-bottom': '3px', + 'margin-left': '2px' +}); + +test_shorthand_value('margin', '1px 2px', { + 'margin-top': '1px', + 'margin-right': '2px', + 'margin-bottom': '1px', + 'margin-left': '2px' +}); + +test_shorthand_value('margin', '1px', { + 'margin-top': '1px', + 'margin-right': '1px', + 'margin-bottom': '1px', + 'margin-left': '1px' +}); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-trim-computed.html b/testing/web-platform/tests/css/css-box/parsing/margin-trim-computed.html new file mode 100644 index 0000000000..ad2d17f2ef --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-trim-computed.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS margin-trim computed style</title> +<link rel="help" href="https://www.w3.org/TR/css-box-4/#margin-trim"> +<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com"> +<meta name="assert" content="Test the computed values for margin-trim"> +<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("margin-trim", "none"); +test_computed_value("margin-trim", "block"); +test_computed_value("margin-trim", "inline"); +test_computed_value("margin-trim", "block-start block-end", "block"); +test_computed_value("margin-trim", "inline-start inline-end", "inline"); +test_computed_value("margin-trim", "block-start"); +test_computed_value("margin-trim", "block-end"); +test_computed_value("margin-trim", "inline-start"); +test_computed_value("margin-trim", "inline-end"); +test_computed_value("margin-trim", "block-start inline-start"); +test_computed_value("margin-trim", "inline-start block-start", "block-start inline-start"); +test_computed_value("margin-trim", "inline-end block-start", "block-start inline-end"); +test_computed_value("margin-trim", "inline-end block-end", "block-end inline-end"); +test_computed_value("margin-trim", "block-start block-end inline-start", "block-start inline-start block-end"); +test_computed_value("margin-trim", "inline-start block-start inline-end block-end", "block-start inline-start block-end inline-end"); +test_computed_value("margin-trim", "inline-start inline-end block-start", "block-start inline-start inline-end"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-trim.html b/testing/web-platform/tests/css/css-box/parsing/margin-trim.html new file mode 100644 index 0000000000..0d92f80b9b --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-trim.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS margin-trim: property parsing</title> +<link rel="help" href="https://www.w3.org/TR/css-box-4/#margin-trim"> +<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com"> +<meta name="assert" content="Test parsing for the margin-trim property"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/parsing-testcommon.js"></script> +</head> +<body> +<script> +// Individual values should get set +test_valid_value("margin-trim", "none"); +test_valid_value("margin-trim", "block"); +test_valid_value("margin-trim", "inline"); +test_valid_value("margin-trim", "block-start"); +test_valid_value("margin-trim", "block-end"); +test_valid_value("margin-trim", "inline-start"); +test_valid_value("margin-trim", "inline-end"); + +// Serialize values into either block or inline +test_valid_value("margin-trim", "block-start block-end", "block"); +test_valid_value("margin-trim", "inline-start inline-end", "inline"); +test_valid_value("margin-trim", "block-end block-start", "block"); +test_valid_value("margin-trim", "inline-end inline-start", "inline"); +test_valid_value("margin-trim", "inline-start block-start"); + +test_valid_value("margin-trim", "inline-end block-start block-end"); +test_valid_value("margin-trim", "block-start inline-start block-end inline-end"); +test_valid_value("margin-trim", "inline-end block-end inline-start block-start"); + +test_invalid_value("margin-trim", "block inline"); +test_invalid_value("margin-trim", "block block"); +test_invalid_value("margin-trim", "inline inline"); +test_invalid_value("margin-trim", "block inline-start inline-end"); +test_invalid_value("margin-trim", "block block-start block-end"); +test_invalid_value("margin-trim", "block-start block-end block"); +test_invalid_value("margin-trim", "block 10px"); +test_invalid_value("margin-trim", "auto"); +test_invalid_value("margin-trim", "left"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/margin-valid.html b/testing/web-platform/tests/css/css-box/parsing/margin-valid.html new file mode 100644 index 0000000000..154aa2de7c --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/margin-valid.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing margin with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-margin"> +<meta name="assert" content="margin supports the full grammar '[ <length> | <percentage> | auto]{1,4}'."> +<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("margin", "10px"); +test_valid_value("margin", "20%"); +test_valid_value("margin", "calc(2em + 3ex)"); +test_valid_value("margin", "auto"); +test_valid_value("margin", "-10px"); +test_valid_value("margin", "-20%"); + +test_valid_value("margin", "calc(2em + 3ex) auto"); +test_valid_value("margin", "auto calc(2em + 3ex) 20%"); +test_valid_value("margin", "10px 20% calc(2em + 3ex) auto"); + +test_valid_value("margin-top", "10px"); +test_valid_value("margin-right", "20%"); +test_valid_value("margin-bottom", "calc(2em + 3ex)"); +test_valid_value("margin-left", "auto"); +test_valid_value("margin-top", "-10px"); +test_valid_value("margin-right", "-20%"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/max-height-invalid.html b/testing/web-platform/tests/css/css-box/parsing/max-height-invalid.html new file mode 100644 index 0000000000..aeb6e64808 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/max-height-invalid.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing max-height with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-max-height"> +<meta name="assert" content="max-height supports only the grammar '[ [<length> | <percentage>] && [border-box | content-box]? ] | available | min-content | max-content | fit-content | none'."> +<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("max-height", "complex"); +test_invalid_value("max-height", "auto"); +test_invalid_value("max-height", "none available"); +test_invalid_value("max-height", "max-content 10px"); +test_invalid_value("max-height", "20% available"); + +test_invalid_value("max-height", "-10px"); +test_invalid_value("max-height", "-20%"); +test_invalid_value("max-height", "60"); +test_invalid_value("max-height", "10px 20%"); +test_invalid_value("max-height", "content-box border-box"); +test_invalid_value("max-height", "10px border-box 20%"); +test_invalid_value("max-height", "content-box 20% border-box"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/max-height-valid.html b/testing/web-platform/tests/css/css-box/parsing/max-height-valid.html new file mode 100644 index 0000000000..04880c4903 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/max-height-valid.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing max-height with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-max-height"> +<meta name="assert" content="max-height supports the full grammar '[ [<length> | <percentage>] && [border-box | content-box]? ] | available | min-content | max-content | fit-content | none'."> +<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("max-height", "none"); + +test_valid_value("max-height", "10px"); +test_valid_value("max-height", "20%"); +test_valid_value("max-height", "calc(2em + 3ex)"); + +test_valid_value("max-height", "min-content"); +test_valid_value("max-height", "max-content"); +test_valid_value("max-height", "fit-content"); + +// The following are not yet supported by browsers: +// test_valid_value("max-height", "available"); +// test_valid_value("max-height", "10px border-box"); +// test_valid_value("max-height", "content-box 20%", "20% content-box"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/max-width-invalid.html b/testing/web-platform/tests/css/css-box/parsing/max-width-invalid.html new file mode 100644 index 0000000000..03db7e2657 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/max-width-invalid.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing max-width with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-max-width"> +<meta name="assert" content="max-width supports only the grammar '[ [<length> | <percentage>] && [border-box | content-box]? ] | available | min-content | max-content | fit-content | none'."> +<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("max-width", "complex"); +test_invalid_value("max-width", "auto"); +test_invalid_value("max-width", "none available"); +test_invalid_value("max-width", "max-content 10px"); +test_invalid_value("max-width", "20% available"); + +test_invalid_value("max-width", "-10px"); +test_invalid_value("max-width", "-20%"); +test_invalid_value("max-width", "60"); +test_invalid_value("max-width", "10px 20%"); +test_invalid_value("max-width", "content-box border-box"); +test_invalid_value("max-width", "10px border-box 20%"); +test_invalid_value("max-width", "content-box 20% border-box"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/max-width-valid.html b/testing/web-platform/tests/css/css-box/parsing/max-width-valid.html new file mode 100644 index 0000000000..1e08a820d9 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/max-width-valid.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing max-width with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-max-width"> +<meta name="assert" content="max-width supports the full grammar '[ [<length> | <percentage>] && [border-box | content-box]? ] | available | min-content | max-content | fit-content | none'."> +<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("max-width", "none"); + +test_valid_value("max-width", "10px"); +test_valid_value("max-width", "20%"); +test_valid_value("max-width", "calc(2em + 3ex)"); + +test_valid_value("max-width", "min-content"); +test_valid_value("max-width", "max-content"); +test_valid_value("max-width", "fit-content"); + +// The following are not yet supported by browsers: +// test_valid_value("max-width", "available"); +// test_valid_value("max-width", "10px border-box"); +// test_valid_value("max-width", "content-box 20%", "20% content-box"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/overflow-invalid.html b/testing/web-platform/tests/css/css-box/parsing/overflow-invalid.html new file mode 100644 index 0000000000..4747764fb6 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/overflow-invalid.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing overflow with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-overflow"> +<meta name="assert" content="overflow supports only the grammar '[ visible | hidden | scroll | auto | no-display | no-content ]{1,2}'."> +<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("overflow", "none"); +test_invalid_value("overflow", "visible hidden scroll"); +test_invalid_value("overflow", "no-display, no-content"); + +test_invalid_value("overflow-x", "none"); +test_invalid_value("overflow-y", "visible hidden"); +test_invalid_value("overflow-y", "no-display, no-content"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/overflow-valid.html b/testing/web-platform/tests/css/css-box/parsing/overflow-valid.html new file mode 100644 index 0000000000..1bfeec2364 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/overflow-valid.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing overflow with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-overflow"> +<meta name="assert" content="overflow supports the full grammar '[ visible | hidden | scroll | auto | no-display | no-content ]{1,2}'."> +<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("overflow", "visible"); +test_valid_value("overflow", "hidden"); +test_valid_value("overflow", "scroll"); +test_valid_value("overflow", "auto"); + +test_valid_value("overflow-x", "visible"); +test_valid_value("overflow-x", "hidden"); +test_valid_value("overflow-x", "scroll"); +test_valid_value("overflow-y", "auto"); + +// The following are not yet supported by browsers: +// test_valid_value("overflow", "no-display"); +// test_valid_value("overflow", "no-content"); +// test_valid_value("overflow", "visible hidden"); +// test_valid_value("overflow", "auto scroll"); +// test_valid_value("overflow", "no-display no-content"); +// test_valid_value("overflow-y", "no-display"); +// test_valid_value("overflow-y", "no-content"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/padding-computed.html b/testing/web-platform/tests/css/css-box/parsing/padding-computed.html new file mode 100644 index 0000000000..f1186c4530 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/padding-computed.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: getComputedStyle().padding</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-padding"> +<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values"> +<meta name="assert" content="padding resolved value is an absolute length."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/computed-testcommon.js"></script> +<style> + #container { + will-change: transform; /* containing block for #target */ + width: 200px; + } + #parent { + width: 0px; + } + #target { + position: absolute; + font-size: 40px; + } +</style> +</head> +<body> +<div id="container"> + <div id="parent"> + <div id="target"></div> + </div> +</div> +<script> +test_computed_value("padding", "10px"); +test_computed_value("padding", "10px 20px 30px 40px"); + +test_computed_value("padding-top", "10px"); +test_computed_value("padding-right", "20px"); +test_computed_value("padding-bottom", "30px"); +test_computed_value("padding-left", "40px"); + +test_computed_value("padding", "20%", "40px"); +test_computed_value("padding", "10px 20% 30% 40px", "10px 40px 60px"); +test_computed_value("padding-right", "20%", "40px"); + +test_computed_value('padding-top', 'calc(10% - 40px)', '0px'); +test_computed_value('padding-right', 'calc(10% + 40px)', '60px'); +test_computed_value('padding-bottom', 'calc(10px - 0.5em)', '0px'); +test_computed_value('padding-left', 'calc(10px + 0.5em)', '30px'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/padding-invalid.html b/testing/web-platform/tests/css/css-box/parsing/padding-invalid.html new file mode 100644 index 0000000000..3e3a560c2f --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/padding-invalid.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing padding with invalid values</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-padding"> +<meta name="assert" content="padding supports only the grammar '<length-percentage>{1,4}'."> +<meta name="assert" content="Negative values are invalid."> +<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("padding", "auto"); +test_invalid_value("padding", "available"); +test_invalid_value("padding", "10px border-box"); +test_invalid_value("padding", "calc(2em + 3ex) auto"); +test_invalid_value("padding", "10px 20px 30px 40px 50px"); + +test_invalid_value("padding-top", "auto"); +test_invalid_value("padding-bottom", "10px 20px calc(2em + 3ex) auto"); +test_invalid_value("padding-bottom-left", "10px 20px"); + +test_invalid_value("padding-top", "-10px"); +test_invalid_value("padding-right", "-20%"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/padding-shorthand.html b/testing/web-platform/tests/css/css-box/parsing/padding-shorthand.html new file mode 100644 index 0000000000..dc0139dc47 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/padding-shorthand.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: padding sets longhands</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-padding"> +<meta name="assert" content="padding supports the full grammar '<length-percentage>{1,4}'."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/css/support/shorthand-testcommon.js"></script> +</head> +<body> +<script> +test_shorthand_value('padding', '1px 2px 3px 4px', { + 'padding-top': '1px', + 'padding-right': '2px', + 'padding-bottom': '3px', + 'padding-left': '4px' +}); + +test_shorthand_value('padding', '1px 2px 3px', { + 'padding-top': '1px', + 'padding-right': '2px', + 'padding-bottom': '3px', + 'padding-left': '2px' +}); + +test_shorthand_value('padding', '1px 2px', { + 'padding-top': '1px', + 'padding-right': '2px', + 'padding-bottom': '1px', + 'padding-left': '2px' +}); + +test_shorthand_value('padding', '1px', { + 'padding-top': '1px', + 'padding-right': '1px', + 'padding-bottom': '1px', + 'padding-left': '1px' +}); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/padding-valid.html b/testing/web-platform/tests/css/css-box/parsing/padding-valid.html new file mode 100644 index 0000000000..36d158b4d0 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/padding-valid.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing padding with valid values</title> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-padding"> +<meta name="assert" content="padding supports the full grammar '<length-percentage>{1,4}'."> +<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("padding", "10px"); +test_valid_value("padding", "10px 20px 30px 40px"); +test_valid_value("padding", "calc(2em + 3ex)"); + +test_valid_value("padding-top", "10px"); +test_valid_value("padding-right", "20px"); +test_valid_value("padding-bottom", "30px"); +test_valid_value("padding-left", "40px"); + +test_valid_value("padding", "20%"); +test_valid_value("padding", "10px 20% 30% 40px"); +test_valid_value("padding-right", "20%"); + +// https://drafts.csswg.org/css-values-4/#sort-a-calculations-children +test_valid_value("padding-right", "calc(2em + 3%)", "calc(3% + 2em)"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/visibility-computed.html b/testing/web-platform/tests/css/css-box/parsing/visibility-computed.html new file mode 100644 index 0000000000..f6d4c3f8e5 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/visibility-computed.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: getComputedStyle().visibility</title> +<link rel="help" href="https://www.w3.org/TR/CSS2/visufx.html#visibility"> +<meta name="assert" content="visibility 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("visibility", "visible"); +test_computed_value("visibility", "hidden"); +test_computed_value("visibility", "collapse"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/visibility-invalid.html b/testing/web-platform/tests/css/css-box/parsing/visibility-invalid.html new file mode 100644 index 0000000000..73e611b2b8 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/visibility-invalid.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing visibility with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-visibility"> +<meta name="assert" content="visibility supports only the grammar 'visible | hidden | collapse'."> +<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("visibility", "auto"); +test_invalid_value("visibility", "hidden collapse"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/visibility-valid.html b/testing/web-platform/tests/css/css-box/parsing/visibility-valid.html new file mode 100644 index 0000000000..2ab2f49660 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/visibility-valid.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing visibility with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-visibility"> +<meta name="assert" content="visibility supports the full grammar 'visible | hidden | collapse'."> +<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("visibility", "visible"); +test_valid_value("visibility", "hidden"); +test_valid_value("visibility", "collapse"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/width-invalid.html b/testing/web-platform/tests/css/css-box/parsing/width-invalid.html new file mode 100644 index 0000000000..5a0145fe1d --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/width-invalid.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing width with invalid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-width"> +<meta name="assert" content="width supports only the grammar '[<length> | <percentage>] | available | min-content | max-content | fit-content | auto'."> +<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("width", "complex"); +test_invalid_value("width", "none"); + +test_invalid_value("width", "min-content available"); +test_invalid_value("width", "max-content 10px"); +test_invalid_value("width", "20% available"); + +test_invalid_value("width", "-10px"); +test_invalid_value("width", "-20%"); +test_invalid_value("width", "60"); +test_invalid_value("width", "10px 20%"); + +test_invalid_value("width", "10px border-box"); +test_invalid_value("width", "content-box 20%"); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-box/parsing/width-valid.html b/testing/web-platform/tests/css/css-box/parsing/width-valid.html new file mode 100644 index 0000000000..93059bd2d3 --- /dev/null +++ b/testing/web-platform/tests/css/css-box/parsing/width-valid.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>CSS basic box model: parsing width with valid values</title> +<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org"> +<link rel="help" href="https://drafts.csswg.org/css-box-3/#propdef-width"> +<meta name="assert" content="width supports the full grammar '[<length> | <percentage>] | available | min-content | max-content | fit-content | auto'."> +<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("width", "auto"); + +test_valid_value("width", "10px"); +test_valid_value("width", "20%"); +test_valid_value("width", "calc(2em + 3ex)"); + +test_valid_value("width", "min-content"); +test_valid_value("width", "max-content"); +test_valid_value("width", "fit-content"); + +// The following is not yet supported by browsers: +// test_valid_value("width", "available"); +</script> +</body> +</html> |