tor-browser

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

browser_rules_edit-property_09.js (2630B)

      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 a newProperty editor is only created if no other editor was
      7 // previously displayed.
      8 
      9 const TEST_URI = `
     10  <style type='text/css'>
     11    #testid {
     12      background-color: blue;
     13    }
     14  </style>
     15  <div id='testid'>Styled Node</div>
     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  await selectNode("#testid", inspector);
     22  await testClickOnEmptyAreaToCloseEditor(inspector, view);
     23 });
     24 
     25 function synthesizeMouseOnEmptyArea(view) {
     26  // any text property editor will do
     27  const prop = getTextProperty(view, 1, { "background-color": "blue" });
     28  const propEditor = prop.editor;
     29  const valueContainer = propEditor.valueContainer;
     30  const valueRect = valueContainer.getBoundingClientRect();
     31  // click right next to the ";" at the end of valueContainer
     32  EventUtils.synthesizeMouse(
     33    valueContainer,
     34    valueRect.width + 1,
     35    1,
     36    {},
     37    view.styleWindow
     38  );
     39 }
     40 
     41 async function testClickOnEmptyAreaToCloseEditor(inspector, view) {
     42  // Start at the beginning: start to add a rule to the element's style
     43  // declaration, add some text, then press escape.
     44  const ruleEditor = getRuleViewRuleEditor(view, 1);
     45  const prop = getTextProperty(view, 1, { "background-color": "blue" });
     46  const propEditor = prop.editor;
     47 
     48  info("Create a property value editor");
     49  let editor = await focusEditableField(view, propEditor.valueSpan);
     50  ok(editor.input, "The inplace-editor field is ready");
     51 
     52  info(
     53    "Close the property value editor by clicking on an empty area " +
     54      "in the rule editor"
     55  );
     56  const onRuleViewChanged = view.once("ruleview-changed");
     57  let onBlur = once(editor.input, "blur");
     58  synthesizeMouseOnEmptyArea(view);
     59  await onBlur;
     60  await onRuleViewChanged;
     61  ok(!view.isEditing, "No inplace editor should be displayed in the ruleview");
     62 
     63  info("Create new newProperty editor by clicking again on the empty area");
     64  const onFocus = once(ruleEditor.element, "focus", true);
     65  synthesizeMouseOnEmptyArea(view);
     66  await onFocus;
     67  editor = inplaceEditor(ruleEditor.element.ownerDocument.activeElement);
     68  is(
     69    inplaceEditor(ruleEditor.newPropSpan),
     70    editor,
     71    "New property editor was created"
     72  );
     73 
     74  info("Close the newProperty editor by clicking again on the empty area");
     75  onBlur = once(editor.input, "blur");
     76  synthesizeMouseOnEmptyArea(view);
     77  await onBlur;
     78 
     79  ok(!view.isEditing, "No inplace editor should be displayed in the ruleview");
     80 }