aboutsummaryrefslogtreecommitdiffstats
path: root/tests/wpt/web-platform-tests/css/css-logical
diff options
context:
space:
mode:
authorWPT Sync Bot <josh+wptsync@joshmatthews.net>2019-01-19 20:34:46 -0500
committerWPT Sync Bot <josh+wptsync@joshmatthews.net>2019-01-19 22:33:07 -0500
commite17a773b4e78b0fe666fba2b1a73cba72f1bf2cc (patch)
treeac13f2d876fd8e8201fe962786dc4dcf837337f0 /tests/wpt/web-platform-tests/css/css-logical
parent7256d123ff9620ff1acc494888989c43b176ecee (diff)
downloadservo-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.html18
-rw-r--r--tests/wpt/web-platform-tests/css/css-logical/resources/test-box-properties.js53
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;
}