The Tor Browser: browser/devtools/styleeditor/test/browser_styleeditor

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

     1 /* vim: set 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 const TESTCASE_URI = TEST_BASE + "simple.html";

     7 let TRANSITION_CLASS = "moz-styleeditor-transitioning";

     8 let TESTCASE_CSS_SOURCE = "body{background-color:red;";

    10 let gUI;

    12 function test()

    13 {

    14   waitForExplicitFinish();

    16   addTabAndCheckOnStyleEditorAdded(panel => gUI = panel.UI, testEditorAdded);

    18   content.location = TESTCASE_URI;

    19 }

    21 let gAddedCount = 0;  // to add new stylesheet after the 2 initial stylesheets

    22 let gNewEditor;       // to make sure only one new stylesheet got created

    23 let gOriginalHref;

    25 let checksCompleted = 0;

    27 function testEditorAdded(aEditor)

    28 {

    29   info("added " + gAddedCount + " editors");

    30   if (++gAddedCount == 2) {

    31     waitForFocus(function () {// create a new style sheet

    32       let newButton = gPanelWindow.document.querySelector(".style-editor-newButton");

    33       ok(newButton, "'new' button exists");

    35       EventUtils.synthesizeMouseAtCenter(newButton, {}, gPanelWindow);

    36     }, gPanelWindow);

    37   }

    38   if (gAddedCount < 3) {

    39     return;

    40   }

    42   ok(!gNewEditor, "creating a new stylesheet triggers one EditorAdded event");

    43   gNewEditor = aEditor; // above test will fail if we get a duplicate event

    45   is(gUI.editors.length, 3,

    46      "creating a new stylesheet added a new StyleEditor instance");

    48   aEditor.styleSheet.once("style-applied", function() {

    49     // when changes have been completely applied to live stylesheet after transisiton

    50     ok(!content.document.documentElement.classList.contains(TRANSITION_CLASS),

    51        "StyleEditor's transition class has been removed from content");

    53     if (++checksCompleted == 3) {

    54       cleanup();

    55     }

    56   });

    58   aEditor.styleSheet.on("property-change", function(property) {

    59     if (property == "ruleCount") {

    60       let ruleCount = aEditor.summary.querySelector(".stylesheet-rule-count").textContent;

    61       is(parseInt(ruleCount), 1,

    62          "new editor shows 1 rule after modification");

    64       if (++checksCompleted == 3) {

    65         cleanup();

    66       }

    67     }

    68   });

    70   aEditor.getSourceEditor().then(testEditor);

    71 }

    73 function testEditor(aEditor) {

    74   waitForFocus(function () {

    75   gOriginalHref = aEditor.styleSheet.href;

    77   let summary = aEditor.summary;

    79   ok(aEditor.sourceLoaded,

    80      "new editor is loaded when attached");

    81   ok(aEditor.isNew,

    82      "new editor has isNew flag");

    84   ok(aEditor.sourceEditor.hasFocus(),

    85      "new editor has focus");

    87   let summary = aEditor.summary;

    88   let ruleCount = summary.querySelector(".stylesheet-rule-count").textContent;

    89   is(parseInt(ruleCount), 0,

    90      "new editor initially shows 0 rules");

    92   let computedStyle = content.getComputedStyle(content.document.body, null);

    93   is(computedStyle.backgroundColor, "rgb(255, 255, 255)",

    94      "content's background color is initially white");

    96   for each (let c in TESTCASE_CSS_SOURCE) {

    97     EventUtils.synthesizeKey(c, {}, gPanelWindow);

    98   }

   100   ok(aEditor.unsaved,

   101      "new editor has unsaved flag");

   103   // we know that the testcase above will start a CSS transition

   104   content.addEventListener("transitionend", onTransitionEnd, false);

   105 }, gPanelWindow) ;

   106 }

   108 function onTransitionEnd() {

   109   content.removeEventListener("transitionend", onTransitionEnd, false);

   111   is(gNewEditor.sourceEditor.getText(), TESTCASE_CSS_SOURCE + "}",

   112      "rule bracket has been auto-closed");

   114   let computedStyle = content.getComputedStyle(content.document.body, null);

   115   is(computedStyle.backgroundColor, "rgb(255, 0, 0)",

   116      "content's background color has been updated to red");

   118   if (gNewEditor) {

   119     is(gNewEditor.styleSheet.href, gOriginalHref,

   120        "style sheet href did not change");

   121   }

   123   if (++checksCompleted == 3) {

   124     cleanup();

   125   }

   126 }

   128 function cleanup() {

   129   gNewEditor = null;

   130   gUI = null;

   131   finish();

   132 }

The Tor Browser / file revision