browser/devtools/styleinspector/test/browser_ruleview_refresh-on-attribute-change_01.js

branch
TOR_BUG_3246
changeset 5
4ab42b5ab56c
equal deleted inserted replaced
-1:000000000000 0:2d33672945b7
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/ */
4
5 "use strict";
6
7 // Test that changing the current element's attributes refreshes the rule-view
8
9 let test = asyncTest(function*() {
10 yield addTab("data:text/html;charset=utf-8,browser_ruleview_refresh-on-attribute-change.js");
11
12 info("Preparing the test document and node");
13 let style = '' +
14 '#testid {' +
15 ' background-color: blue;' +
16 '} ' +
17 '.testclass {' +
18 ' background-color: green;' +
19 '}';
20 let styleNode = addStyle(content.document, style);
21 content.document.body.innerHTML = '<div id="testid" class="testclass">Styled Node</div>';
22 let testElement = getNode("#testid");
23 let elementStyle = 'margin-top: 1px; padding-top: 5px;'
24 testElement.setAttribute("style", elementStyle);
25
26 let {toolbox, inspector, view} = yield openRuleView();
27 yield selectNode(testElement, inspector);
28
29 info("Checking that the rule-view has the element, #testid and .testclass selectors");
30 checkRuleViewContent(view, ["element", "#testid", ".testclass"]);
31
32 info("Changing the node's ID attribute and waiting for the rule-view refresh");
33 let ruleViewRefreshed = inspector.once("rule-view-refreshed");
34 testElement.setAttribute("id", "differentid");
35 yield ruleViewRefreshed;
36
37 info("Checking that the rule-view doesn't have the #testid selector anymore");
38 checkRuleViewContent(view, ["element", ".testclass"]);
39
40 info("Reverting the ID attribute change");
41 let ruleViewRefreshed = inspector.once("rule-view-refreshed");
42 testElement.setAttribute("id", "testid");
43 yield ruleViewRefreshed;
44
45 info("Checking that the rule-view has all the selectors again");
46 checkRuleViewContent(view, ["element", "#testid", ".testclass"]);
47 });
48
49 function checkRuleViewContent(view, expectedSelectors) {
50 let selectors = view.doc.querySelectorAll(".ruleview-selector");
51
52 is(selectors.length, expectedSelectors.length,
53 expectedSelectors.length + " selectors are displayed");
54
55 for (let i = 0; i < expectedSelectors.length; i ++) {
56 is(selectors[i].textContent.indexOf(expectedSelectors[i]), 0,
57 "Selector " + (i + 1) + " is " + expectedSelectors[i]);
58 }
59 }

mercurial