The Tor Browser / file diff

     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/browser/devtools/styleeditor/test/browser_styleeditor_new.js	Wed Dec 31 06:09:35 2014 +0100
     1.3 @@ -0,0 +1,132 @@
     1.4 +/* vim: set ts=2 et sw=2 tw=80: */
     1.5 +/* Any copyright is dedicated to the Public Domain.
     1.6 +   http://creativecommons.org/publicdomain/zero/1.0/ */
     1.7 +
     1.8 +const TESTCASE_URI = TEST_BASE + "simple.html";
     1.9 +
    1.10 +let TRANSITION_CLASS = "moz-styleeditor-transitioning";
    1.11 +let TESTCASE_CSS_SOURCE = "body{background-color:red;";
    1.12 +
    1.13 +let gUI;
    1.14 +
    1.15 +function test()
    1.16 +{
    1.17 +  waitForExplicitFinish();
    1.18 +
    1.19 +  addTabAndCheckOnStyleEditorAdded(panel => gUI = panel.UI, testEditorAdded);
    1.20 +
    1.21 +  content.location = TESTCASE_URI;
    1.22 +}
    1.23 +
    1.24 +let gAddedCount = 0;  // to add new stylesheet after the 2 initial stylesheets
    1.25 +let gNewEditor;       // to make sure only one new stylesheet got created
    1.26 +let gOriginalHref;
    1.27 +
    1.28 +let checksCompleted = 0;
    1.29 +
    1.30 +function testEditorAdded(aEditor)
    1.31 +{
    1.32 +  info("added " + gAddedCount + " editors");
    1.33 +  if (++gAddedCount == 2) {
    1.34 +    waitForFocus(function () {// create a new style sheet
    1.35 +      let newButton = gPanelWindow.document.querySelector(".style-editor-newButton");
    1.36 +      ok(newButton, "'new' button exists");
    1.37 +
    1.38 +      EventUtils.synthesizeMouseAtCenter(newButton, {}, gPanelWindow);
    1.39 +    }, gPanelWindow);
    1.40 +  }
    1.41 +  if (gAddedCount < 3) {
    1.42 +    return;
    1.43 +  }
    1.44 +
    1.45 +  ok(!gNewEditor, "creating a new stylesheet triggers one EditorAdded event");
    1.46 +  gNewEditor = aEditor; // above test will fail if we get a duplicate event
    1.47 +
    1.48 +  is(gUI.editors.length, 3,
    1.49 +     "creating a new stylesheet added a new StyleEditor instance");
    1.50 +
    1.51 +  aEditor.styleSheet.once("style-applied", function() {
    1.52 +    // when changes have been completely applied to live stylesheet after transisiton
    1.53 +    ok(!content.document.documentElement.classList.contains(TRANSITION_CLASS),
    1.54 +       "StyleEditor's transition class has been removed from content");
    1.55 +
    1.56 +    if (++checksCompleted == 3) {
    1.57 +      cleanup();
    1.58 +    }
    1.59 +  });
    1.60 +
    1.61 +  aEditor.styleSheet.on("property-change", function(property) {
    1.62 +    if (property == "ruleCount") {
    1.63 +      let ruleCount = aEditor.summary.querySelector(".stylesheet-rule-count").textContent;
    1.64 +      is(parseInt(ruleCount), 1,
    1.65 +         "new editor shows 1 rule after modification");
    1.66 +
    1.67 +      if (++checksCompleted == 3) {
    1.68 +        cleanup();
    1.69 +      }
    1.70 +    }
    1.71 +  });
    1.72 +
    1.73 +  aEditor.getSourceEditor().then(testEditor);
    1.74 +}
    1.75 +
    1.76 +function testEditor(aEditor) {
    1.77 +  waitForFocus(function () {
    1.78 +  gOriginalHref = aEditor.styleSheet.href;
    1.79 +
    1.80 +  let summary = aEditor.summary;
    1.81 +
    1.82 +  ok(aEditor.sourceLoaded,
    1.83 +     "new editor is loaded when attached");
    1.84 +  ok(aEditor.isNew,
    1.85 +     "new editor has isNew flag");
    1.86 +
    1.87 +  ok(aEditor.sourceEditor.hasFocus(),
    1.88 +     "new editor has focus");
    1.89 +
    1.90 +  let summary = aEditor.summary;
    1.91 +  let ruleCount = summary.querySelector(".stylesheet-rule-count").textContent;
    1.92 +  is(parseInt(ruleCount), 0,
    1.93 +     "new editor initially shows 0 rules");
    1.94 +
    1.95 +  let computedStyle = content.getComputedStyle(content.document.body, null);
    1.96 +  is(computedStyle.backgroundColor, "rgb(255, 255, 255)",
    1.97 +     "content's background color is initially white");
    1.98 +
    1.99 +  for each (let c in TESTCASE_CSS_SOURCE) {
   1.100 +    EventUtils.synthesizeKey(c, {}, gPanelWindow);
   1.101 +  }
   1.102 +
   1.103 +  ok(aEditor.unsaved,
   1.104 +     "new editor has unsaved flag");
   1.105 +
   1.106 +  // we know that the testcase above will start a CSS transition
   1.107 +  content.addEventListener("transitionend", onTransitionEnd, false);
   1.108 +}, gPanelWindow) ;
   1.109 +}
   1.110 +
   1.111 +function onTransitionEnd() {
   1.112 +  content.removeEventListener("transitionend", onTransitionEnd, false);
   1.113 +
   1.114 +  is(gNewEditor.sourceEditor.getText(), TESTCASE_CSS_SOURCE + "}",
   1.115 +     "rule bracket has been auto-closed");
   1.116 +
   1.117 +  let computedStyle = content.getComputedStyle(content.document.body, null);
   1.118 +  is(computedStyle.backgroundColor, "rgb(255, 0, 0)",
   1.119 +     "content's background color has been updated to red");
   1.120 +
   1.121 +  if (gNewEditor) {
   1.122 +    is(gNewEditor.styleSheet.href, gOriginalHref,
   1.123 +       "style sheet href did not change");
   1.124 +  }
   1.125 +
   1.126 +  if (++checksCompleted == 3) {
   1.127 +    cleanup();
   1.128 +  }
   1.129 +}
   1.130 +
   1.131 +function cleanup() {
   1.132 +  gNewEditor = null;
   1.133 +  gUI = null;
   1.134 +  finish();
   1.135 +}