1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/browser/devtools/responsivedesign/test/browser_responsiveruleview.js Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,105 @@
1.4 +/* Any copyright is dedicated to the Public Domain.
1.5 + http://creativecommons.org/publicdomain/zero/1.0/ */
1.6 +
1.7 +function test() {
1.8 + let instance;
1.9 +
1.10 + let ruleView;
1.11 + let inspector;
1.12 + let mgr = ResponsiveUI.ResponsiveUIManager;
1.13 +
1.14 + waitForExplicitFinish();
1.15 +
1.16 + gBrowser.selectedTab = gBrowser.addTab();
1.17 + gBrowser.selectedBrowser.addEventListener("load", function onload() {
1.18 + gBrowser.selectedBrowser.removeEventListener("load", onload, true);
1.19 + waitForFocus(startTest, content);
1.20 + }, true);
1.21 +
1.22 + content.location = "data:text/html;charset=utf-8,<html><style>" +
1.23 + "div {" +
1.24 + " width: 500px;" +
1.25 + " height: 10px;" +
1.26 + " background: purple;" +
1.27 + "} " +
1.28 + "@media screen and (max-width: 200px) {" +
1.29 + " div { " +
1.30 + " width: 100px;" +
1.31 + " }" +
1.32 + "};" +
1.33 + "</style><div></div></html>"
1.34 +
1.35 + function numberOfRules() {
1.36 + return ruleView.element.querySelectorAll(".ruleview-code").length;
1.37 + }
1.38 +
1.39 + function startTest() {
1.40 + document.getElementById("Tools:ResponsiveUI").doCommand();
1.41 + executeSoon(onUIOpen);
1.42 + }
1.43 +
1.44 + function onUIOpen() {
1.45 + instance = gBrowser.selectedTab.__responsiveUI;
1.46 + ok(instance, "instance of the module is attached to the tab.");
1.47 +
1.48 + instance.stack.setAttribute("notransition", "true");
1.49 + registerCleanupFunction(function() {
1.50 + instance.stack.removeAttribute("notransition");
1.51 + });
1.52 +
1.53 + instance.setSize(500, 500);
1.54 +
1.55 + openRuleView().then(onInspectorUIOpen);
1.56 + }
1.57 +
1.58 + function onInspectorUIOpen(args) {
1.59 + inspector = args.inspector;
1.60 + ruleView = args.view;
1.61 + ok(inspector, "Got inspector instance");
1.62 +
1.63 + let div = content.document.getElementsByTagName("div")[0];
1.64 + inspector.selection.setNode(div);
1.65 + inspector.once("inspector-updated", testShrink);
1.66 + }
1.67 +
1.68 + function testShrink() {
1.69 +
1.70 + is(numberOfRules(), 2, "Should have two rules initially.");
1.71 +
1.72 + ruleView.element.addEventListener("CssRuleViewRefreshed", function refresh() {
1.73 + ruleView.element.removeEventListener("CssRuleViewRefreshed", refresh, false);
1.74 + is(numberOfRules(), 3, "Should have three rules after shrinking.");
1.75 + testGrow();
1.76 + }, false);
1.77 +
1.78 + instance.setSize(100, 100);
1.79 + }
1.80 +
1.81 + function testGrow() {
1.82 + ruleView.element.addEventListener("CssRuleViewRefreshed", function refresh() {
1.83 + ruleView.element.removeEventListener("CssRuleViewRefreshed", refresh, false);
1.84 + is(numberOfRules(), 2, "Should have two rules after growing.");
1.85 + testEscapeCloses();
1.86 + }, false);
1.87 +
1.88 + instance.setSize(500, 500);
1.89 + }
1.90 +
1.91 + function testEscapeCloses() {
1.92 + is(document.getElementById("Tools:ResponsiveUI").getAttribute("checked"), "true", "menu checked");
1.93 + ok(!inspector._toolbox._splitConsole, "Console is not split.");
1.94 +
1.95 + mgr.once("off", function() {executeSoon(finishUp)});
1.96 + EventUtils.synthesizeKey("VK_ESCAPE", {});
1.97 + }
1.98 +
1.99 + function finishUp() {
1.100 + ok(!inspector._toolbox._splitConsole, "Console is still not split after pressing escape.");
1.101 +
1.102 + // Menus are correctly updated?
1.103 + is(document.getElementById("Tools:ResponsiveUI").getAttribute("checked"), "false", "menu unchecked");
1.104 +
1.105 + gBrowser.removeCurrentTab();
1.106 + finish();
1.107 + }
1.108 +}
