The Tor Browser: browser/devtools/styleinspector/test/browser_ruleview_edit-property

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

     1 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */

     2 /* Any copyright is dedicated to the Public Domain.

     3  http://creativecommons.org/publicdomain/zero/1.0/ */

     5 "use strict";

     7 // Test several types of rule-view property edition

     9 let test = asyncTest(function*() {

    10   yield addTab("data:text/html;charset=utf-8,browser_ruleview_ui.js");

    11   let {toolbox, inspector, view} = yield openRuleView();

    13   info("Creating the test document");

    14   let style = "" +

    15     "#testid {" +

    16     "  background-color: blue;" +

    17     "}" +

    18     ".testclass, .unmatched {" +

    19     "  background-color: green;" +

    20     "}";

    21   let styleNode = addStyle(content.document, style);

    22   content.document.body.innerHTML = "<div id='testid' class='testclass'>Styled Node</div>" +

    23                                     "<div id='testid2'>Styled Node</div>";

    25   yield selectNode("#testid", inspector);

    26   yield testEditProperty(inspector, view);

    27   yield testDisableProperty(inspector, view);

    28   yield testPropertyStillMarkedDirty(inspector, view);

    29 });

    31 function* testEditProperty(inspector, ruleView) {

    32   let idRuleEditor = ruleView.element.children[1]._ruleEditor;

    33   let propEditor = idRuleEditor.rule.textProps[0].editor;

    35   let editor = yield focusEditableField(propEditor.nameSpan);

    36   let input = editor.input;

    37   is(inplaceEditor(propEditor.nameSpan), editor, "Next focused editor should be the name editor.");

    39   ok(input.selectionStart === 0 && input.selectionEnd === input.value.length, "Editor contents are selected.");

    41   // Try clicking on the editor's input again, shouldn't cause trouble (see bug 761665).

    42   EventUtils.synthesizeMouse(input, 1, 1, {}, ruleView.doc.defaultView);

    43   input.select();

    45   info("Entering property name followed by a colon to focus the value");

    46   let onFocus = once(idRuleEditor.element, "focus", true);

    47   for (let ch of "border-color:") {

    48     EventUtils.sendChar(ch, ruleView.doc.defaultView);

    49   }

    50   yield onFocus;

    51   yield idRuleEditor.rule._applyingModifications;

    53   info("Verifying that the focused field is the valueSpan");

    54   editor = inplaceEditor(ruleView.doc.activeElement);

    55   input = editor.input;

    56   is(inplaceEditor(propEditor.valueSpan), editor, "Focus should have moved to the value.");

    57   ok(input.selectionStart === 0 && input.selectionEnd === input.value.length, "Editor contents are selected.");

    59   info("Entering a value following by a semi-colon to commit it");

    60   let onBlur = once(editor.input, "blur");

    61   for (let ch of "red;") {

    62     EventUtils.sendChar(ch, ruleView.doc.defaultView);

    63     is(propEditor.warning.hidden, true,

    64       "warning triangle is hidden or shown as appropriate");

    65   }

    66   yield onBlur;

    67   yield idRuleEditor.rule._applyingModifications;

    69   is(idRuleEditor.rule.style._rawStyle().getPropertyValue("border-color"), "red",

    70      "border-color should have been set.");

    72   let props = ruleView.element.querySelectorAll(".ruleview-property");

    73   for (let i = 0; i < props.length; i++) {

    74     is(props[i].hasAttribute("dirty"), i <= 0,

    75       "props[" + i + "] marked dirty as appropriate");

    76   }

    77 }

    79 function* testDisableProperty(inspector, ruleView) {

    80   let idRuleEditor = ruleView.element.children[1]._ruleEditor;

    81   let propEditor = idRuleEditor.rule.textProps[0].editor;

    83   info("Disabling a property");

    84   propEditor.enable.click();

    85   yield idRuleEditor.rule._applyingModifications;

    86   is(idRuleEditor.rule.style._rawStyle().getPropertyValue("border-color"), "",

    87     "Border-color should have been unset.");

    89   info("Enabling the property again");

    90   propEditor.enable.click();

    91   yield idRuleEditor.rule._applyingModifications;

    92   is(idRuleEditor.rule.style._rawStyle().getPropertyValue("border-color"), "red",

    93     "Border-color should have been reset.");

    94 }

    96 function* testPropertyStillMarkedDirty(inspector, ruleView) {

    97   // Select an unstyled node.

    98   yield selectNode("#testid2", inspector);

   100   // Select the original node again.

   101   yield selectNode("#testid", inspector);

   103   let props = ruleView.element.querySelectorAll(".ruleview-property");

   104   for (let i = 0; i < props.length; i++) {

   105     is(props[i].hasAttribute("dirty"), i <= 0,

   106       "props[" + i + "] marked dirty as appropriate");

   107   }

   108 }

The Tor Browser / file revision