1 files changed, 112 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-logical/resources/test-shared.js b/testing/web-platform/tests/css/css-logical/resources/test-shared.js
new file mode 100644
index 0000000000..7a1da2e649
--- /dev/null
+++ b/testing/web-platform/tests/css/css-logical/resources/test-shared.js
@@ -0,0 +1,112 @@
+const sheet = document.head.appendChild(document.createElement("style"));
+
+// Specify size for outer <div> to avoid unconstrained-size warnings
+// when writing-mode of the inner test <div> is vertical-*
+const wrapper = document.body.appendChild(document.createElement("div"));
+wrapper.style.cssText = "width:100px; height: 100px;";
+export const testElement = wrapper.appendChild(document.createElement("div"));
+testElement.id = testElement.className = "test";
+
+// Six unique overall writing modes for property-mapping purposes.
+export const writingModes = [
+  {
+    styles: [
+      {"writing-mode": "horizontal-tb", "direction": "ltr"},
+    ],
+    blockStart: "top", blockEnd: "bottom", inlineStart: "left", inlineEnd: "right",
+    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
+    block: "vertical", inline: "horizontal" },
+  {
+    styles: [
+      {"writing-mode": "horizontal-tb", "direction": "rtl"},
+    ],
+    blockStart: "top", blockEnd: "bottom", inlineStart: "right", inlineEnd: "left",
+    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
+    block: "vertical", inline: "horizontal" },
+  {
+    styles: [
+      {"writing-mode": "vertical-rl", "direction": "rtl"},
+      {"writing-mode": "sideways-rl", "direction": "rtl"},
+    ],
+    blockStart: "right", blockEnd: "left", inlineStart: "bottom", inlineEnd: "top",
+    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
+    block: "horizontal", inline: "vertical" },
+  {
+    styles: [
+      {"writing-mode": "vertical-rl", "direction": "ltr"},
+      {"writing-mode": "sideways-rl", "direction": "ltr"},
+    ],
+    blockStart: "right", blockEnd: "left", inlineStart: "top", inlineEnd: "bottom",
+    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
+    block: "horizontal", inline: "vertical" },
+  {
+    styles: [
+      {"writing-mode": "vertical-lr", "direction": "rtl"},
+    ],
+    blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",
+    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
+    block: "horizontal", inline: "vertical" },
+  {
+    styles: [
+      {"writing-mode": "sideways-lr", "direction": "ltr"},
+    ],
+    blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",
+    over: "left", under: "right", lineLeft: "bottom", lineRight: "top",
+    block: "horizontal", inline: "vertical" },
+  {
+    styles: [
+      {"writing-mode": "vertical-lr", "direction": "ltr"},
+    ],
+    blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",
+    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
+    block: "horizontal", inline: "vertical" },
+  {
+    styles: [
+      {"writing-mode": "sideways-lr", "direction": "rtl"},
+    ],
+    blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",
+    over: "left", under: "right", lineLeft: "bottom", lineRight: "top",
+    block: "horizontal", inline: "vertical" },
+];
+
+// Check if logical properties work well in WebKit non-standard
+// '-webkit-writing-mode: horizontal-bt' mode
+if (CSS.supports("-webkit-writing-mode", "horizontal-bt")) {
+  writingModes.push (
+  {
+    styles: [
+      {"-webkit-writing-mode": "horizontal-bt", "direction": "ltr"},
+    ],
+    blockStart: "bottom", blockEnd: "top", inlineStart: "left", inlineEnd: "right",
+    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
+    block: "vertical", inline: "horizontal" },
+  {
+    styles: [
+      {"-webkit-writing-mode": "horizontal-bt", "direction": "rtl"},
+    ],
+    blockStart: "bottom", blockEnd: "top", inlineStart: "right", inlineEnd: "left",
+    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
+    block: "vertical", inline: "horizontal" },
+  )
+}
+
+export function testCSSValues(testName, style, expectedValues) {
+  for (const [property, value] of expectedValues) {
+    assert_equals(style.getPropertyValue(property), value, `${testName}, ${property}`);
+  }
+}
+
+export function testComputedValues(testName, rules, expectedValues) {
+  sheet.textContent = rules;
+  const cs = getComputedStyle(testElement);
+  testCSSValues(testName, cs, expectedValues);
+  sheet.textContent = "";
+}
+
+export function makeDeclaration(object = {}, replacement = "*") {
+  let decl = "";
+  for (const [property, value] of Object.entries(object)) {
+    decl += `${property.replace("*", replacement)}: ${value}; `;
+  }
+  return decl;
+}