The Tor Browser / file comparison
comparison: browser/devtools/responsivedesign/test/browser_responsivecomputedview.js
browser/devtools/responsivedesign/test/browser_responsivecomputedview.js
- branch
- TOR_BUG_9701
- changeset 11
- deefc01c0e14
equal
deleted
inserted
replaced
| -1:000000000000 | 0:322e58934f99 |
|---|---|
| 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 computedView; | |
| 8 let inspector; | |
| 9 | |
| 10 waitForExplicitFinish(); | |
| 11 | |
| 12 gBrowser.selectedTab = gBrowser.addTab(); | |
| 13 gBrowser.selectedBrowser.addEventListener("load", function onload() { | |
| 14 gBrowser.selectedBrowser.removeEventListener("load", onload, true); | |
| 15 waitForFocus(startTest, content); | |
| 16 }, true); | |
| 17 | |
| 18 content.location = "data:text/html;charset=utf-8,<html><style>" + | |
| 19 "div {" + | |
| 20 " width: 500px;" + | |
| 21 " height: 10px;" + | |
| 22 " background: purple;" + | |
| 23 "} " + | |
| 24 "@media screen and (max-width: 200px) {" + | |
| 25 " div { " + | |
| 26 " width: 100px;" + | |
| 27 " }" + | |
| 28 "};" + | |
| 29 "</style><div></div></html>" | |
| 30 | |
| 31 function computedWidth() { | |
| 32 for (let prop of computedView.propertyViews) { | |
| 33 if (prop.name === "width") { | |
| 34 return prop.valueNode.textContent; | |
| 35 } | |
| 36 } | |
| 37 return null; | |
| 38 } | |
| 39 | |
| 40 function startTest() { | |
| 41 document.getElementById("Tools:ResponsiveUI").doCommand(); | |
| 42 executeSoon(onUIOpen); | |
| 43 } | |
| 44 | |
| 45 function onUIOpen() { | |
| 46 instance = gBrowser.selectedTab.__responsiveUI; | |
| 47 ok(instance, "instance of the module is attached to the tab."); | |
| 48 | |
| 49 instance.stack.setAttribute("notransition", "true"); | |
| 50 registerCleanupFunction(function() { | |
| 51 instance.stack.removeAttribute("notransition"); | |
| 52 }); | |
| 53 | |
| 54 instance.setSize(500, 500); | |
| 55 | |
| 56 openComputedView().then(onInspectorUIOpen); | |
| 57 } | |
| 58 | |
| 59 function onInspectorUIOpen(args) { | |
| 60 inspector = args.inspector; | |
| 61 computedView = args.view; | |
| 62 ok(inspector, "Got inspector instance"); | |
| 63 | |
| 64 let div = content.document.getElementsByTagName("div")[0]; | |
| 65 | |
| 66 inspector.selection.setNode(div); | |
| 67 inspector.once("inspector-updated", testShrink); | |
| 68 } | |
| 69 | |
| 70 function testShrink() { | |
| 71 is(computedWidth(), "500px", "Should show 500px initially."); | |
| 72 | |
| 73 inspector.once("computed-view-refreshed", function onShrink() { | |
| 74 is(computedWidth(), "100px", "div should be 100px after shrinking."); | |
| 75 testGrow(); | |
| 76 }); | |
| 77 | |
| 78 instance.setSize(100, 100); | |
| 79 } | |
| 80 | |
| 81 function testGrow() { | |
| 82 inspector.once("computed-view-refreshed", function onGrow() { | |
| 83 is(computedWidth(), "500px", "Should be 500px after growing."); | |
| 84 finishUp(); | |
| 85 }); | |
| 86 | |
| 87 instance.setSize(500, 500); | |
| 88 } | |
| 89 | |
| 90 function finishUp() { | |
| 91 document.getElementById("Tools:ResponsiveUI").doCommand(); | |
| 92 | |
| 93 // Menus are correctly updated? | |
| 94 is(document.getElementById("Tools:ResponsiveUI").getAttribute("checked"), "false", "menu unchecked"); | |
| 95 | |
| 96 gBrowser.removeCurrentTab(); | |
| 97 finish(); | |
| 98 } | |
| 99 } |
