Bug 1510061 [wpt PR 14240] - CSS: WPTs for Positioned Layout parsing, a=testonly
☠☠ backed out by fb94ec981a7d ☠ ☠
authorEric Willigers <ericwilligers@chromium.org>
Fri, 30 Nov 2018 18:04:46 +0000
changeset 449844 58b8d41e9b59ba70e3664f0b5bdb9e576a163b41
parent 449843 e43407fb6f9dac94f6040b41fc841f88ab5daa44
child 449845 f6b9756d68b0044c2397f26f3b8cb3de60d67994
push id110426
push userwptsync@mozilla.com
push dateTue, 11 Dec 2018 03:07:11 +0000
treeherdermozilla-inbound@fcd0236d7afa [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1510061, 14240, 1350409, 611349
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1510061 [wpt PR 14240] - CSS: WPTs for Positioned Layout parsing, a=testonly Automatic update from web-platform-tests CSS: WPTs for Positioned Layout parsing Test parsing and computed value for https://drafts.csswg.org/css-position/ - bottom left right top - position - z-index - inset-after inset-before inset-end inset-start (not currently implemented) Change-Id: I586271fe584fadb19e5683a2781c32142fd9001a Reviewed-on: https://chromium-review.googlesource.com/c/1350409 Reviewed-by: Rune Lillesveen <futhark@chromium.org> Commit-Queue: Eric Willigers <ericwilligers@chromium.org> Cr-Commit-Position: refs/heads/master@{#611349} -- wpt-commits: 09972ca7bd566c05f4451b5dda4678e28850a563 wpt-pr: 14240
testing/web-platform/tests/css/css-position/parsing/bottom-computed.html
testing/web-platform/tests/css/css-position/parsing/bottom-invalid.html
testing/web-platform/tests/css/css-position/parsing/bottom-valid.html
testing/web-platform/tests/css/css-position/parsing/inset-after-computed.html
testing/web-platform/tests/css/css-position/parsing/inset-after-invalid.html
testing/web-platform/tests/css/css-position/parsing/inset-after-valid.html
testing/web-platform/tests/css/css-position/parsing/inset-before-computed.html
testing/web-platform/tests/css/css-position/parsing/inset-before-invalid.html
testing/web-platform/tests/css/css-position/parsing/inset-before-valid.html
testing/web-platform/tests/css/css-position/parsing/inset-end-computed.html
testing/web-platform/tests/css/css-position/parsing/inset-end-invalid.html
testing/web-platform/tests/css/css-position/parsing/inset-end-valid.html
testing/web-platform/tests/css/css-position/parsing/inset-start-computed.html
testing/web-platform/tests/css/css-position/parsing/inset-start-invalid.html
testing/web-platform/tests/css/css-position/parsing/inset-start-valid.html
testing/web-platform/tests/css/css-position/parsing/left-computed.html
testing/web-platform/tests/css/css-position/parsing/left-invalid.html
testing/web-platform/tests/css/css-position/parsing/left-valid.html
testing/web-platform/tests/css/css-position/parsing/position-computed.html
testing/web-platform/tests/css/css-position/parsing/position-invalid.html
testing/web-platform/tests/css/css-position/parsing/position-valid.html
testing/web-platform/tests/css/css-position/parsing/right-computed.html
testing/web-platform/tests/css/css-position/parsing/right-invalid.html
testing/web-platform/tests/css/css-position/parsing/right-valid.html
testing/web-platform/tests/css/css-position/parsing/top-computed.html
testing/web-platform/tests/css/css-position/parsing/top-invalid.html
testing/web-platform/tests/css/css-position/parsing/top-valid.html
testing/web-platform/tests/css/css-position/parsing/z-index-computed.html
testing/web-platform/tests/css/css-position/parsing/z-index-invalid.html
testing/web-platform/tests/css/css-position/parsing/z-index-valid.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/bottom-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().bottom</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-bottom">
+<meta name="assert" content="bottom lengths are made absolute.">
+<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("bottom", "auto");
+
+test_computed_value("bottom", "calc(10px + 0.5em)", "30px");
+test_computed_value("bottom", "calc(10px - 0.5em)", "-10px");
+test_computed_value("bottom", "-40%");
+test_computed_value("bottom", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/bottom-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing bottom with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-bottom">
+<meta name="assert" content="bottom supports only the grammar 'auto | <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("bottom", "min-content");
+
+test_invalid_value("bottom", "60");
+test_invalid_value("bottom", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/bottom-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing bottom with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-bottom">
+<meta name="assert" content="bottom supports the full grammar 'auto | <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_valid_value("bottom", "auto");
+
+test_valid_value("bottom", "-10px");
+test_valid_value("bottom", "-20%");
+test_valid_value("bottom", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-after-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().insetAfter</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-after">
+<meta name="assert" content="inset-after lengths are made absolute.">
+<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("inset-after", "auto");
+
+test_computed_value("inset-after", "calc(10px + 0.5em)", "30px");
+test_computed_value("inset-after", "calc(10px - 0.5em)", "-10px");
+test_computed_value("inset-after", "-40%");
+test_computed_value("inset-after", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-after-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-after with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-after">
+<meta name="assert" content="inset-after supports only the grammar 'auto | <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("inset-after", "min-content");
+
+test_invalid_value("inset-after", "60");
+test_invalid_value("inset-after", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-after-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-after with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-after">
+<meta name="assert" content="inset-after supports the full grammar 'auto | <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_valid_value("inset-after", "auto");
+
+test_valid_value("inset-after", "-10px");
+test_valid_value("inset-after", "-20%");
+test_valid_value("inset-after", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-before-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().insetBefore</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-before">
+<meta name="assert" content="inset-before lengths are made absolute.">
+<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("inset-before", "auto");
+
+test_computed_value("inset-before", "calc(10px + 0.5em)", "30px");
+test_computed_value("inset-before", "calc(10px - 0.5em)", "-10px");
+test_computed_value("inset-before", "-40%");
+test_computed_value("inset-before", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-before-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-before with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-before">
+<meta name="assert" content="inset-before supports only the grammar 'auto | <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("inset-before", "min-content");
+
+test_invalid_value("inset-before", "60");
+test_invalid_value("inset-before", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-before-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-before with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-before">
+<meta name="assert" content="inset-before supports the full grammar 'auto | <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_valid_value("inset-before", "auto");
+
+test_valid_value("inset-before", "-10px");
+test_valid_value("inset-before", "-20%");
+test_valid_value("inset-before", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-end-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().insetEnd</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-end">
+<meta name="assert" content="inset-end lengths are made absolute.">
+<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("inset-end", "auto");
+
+test_computed_value("inset-end", "calc(10px + 0.5em)", "30px");
+test_computed_value("inset-end", "calc(10px - 0.5em)", "-10px");
+test_computed_value("inset-end", "-40%");
+test_computed_value("inset-end", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-end-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-end with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-end">
+<meta name="assert" content="inset-end supports only the grammar 'auto | <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("inset-end", "min-content");
+
+test_invalid_value("inset-end", "60");
+test_invalid_value("inset-end", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-end-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-end with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-end">
+<meta name="assert" content="inset-end supports the full grammar 'auto | <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_valid_value("inset-end", "auto");
+
+test_valid_value("inset-end", "-10px");
+test_valid_value("inset-end", "-20%");
+test_valid_value("inset-end", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-start-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().insetStart</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-start">
+<meta name="assert" content="inset-start lengths are made absolute.">
+<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("inset-start", "auto");
+
+test_computed_value("inset-start", "calc(10px + 0.5em)", "30px");
+test_computed_value("inset-start", "calc(10px - 0.5em)", "-10px");
+test_computed_value("inset-start", "-40%");
+test_computed_value("inset-start", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-start-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-start with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-start">
+<meta name="assert" content="inset-start supports only the grammar 'auto | <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("inset-start", "min-content");
+
+test_invalid_value("inset-start", "60");
+test_invalid_value("inset-start", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/inset-start-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing inset-start with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-inset-start">
+<meta name="assert" content="inset-start supports the full grammar 'auto | <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_valid_value("inset-start", "auto");
+
+test_valid_value("inset-start", "-10px");
+test_valid_value("inset-start", "-20%");
+test_valid_value("inset-start", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/left-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().left</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-left">
+<meta name="assert" content="left lengths are made absolute.">
+<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("left", "auto");
+
+test_computed_value("left", "calc(10px + 0.5em)", "30px");
+test_computed_value("left", "calc(10px - 0.5em)", "-10px");
+test_computed_value("left", "-40%");
+test_computed_value("left", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/left-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing left with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-left">
+<meta name="assert" content="left supports only the grammar 'auto | <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("left", "min-content");
+
+test_invalid_value("left", "60");
+test_invalid_value("left", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/left-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing left with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-left">
+<meta name="assert" content="left supports the full grammar 'auto | <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_valid_value("left", "auto");
+
+test_valid_value("left", "-10px");
+test_valid_value("left", "-20%");
+test_valid_value("left", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/position-computed.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().position</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-position">
+<meta name="assert" content="position 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("position", "static");
+test_computed_value("position", "relative");
+test_computed_value("position", "absolute");
+test_computed_value("position", "sticky");
+test_computed_value("position", "fixed");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/position-invalid.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing position with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-position">
+<meta name="assert" content="position supports only the grammar 'static | relative | absolute | sticky | fixed'.">
+<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("position", "auto");
+test_invalid_value("position", "static relative");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/position-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing position with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-position">
+<meta name="assert" content="position supports the full grammar 'static | relative | absolute | sticky | fixed'.">
+<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("position", "static");
+test_valid_value("position", "relative");
+test_valid_value("position", "absolute");
+test_valid_value("position", "sticky");
+test_valid_value("position", "fixed");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/right-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().right</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-right">
+<meta name="assert" content="right lengths are made absolute.">
+<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("right", "auto");
+
+test_computed_value("right", "calc(10px + 0.5em)", "30px");
+test_computed_value("right", "calc(10px - 0.5em)", "-10px");
+test_computed_value("right", "-40%");
+test_computed_value("right", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/right-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing right with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-right">
+<meta name="assert" content="right supports only the grammar 'auto | <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("right", "min-content");
+
+test_invalid_value("right", "60");
+test_invalid_value("right", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/right-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing right with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-right">
+<meta name="assert" content="right supports the full grammar 'auto | <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_valid_value("right", "auto");
+
+test_valid_value("right", "-10px");
+test_valid_value("right", "-20%");
+test_valid_value("right", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/top-computed.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().top</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-top">
+<meta name="assert" content="top lengths are made absolute.">
+<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("top", "auto");
+
+test_computed_value("top", "calc(10px + 0.5em)", "30px");
+test_computed_value("top", "calc(10px - 0.5em)", "-10px");
+test_computed_value("top", "-40%");
+test_computed_value("top", "calc(50% + 60px)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/top-invalid.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing top with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-top">
+<meta name="assert" content="top supports only the grammar 'auto | <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("top", "min-content");
+
+test_invalid_value("top", "60");
+test_invalid_value("top", "10px 20%");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/top-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing top with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-top">
+<meta name="assert" content="top supports the full grammar 'auto | <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_valid_value("top", "auto");
+
+test_valid_value("top", "-10px");
+test_valid_value("top", "-20%");
+test_valid_value("top", "calc(2em + 3ex)");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/z-index-computed.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: getComputedValue().zIndex</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-z-index">
+<meta name="assert" content="z-index computed value is the keyword auto or an integer.">
+<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 {
+    position: absolute;
+  }
+</style>
+<script>
+test_computed_value("z-index", "auto");
+test_computed_value("z-index", "-1");
+test_computed_value("z-index", "calc(3 - 2)", "1");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/z-index-invalid.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing z-index with invalid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-z-index">
+<meta name="assert" content="z-index supports only the 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_invalid_value("z-index", "none");
+test_invalid_value("z-index", "10px");
+test_invalid_value("z-index", "0.5");
+test_invalid_value("z-index", "calc(0.5)");
+
+test_invalid_value("z-index", "auto 123");
+</script>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/parsing/z-index-valid.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Positioned Layout Module Level 3: parsing z-index with valid values</title>
+<link rel="help" href="https://drafts.csswg.org/css-position/#propdef-z-index">
+<meta name="assert" content="z-index 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("z-index", "auto");
+
+test_valid_value("z-index", "-789");
+test_valid_value("z-index", "0");
+test_valid_value("z-index", "123");
+</script>
+</body>
+</html>