tor-browser

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

test_css-logic-getCssPath.html (2619B)

      1 <!DOCTYPE HTML>
      2 <html>
      3 <!--
      4 https://bugzilla.mozilla.org/show_bug.cgi?id=1323700
      5 -->
      6 <head>
      7  <meta charset="utf-8">
      8  <title>Test for Bug 1323700</title>
      9 
     10  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
     11  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
     12  <script type="application/javascript">
     13 "use strict";
     14 
     15 const { require } = ChromeUtils.importESModule("resource://devtools/shared/loader/Loader.sys.mjs");
     16 const CssLogic = require("devtools/shared/inspector/css-logic");
     17 
     18 var _tests = [];
     19 function addTest(test) {
     20  _tests.push(test);
     21 }
     22 
     23 function runNextTest() {
     24  if (!_tests.length) {
     25    SimpleTest.finish()
     26    return;
     27  }
     28  _tests.shift()();
     29 }
     30 
     31 window.onload = function() {
     32  SimpleTest.waitForExplicitFinish();
     33  runNextTest();
     34 }
     35 
     36 addTest(function getCssPathForUnattachedElement() {
     37  const unattached = document.createElement("div");
     38  unattached.id = "unattached";
     39  is(CssLogic.getCssPath(unattached), "", "Unattached node returns empty string");
     40 
     41  const unattachedChild = document.createElement("div");
     42  unattached.appendChild(unattachedChild);
     43  is(CssLogic.getCssPath(unattachedChild), "", "Unattached child returns empty string");
     44 
     45  const unattachedBody = document.createElement("body");
     46  is(CssLogic.getCssPath(unattachedBody), "", "Unattached body returns empty string");
     47 
     48  runNextTest();
     49 });
     50 
     51 addTest(function cssPathHasOneStepForEachAncestor() {
     52  for (const el of [...document.querySelectorAll('*')]) {
     53    const splitPath = CssLogic.getCssPath(el).split(" ");
     54 
     55    let expectedNbOfParts = 0;
     56    let parent = el.parentNode;
     57    while (parent) {
     58      expectedNbOfParts ++;
     59      parent = parent.parentNode;
     60    }
     61 
     62    is(splitPath.length, expectedNbOfParts, "There are enough parts in the full path");
     63  }
     64 
     65  runNextTest();
     66 });
     67 
     68 addTest(function getCssPath() {
     69  const data = [{
     70    selector: "#id",
     71    path: "html body div div div.class div#id"
     72  }, {
     73    selector: "html",
     74    path: "html"
     75  }, {
     76    selector: "body",
     77    path: "html body"
     78  }, {
     79    selector: ".c1.c2.c3",
     80    path: "html body span.c1.c2.c3"
     81  }, {
     82    selector: "#i",
     83    path: "html body span#i.c1.c2"
     84  }];
     85 
     86  for (const {selector, path} of data) {
     87    const node = document.querySelector(selector);
     88    is (CssLogic.getCssPath(node), path, `Full css path is correct for ${selector}`);
     89  }
     90 
     91  runNextTest();
     92 });
     93  </script>
     94 </head>
     95 <body>
     96  <div>
     97    <div>
     98      <div class="class">
     99        <div id="id"></div>
    100      </div>
    101    </div>
    102  </div>
    103  <span class="c1 c2 c3"></span>
    104  <span id="i" class="c1 c2"></span>
    105 </body>
    106 </html>