tor-browser

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

browser_rules_selector-highlighter_01.js (2917B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Test that the selector highlighter is created when clicking on a selector
      7 // icon in the rule view.
      8 
      9 const TEST_URI = `
     10  <style type="text/css">
     11    body, p, td {
     12      background: red;
     13    }
     14  </style>
     15  Test the selector highlighter
     16 `;
     17 
     18 add_task(async function () {
     19  await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
     20  const { inspector, view } = await openRuleView();
     21  const { waitForHighlighterTypeShown, waitForHighlighterTypeHidden } =
     22    getHighlighterTestHelpers(inspector);
     23 
     24  const activeHighlighter = inspector.highlighters.getActiveHighlighter(
     25    inspector.highlighters.TYPES.SELECTOR
     26  );
     27  ok(!activeHighlighter, "No selector highlighter is active");
     28 
     29  info("Clicking on a selector icon");
     30  let data = await clickSelectorIcon(view, "body, p, td");
     31 
     32  ok(data.highlighter, "The selector highlighter instance was created");
     33  ok(data.isShown, "The selector highlighter was shown");
     34 
     35  info("Click on the same icon to disable highlighter");
     36  data = await clickSelectorIcon(view, "body, p, td");
     37  ok(!data.isShown, "The highlighter is not visible anymore");
     38 
     39  info("Check that the selector highlighter can be toggled from the keyboard");
     40  const ruleEl = getRuleViewRule(view, "body, p, td", 0);
     41  const selectorContainerEl = ruleEl.querySelector(
     42    ".ruleview-selectors-container"
     43  );
     44  const selectorHighlighterIcon = ruleEl.querySelector(
     45    ".ruleview-selectorhighlighter"
     46  );
     47  is(
     48    selectorHighlighterIcon.getAttribute("aria-pressed"),
     49    "false",
     50    "selector highlighter icon is not pressed by default"
     51  );
     52  selectorContainerEl.focus();
     53  EventUtils.synthesizeKey("VK_TAB", {}, selectorContainerEl.ownerGlobal);
     54  await waitFor(
     55    () =>
     56      selectorContainerEl.ownerDocument.activeElement ===
     57      selectorHighlighterIcon
     58  );
     59  ok(true, "selector highlighter button can be focused");
     60 
     61  const onHighlighterShown = waitForHighlighterTypeShown(
     62    inspector.highlighters.TYPES.SELECTOR
     63  );
     64  EventUtils.synthesizeKey("VK_RETURN", {}, selectorContainerEl.ownerGlobal);
     65  data = await onHighlighterShown;
     66 
     67  ok(true, "The selector highlighter was shown from the keyboard");
     68  ok(data.highlighter, "The selector highlighter instance was created");
     69 
     70  await waitFor(
     71    () => selectorHighlighterIcon.getAttribute("aria-pressed") === "true"
     72  );
     73  ok(true, "selector highlighter icon is pressed");
     74 
     75  const onHighlighterHidden = waitForHighlighterTypeHidden(
     76    inspector.highlighters.TYPES.SELECTOR
     77  );
     78  EventUtils.synthesizeKey("VK_RETURN", {}, selectorContainerEl.ownerGlobal);
     79  await onHighlighterHidden;
     80  ok(true, "The selector highlighter was hidden from the keyboard");
     81  is(
     82    selectorHighlighterIcon.getAttribute("aria-pressed"),
     83    "false",
     84    "selector highlighter icon is no longer pressed"
     85  );
     86 });