devtools/server/tests/chrome/inactive-property-helper/column-span.mjs

   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: `column-span`  test cases.
   6 const tests = [
   7   {
   8     info: `column-span is active on an element within a multi-column container established by columns property`,
   9     property: "column-span",
  10     createTestElement,
  11     tagName: "div",
  12     rules: [
  13       `#multicol-container { columns:2; }`,
  14       `#multicol-item { column-span: all; }`,
  15     ],
  16     isActive: true,
  17   },
  18   {
  19     info: `column-span is active on an element within a multi-column container established by column-count property`,
  20     property: "column-span",
  21     createTestElement,
  22     tagName: "div",
  23     rules: [
  24       `#multicol-container { column-count: 2; }`,
  25       `#multicol-item { column-span: all; }`,
  26     ],
  27     isActive: true,
  28   },
  29   {
  30     info: `column-span is active on an element within a multi-column container established by column-width property`,
  31     property: "column-span",
  32     createTestElement,
  33     tagName: "div",
  34     rules: [
  35       `#multicol-container { column-width: 100px; }`,
  36       `#multicol-item { column-span: all; }`,
  37     ],
  38     isActive: true,
  39   },
  40   {
  41     info: `column-span is inactive on an element outside a multi-column container`,
  42     property: "column-span",
  43     createTestElement,
  44     tagName: "div",
  45     rules: [`#multicol-item { column-span: all; }`],
  46     isActive: false,
  47   },
  48 ];
  49
  50 function createTestElement(rootNode) {
  51   const container = document.createElement("div");
  52   container.id = "multicol-container";
  53   const wrapper = document.createElement("div");
  54   const element = document.createElement("div");
  55   element.id = "multicol-item";
  56   wrapper.append(element);
  57   container.append(wrapper);
  58   rootNode.append(container);
  59
  60   return element;
  61 }
  62
  63 export default tests;