tor-browser

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

self-position-properties.mjs (2987B)


      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      4 
      5 // InactivePropertyHelper test cases:
      6 // `justify-self`, `align-self` and `place-self`.
      7 let tests = [
      8  {
      9    info: `"justify-self" is inactive on a flex item`,
     10    property: "justify-self",
     11    createTestElement,
     12    rules: [
     13      `#container { display:flex; }`,
     14      `#container-item { justify-self: start; }`,
     15    ],
     16    ruleIndex: 1,
     17    isActive: false,
     18  },
     19  {
     20    info: `"justify-self" is inactive on a block`,
     21    property: "justify-self",
     22    tagName: `div`,
     23    rules: [`div { display:block; justify-self: start; }`],
     24    isActive: false,
     25  },
     26  {
     27    info: `"justify-self" is active on an absolutely positioned element`,
     28    property: "justify-self",
     29    tagName: `div`,
     30    rules: [`div { display:block; justify-self: start; position: absolute;}`],
     31    isActive: true,
     32  },
     33  {
     34    info: `"justify-self" is active on a grid item`,
     35    property: "justify-self",
     36    createTestElement,
     37    rules: [
     38      `#container { display:grid; }`,
     39      `#container-item { justify-self: start; }`,
     40    ],
     41    ruleIndex: 1,
     42    isActive: true,
     43  },
     44 ];
     45 
     46 for (const { propertyName, propertyValue } of [
     47  { propertyName: "align-self", propertyValue: "auto" },
     48  { propertyName: "place-self", propertyValue: "auto center" },
     49 ]) {
     50  tests = tests.concat(createTestsForProp(propertyName, propertyValue));
     51 }
     52 
     53 function createTestsForProp(propertyName, propertyValue) {
     54  return [
     55    {
     56      info: `${propertyName} is active on a grid item`,
     57      property: `${propertyName}`,
     58      createTestElement,
     59      rules: [
     60        `#container { display:grid; grid:auto/100px 100px; }`,
     61        `#container-item { ${propertyName}: ${propertyValue}; }`,
     62      ],
     63      ruleIndex: 1,
     64      isActive: true,
     65    },
     66    {
     67      info: `${propertyName} is active on a flex item`,
     68      property: `${propertyName}`,
     69      createTestElement,
     70      rules: [
     71        `#container { display:flex; }`,
     72        `#container-item { ${propertyName}: ${propertyValue}; }`,
     73      ],
     74      ruleIndex: 1,
     75      isActive: true,
     76    },
     77    {
     78      info: `${propertyName} is active on absolutely positioned item`,
     79      property: `${propertyName}`,
     80      tagName: `div`,
     81      rules: [`div { ${propertyName}: ${propertyValue}; position: absolute; }`],
     82      isActive: true,
     83    },
     84    {
     85      info: `${propertyName} is inactive on non-(grid|flex|abs) item`,
     86      property: `${propertyName}`,
     87      tagName: `div`,
     88      rules: [`div { ${propertyName}: ${propertyValue}; }`],
     89      isActive: false,
     90    },
     91  ];
     92 }
     93 
     94 function createTestElement(rootNode) {
     95  const container = document.createElement("div");
     96  container.id = "container";
     97  const element = document.createElement("div");
     98  element.id = "container-item";
     99  container.append(element);
    100  rootNode.append(container);
    101 
    102  return element;
    103 }
    104 
    105 export default tests;