tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

test-shared.js (4434B)


      1 const sheet = document.head.appendChild(document.createElement("style"));
      2 
      3 // Specify size for outer <div> to avoid unconstrained-size warnings
      4 // when writing-mode of the inner test <div> is vertical-*
      5 const wrapper = document.body.appendChild(document.createElement("div"));
      6 wrapper.style.cssText = "width:100px; height: 100px;";
      7 export const testElement = wrapper.appendChild(document.createElement("div"));
      8 testElement.id = testElement.className = "test";
      9 
     10 // Six unique overall writing modes for property-mapping purposes.
     11 export const writingModes = [
     12  {
     13    styles: [
     14      {"writing-mode": "horizontal-tb", "direction": "ltr"},
     15    ],
     16    blockStart: "top", blockEnd: "bottom", inlineStart: "left", inlineEnd: "right",
     17    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
     18    block: "vertical", inline: "horizontal" },
     19  {
     20    styles: [
     21      {"writing-mode": "horizontal-tb", "direction": "rtl"},
     22    ],
     23    blockStart: "top", blockEnd: "bottom", inlineStart: "right", inlineEnd: "left",
     24    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
     25    block: "vertical", inline: "horizontal" },
     26  {
     27    styles: [
     28      {"writing-mode": "vertical-rl", "direction": "rtl"},
     29      {"writing-mode": "sideways-rl", "direction": "rtl"},
     30    ],
     31    blockStart: "right", blockEnd: "left", inlineStart: "bottom", inlineEnd: "top",
     32    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
     33    block: "horizontal", inline: "vertical" },
     34  {
     35    styles: [
     36      {"writing-mode": "vertical-rl", "direction": "ltr"},
     37      {"writing-mode": "sideways-rl", "direction": "ltr"},
     38    ],
     39    blockStart: "right", blockEnd: "left", inlineStart: "top", inlineEnd: "bottom",
     40    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
     41    block: "horizontal", inline: "vertical" },
     42  {
     43    styles: [
     44      {"writing-mode": "vertical-lr", "direction": "rtl"},
     45    ],
     46    blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",
     47    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
     48    block: "horizontal", inline: "vertical" },
     49  {
     50    styles: [
     51      {"writing-mode": "sideways-lr", "direction": "ltr"},
     52    ],
     53    blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",
     54    over: "left", under: "right", lineLeft: "bottom", lineRight: "top",
     55    block: "horizontal", inline: "vertical" },
     56  {
     57    styles: [
     58      {"writing-mode": "vertical-lr", "direction": "ltr"},
     59    ],
     60    blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",
     61    over: "right", under: "left", lineLeft: "top", lineRight: "bottom",
     62    block: "horizontal", inline: "vertical" },
     63  {
     64    styles: [
     65      {"writing-mode": "sideways-lr", "direction": "rtl"},
     66    ],
     67    blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",
     68    over: "left", under: "right", lineLeft: "bottom", lineRight: "top",
     69    block: "horizontal", inline: "vertical" },
     70 ];
     71 
     72 // Check if logical properties work well in WebKit non-standard
     73 // '-webkit-writing-mode: horizontal-bt' mode
     74 if (CSS.supports("-webkit-writing-mode", "horizontal-bt")) {
     75  writingModes.push (
     76  {
     77    styles: [
     78      {"-webkit-writing-mode": "horizontal-bt", "direction": "ltr"},
     79    ],
     80    blockStart: "bottom", blockEnd: "top", inlineStart: "left", inlineEnd: "right",
     81    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
     82    block: "vertical", inline: "horizontal" },
     83  {
     84    styles: [
     85      {"-webkit-writing-mode": "horizontal-bt", "direction": "rtl"},
     86    ],
     87    blockStart: "bottom", blockEnd: "top", inlineStart: "right", inlineEnd: "left",
     88    over: "top", under: "bottom", lineLeft: "left", lineRight: "right",
     89    block: "vertical", inline: "horizontal" },
     90  )
     91 }
     92 
     93 export function testCSSValues(testName, style, expectedValues) {
     94  for (const [property, value] of expectedValues) {
     95    assert_equals(style.getPropertyValue(property), value, `${testName}, ${property}`);
     96  }
     97 }
     98 
     99 export function testComputedValues(testName, rules, expectedValues) {
    100  sheet.textContent = rules;
    101  const cs = getComputedStyle(testElement);
    102  testCSSValues(testName, cs, expectedValues);
    103  sheet.textContent = "";
    104 }
    105 
    106 export function makeDeclaration(object = {}, replacement = "*") {
    107  let decl = "";
    108  for (const [property, value] of Object.entries(object)) {
    109    decl += `${property.replace("*", replacement)}: ${value}; `;
    110  }
    111  return decl;
    112 }