diff options
author | WPT Sync Bot <josh+wptsync@joshmatthews.net> | 2019-01-19 20:34:46 -0500 |
---|---|---|
committer | WPT Sync Bot <josh+wptsync@joshmatthews.net> | 2019-01-19 22:33:07 -0500 |
commit | e17a773b4e78b0fe666fba2b1a73cba72f1bf2cc (patch) | |
tree | ac13f2d876fd8e8201fe962786dc4dcf837337f0 /tests/wpt/web-platform-tests/css/css-logical | |
parent | 7256d123ff9620ff1acc494888989c43b176ecee (diff) | |
download | servo-e17a773b4e78b0fe666fba2b1a73cba72f1bf2cc.tar.gz servo-e17a773b4e78b0fe666fba2b1a73cba72f1bf2cc.zip |
Update web-platform-tests to revision bf71b1f245ce34e447b7bde8ed46694574a63da7
Diffstat (limited to 'tests/wpt/web-platform-tests/css/css-logical')
-rw-r--r-- | tests/wpt/web-platform-tests/css/css-logical/logical-box-border-radius.html | 18 | ||||
-rw-r--r-- | tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js | 53 |
2 files changed, 70 insertions, 1 deletions
diff --git a/tests/wpt/web-platform-tests/css/css-logical/logical-box-border-radius.html b/tests/wpt/web-platform-tests/css/css-logical/logical-box-border-radius.html new file mode 100644 index 00000000000..81b8fa0fece --- /dev/null +++ b/tests/wpt/web-platform-tests/css/css-logical/logical-box-border-radius.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="utf-8" /> +<title>CSS Logical Properties: flow-relative border-radius</title> +<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com" /> +<link rel="help" href="https://drafts.csswg.org/css-logical-1/#border-radius-properties"> +<meta name="assert" content="This test checks the interaction of the flow-relative border-*-radius properties with the physical ones in different writing modes." /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<div id="log"></div> + +<script type="module"> +import {runTests, createCornerPropertyGroup} from "./resources/test-box-properties.js"; +runTests(createCornerPropertyGroup("border-*-radius", { + type: "length", + prerequisites: {"border-style": "solid"}, +})); +</script> diff --git a/tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js b/tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js index 1f17ff296ff..ef1854f97de 100644 --- a/tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js +++ b/tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js @@ -67,6 +67,41 @@ export function createBoxPropertyGroup(property, descriptor) { } /** + * Creates a group physical and logical box-corner properties. + * + * @param {string} property + * A string representing the property names, like "border-*-radius". + * @param {Object} descriptor + * @param {string|string[]} descriptor.type + * Describes the kind of values accepted by the property, like "length". + * Must be a key or a collection of keys from the `testValues` object. + * @param {Object={}} descriptor.prerequisites + * Represents property declarations that are needed by `property` to work. + * For example, border-width properties require a border style. + */ +export function createCornerPropertyGroup(property, descriptor) { + const logical = {}; + const physical = {}; + const shorthands = {}; + for (const logicalCorner of ["start-start", "start-end", "end-start", "end-end"]) { + const prop = property.replace("*", logicalCorner); + const [block_side, inline_side] = logicalCorner.split("-"); + const b = "block" + block_side.charAt(0).toUpperCase() + block_side.slice(1); + const i = "inline" + inline_side.charAt(0).toUpperCase() + inline_side.slice(1); + const index = b + "-" + i; // e.g. "blockStart-inlineEnd" + logical[index] = prop; + } + let prerequisites = ""; + for (const physicalCorner of ["top-left", "top-right", "bottom-left", "bottom-right"]) { + const prop = property.replace("*", physicalCorner); + physical[physicalCorner] = prop; + prerequisites += makeDeclaration(descriptor.prerequisites, physicalCorner); + } + const type = [].concat(descriptor.type); + return {logical, physical, shorthands, type, prerequisites, property}; +} + +/** * Creates a group of physical and logical sizing properties. * * @param {string} prefix @@ -101,6 +136,7 @@ export function runTests(group) { const logicals = Object.values(group.logical); const physicals = Object.values(group.physical); const shorthands = group.shorthands ? Object.entries(group.shorthands) : null; + const is_corner = group.property == "border-*-radius"; test(function() { const expected = []; @@ -141,7 +177,22 @@ export function runTests(group) { const associated = {}; for (const [logicalSide, logicalProp] of Object.entries(group.logical)) { - const physicalProp = group.physical[writingMode[logicalSide]]; + let physicalProp; + if (is_corner) { + const [ block_side, inline_side] = logicalSide.split("-"); + const physicalSide1 = writingMode[block_side]; + const physicalSide2 = writingMode[inline_side]; + let physicalCorner; + // mirror "left-top" to "top-left" etc + if (["top", "bottom"].includes(physicalSide1)) { + physicalCorner = physicalSide1 + "-" + physicalSide2; + } else { + physicalCorner = physicalSide2 + "-" + physicalSide1; + } + physicalProp = group.physical[physicalCorner]; + } else { + physicalProp = group.physical[writingMode[logicalSide]]; + } associated[logicalProp] = physicalProp; associated[physicalProp] = logicalProp; } |