The Tor Browser / file comparison
comparison: browser/devtools/responsivedesign/test/browser_responsiveruleview.js
browser/devtools/responsivedesign/test/browser_responsiveruleview.js
- branch
- TOR_BUG_9701
- changeset 15
- b8a032363ba2
equal
deleted
inserted
replaced
| -1:000000000000 | 0:e2ddbe820031 |
|---|---|
| 1 /* Any copyright is dedicated to the Public Domain. | |
| 2 http://creativecommons.org/publicdomain/zero/1.0/ */ | |
| 3 | |
| 4 function test() { | |
| 5 let instance; | |
| 6 | |
| 7 let ruleView; | |
| 8 let inspector; | |
| 9 let mgr = ResponsiveUI.ResponsiveUIManager; | |
| 10 | |
| 11 waitForExplicitFinish(); | |
| 12 | |
| 13 gBrowser.selectedTab = gBrowser.addTab(); | |
| 14 gBrowser.selectedBrowser.addEventListener("load", function onload() { | |
| 15 gBrowser.selectedBrowser.removeEventListener("load", onload, true); | |
| 16 waitForFocus(startTest, content); | |
| 17 }, true); | |
| 18 | |
| 19 content.location = "data:text/html;charset=utf-8,<html><style>" + | |
| 20 "div {" + | |
| 21 " width: 500px;" + | |
| 22 " height: 10px;" + | |
| 23 " background: purple;" + | |
| 24 "} " + | |
| 25 "@media screen and (max-width: 200px) {" + | |
| 26 " div { " + | |
| 27 " width: 100px;" + | |
| 28 " }" + | |
| 29 "};" + | |
| 30 "</style><div></div></html>" | |
| 31 | |
| 32 function numberOfRules() { | |
| 33 return ruleView.element.querySelectorAll(".ruleview-code").length; | |
| 34 } | |
| 35 | |
| 36 function startTest() { | |
| 37 document.getElementById("Tools:ResponsiveUI").doCommand(); | |
| 38 executeSoon(onUIOpen); | |
| 39 } | |
| 40 | |
| 41 function onUIOpen() { | |
| 42 instance = gBrowser.selectedTab.__responsiveUI; | |
| 43 ok(instance, "instance of the module is attached to the tab."); | |
| 44 | |
| 45 instance.stack.setAttribute("notransition", "true"); | |
| 46 registerCleanupFunction(function() { | |
| 47 instance.stack.removeAttribute("notransition"); | |
| 48 }); | |
| 49 | |
| 50 instance.setSize(500, 500); | |
| 51 | |
| 52 openRuleView().then(onInspectorUIOpen); | |
| 53 } | |
| 54 | |
| 55 function onInspectorUIOpen(args) { | |
| 56 inspector = args.inspector; | |
| 57 ruleView = args.view; | |
| 58 ok(inspector, "Got inspector instance"); | |
| 59 | |
| 60 let div = content.document.getElementsByTagName("div")[0]; | |
| 61 inspector.selection.setNode(div); | |
| 62 inspector.once("inspector-updated", testShrink); | |
| 63 } | |
| 64 | |
| 65 function testShrink() { | |
| 66 | |
| 67 is(numberOfRules(), 2, "Should have two rules initially."); | |
| 68 | |
| 69 ruleView.element.addEventListener("CssRuleViewRefreshed", function refresh() { | |
| 70 ruleView.element.removeEventListener("CssRuleViewRefreshed", refresh, false); | |
| 71 is(numberOfRules(), 3, "Should have three rules after shrinking."); | |
| 72 testGrow(); | |
| 73 }, false); | |
| 74 | |
| 75 instance.setSize(100, 100); | |
| 76 } | |
| 77 | |
| 78 function testGrow() { | |
| 79 ruleView.element.addEventListener("CssRuleViewRefreshed", function refresh() { | |
| 80 ruleView.element.removeEventListener("CssRuleViewRefreshed", refresh, false); | |
| 81 is(numberOfRules(), 2, "Should have two rules after growing."); | |
| 82 testEscapeCloses(); | |
| 83 }, false); | |
| 84 | |
| 85 instance.setSize(500, 500); | |
| 86 } | |
| 87 | |
| 88 function testEscapeCloses() { | |
| 89 is(document.getElementById("Tools:ResponsiveUI").getAttribute("checked"), "true", "menu checked"); | |
| 90 ok(!inspector._toolbox._splitConsole, "Console is not split."); | |
| 91 | |
| 92 mgr.once("off", function() {executeSoon(finishUp)}); | |
| 93 EventUtils.synthesizeKey("VK_ESCAPE", {}); | |
| 94 } | |
| 95 | |
| 96 function finishUp() { | |
| 97 ok(!inspector._toolbox._splitConsole, "Console is still not split after pressing escape."); | |
| 98 | |
| 99 // Menus are correctly updated? | |
| 100 is(document.getElementById("Tools:ResponsiveUI").getAttribute("checked"), "false", "menu unchecked"); | |
| 101 | |
| 102 gBrowser.removeCurrentTab(); | |
| 103 finish(); | |
| 104 } | |
| 105 } |
