The Tor Browser / file diff

     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/browser/devtools/styleinspector/test/browser_ruleview_user-property-reset.js	Wed Dec 31 06:09:35 2014 +0100
     1.3 @@ -0,0 +1,90 @@
     1.4 +/* vim: set ft=javascript 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 +"use strict";
     1.9 +
    1.10 +// Test that user set style properties can be changed from the markup-view and
    1.11 +// don't survive page reload
    1.12 +
    1.13 +let TEST_PAGE = [
    1.14 +  "data:text/html,",
    1.15 +  "<p id='id1' style='width:200px;'>element 1</p>",
    1.16 +  "<p id='id2' style='width:100px;'>element 2</p>"
    1.17 +].join("");
    1.18 +
    1.19 +let test = asyncTest(function*() {
    1.20 +  yield addTab(TEST_PAGE);
    1.21 +  let {toolbox, inspector, view} = yield openRuleView();
    1.22 +
    1.23 +  yield selectNode("#id1", inspector);
    1.24 +  yield modifyRuleViewWidth("300px", view, inspector);
    1.25 +  assertRuleAndMarkupViewWidth("id1", "300px", view, inspector);
    1.26 +
    1.27 +  yield selectNode("#id2", inspector);
    1.28 +  assertRuleAndMarkupViewWidth("id2", "100px", view, inspector);
    1.29 +  yield modifyRuleViewWidth("50px", view, inspector);
    1.30 +  assertRuleAndMarkupViewWidth("id2", "50px", view, inspector);
    1.31 +
    1.32 +  yield reloadPage(inspector);
    1.33 +
    1.34 +  yield selectNode("#id1", inspector);
    1.35 +  assertRuleAndMarkupViewWidth("id1", "200px", view, inspector);
    1.36 +  yield selectNode("#id2", inspector);
    1.37 +  assertRuleAndMarkupViewWidth("id2", "100px", view, inspector);
    1.38 +});
    1.39 +
    1.40 +function getStyleRule(ruleView) {
    1.41 +  return ruleView.doc.querySelector(".ruleview-rule");
    1.42 +}
    1.43 +
    1.44 +function* modifyRuleViewWidth(value, ruleView, inspector) {
    1.45 +  info("Getting the property value element");
    1.46 +  let valueSpan = getStyleRule(ruleView).querySelector(".ruleview-propertyvalue");
    1.47 +
    1.48 +  info("Focusing the property value to set it to edit mode");
    1.49 +  let editor = yield focusEditableField(valueSpan.parentNode);
    1.50 +
    1.51 +  ok(editor.input, "The inplace-editor field is ready");
    1.52 +  info("Setting the new value");
    1.53 +  editor.input.value = value;
    1.54 +
    1.55 +  info("Pressing return and waiting for the field to blur and for the markup-view to show the mutation");
    1.56 +  let onBlur = once(editor.input, "blur", true);
    1.57 +  let onMutation = inspector.once("markupmutation");
    1.58 +  EventUtils.sendKey("return");
    1.59 +  yield onBlur;
    1.60 +  yield onMutation;
    1.61 +
    1.62 +  info("Escaping out of the new property field that has been created after the value was edited");
    1.63 +  let onNewFieldBlur = once(ruleView.doc.activeElement, "blur", true);
    1.64 +  EventUtils.sendKey("escape");
    1.65 +  yield onNewFieldBlur;
    1.66 +}
    1.67 +
    1.68 +function getContainerStyleAttrValue(id, {markup}) {
    1.69 +  let front = markup.walker.frontForRawNode(content.document.getElementById(id));
    1.70 +  let container = markup.getContainer(front);
    1.71 +
    1.72 +  let attrIndex = 0;
    1.73 +  for (let attrName of container.elt.querySelectorAll(".attr-name")) {
    1.74 +    if (attrName.textContent === "style") {
    1.75 +      return container.elt.querySelectorAll(".attr-value")[attrIndex];
    1.76 +    }
    1.77 +    attrIndex ++;
    1.78 +  }
    1.79 +}
    1.80 +
    1.81 +function assertRuleAndMarkupViewWidth(id, value, ruleView, inspector) {
    1.82 +  let valueSpan = getStyleRule(ruleView).querySelector(".ruleview-propertyvalue");
    1.83 +  is(valueSpan.textContent, value, "Rule-view style width is " + value + " as expected");
    1.84 +
    1.85 +  let attr = getContainerStyleAttrValue(id, inspector);
    1.86 +  is(attr.textContent.replace(/\s/g, ""), "width:" + value + ";", "Markup-view style attribute width is " + value);
    1.87 +}
    1.88 +
    1.89 +function reloadPage(inspector) {
    1.90 +  let onNewRoot = inspector.once("new-root");
    1.91 +  content.location.reload();
    1.92 +  return onNewRoot.then(inspector.markup._waitForChildren);
    1.93 +}