tor-browser

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

browser_rules_edit-selector_06.js (2676B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Testing selector inplace-editor behaviors in the rule-view with unmatched
      7 // selectors
      8 
      9 const TEST_URI = `
     10  <style type="text/css">
     11    .testclass {
     12      text-align: center;
     13    }
     14    div {
     15    }
     16  </style>
     17  <div class="testclass">Styled Node</div>
     18 `;
     19 
     20 add_task(async function () {
     21  await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
     22  const { inspector, view } = await openRuleView();
     23  await selectNode(".testclass", inspector);
     24  await testEditClassSelector(view);
     25  await testEditDivSelector(view);
     26 });
     27 
     28 async function testEditClassSelector(view) {
     29  let ruleEditor = getRuleViewRuleEditor(view, 1);
     30  const editor = await focusEditableField(view, ruleEditor.selectorText);
     31 
     32  editor.input.value = "body";
     33  const onRuleViewChanged = once(view, "ruleview-changed");
     34  EventUtils.synthesizeKey("KEY_Tab");
     35  await onRuleViewChanged;
     36 
     37  // Get the new rule editor that replaced the original
     38  ruleEditor = getRuleViewRuleEditor(view, 1);
     39  const propEditor = ruleEditor.rule.textProps[0].editor;
     40 
     41  info("Check that the correct rules are visible");
     42  is(view._elementStyle.rules.length, 3, "Should have 3 rules.");
     43  ok(ruleEditor.element.getAttribute("unmatched"), "Rule editor is unmatched.");
     44  is(
     45    getRuleViewRule(view, ".testclass"),
     46    undefined,
     47    "Rule with .testclass selector should not exist."
     48  );
     49  ok(getRuleViewRule(view, "body"), "Rule with body selector exists.");
     50  is(
     51    inplaceEditor(propEditor.nameSpan),
     52    inplaceEditor(view.styleDocument.activeElement),
     53    "Focus should have moved to the property name."
     54  );
     55 }
     56 
     57 async function testEditDivSelector(view) {
     58  let ruleEditor = getRuleViewRuleEditor(view, 2);
     59  const editor = await focusEditableField(view, ruleEditor.selectorText);
     60 
     61  editor.input.value = "asdf";
     62  const onRuleViewChanged = once(view, "ruleview-changed");
     63  EventUtils.synthesizeKey("KEY_Tab");
     64  await onRuleViewChanged;
     65 
     66  // Get the new rule editor that replaced the original
     67  ruleEditor = getRuleViewRuleEditor(view, 2);
     68 
     69  info("Check that the correct rules are visible");
     70  is(view._elementStyle.rules.length, 3, "Should have 3 rules.");
     71  ok(ruleEditor.element.getAttribute("unmatched"), "Rule editor is unmatched.");
     72  is(
     73    getRuleViewRule(view, "div"),
     74    undefined,
     75    "Rule with div selector should not exist."
     76  );
     77  ok(getRuleViewRule(view, "asdf"), "Rule with asdf selector exists.");
     78  is(
     79    inplaceEditor(ruleEditor.newPropSpan),
     80    inplaceEditor(view.styleDocument.activeElement),
     81    "Focus should have moved to the property name."
     82  );
     83 }