1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/toolkit/devtools/server/tests/mochitest/test_styles-computed.html Wed Dec 31 06:09:35 2014 +0100 1.3 @@ -0,0 +1,142 @@ 1.4 +<!DOCTYPE HTML> 1.5 +<html> 1.6 +<!-- 1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id= 1.8 +--> 1.9 +<head> 1.10 + <meta charset="utf-8"> 1.11 + <title>Test for Bug </title> 1.12 + 1.13 + <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> 1.14 + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> 1.15 + <script type="application/javascript;version=1.8" src="inspector-helpers.js"></script> 1.16 + <script type="application/javascript;version=1.8"> 1.17 +Components.utils.import("resource://gre/modules/devtools/Loader.jsm"); 1.18 +const {Promise: promise} = Components.utils.import("resource://gre/modules/Promise.jsm", {}); 1.19 + 1.20 +const inspector = devtools.require("devtools/server/actors/inspector"); 1.21 + 1.22 +window.onload = function() { 1.23 + SimpleTest.waitForExplicitFinish(); 1.24 + runNextTest(); 1.25 +} 1.26 + 1.27 +var gWalker = null; 1.28 +var gStyles = null; 1.29 +var gClient = null; 1.30 + 1.31 +addTest(function setup() { 1.32 + let url = document.getElementById("inspectorContent").href; 1.33 + attachURL(url, function(err, client, tab, doc) { 1.34 + gInspectee = doc; 1.35 + let {InspectorFront} = devtools.require("devtools/server/actors/inspector"); 1.36 + let inspector = InspectorFront(client, tab); 1.37 + promiseDone(inspector.getWalker().then(walker => { 1.38 + ok(walker, "getWalker() should return an actor."); 1.39 + gClient = client; 1.40 + gWalker = walker; 1.41 + return inspector.getPageStyle(); 1.42 + }).then(styles => { 1.43 + gStyles = styles; 1.44 + }).then(runNextTest)); 1.45 + }); 1.46 +}); 1.47 + 1.48 +addTest(function testComputed() { 1.49 + let localNode = gInspectee.querySelector("#computed-test-node"); 1.50 + let elementStyle = null; 1.51 + promiseDone(gWalker.querySelector(gWalker.rootNode, "#computed-test-node").then(node => { 1.52 + return gStyles.getComputed(node, {}); 1.53 + }).then(computed => { 1.54 + // Test a smattering of properties that include some system-defined 1.55 + // props, some props that were defined in this node's stylesheet, 1.56 + // and some default props. 1.57 + is(computed["white-space"].value, "normal", "Default value should appear"); 1.58 + is(computed["display"].value, "block", "System stylesheet item should appear"); 1.59 + is(computed["cursor"].value, "crosshair", "Included stylesheet rule should appear"); 1.60 + is(computed["color"].value, "rgb(255, 0, 0)", "Inherited style attribute should appear"); 1.61 + is(computed["font-size"].value, "15px", "Inherited inline rule should appear"); 1.62 + 1.63 + // We didn't request markMatched, so these shouldn't be set 1.64 + ok(!computed["cursor"].matched, "Didn't ask for matched, shouldn't get it"); 1.65 + ok(!computed["color"].matched, "Didn't ask for matched, shouldn't get it"); 1.66 + ok(!computed["font-size"].matched, "Didn't ask for matched, shouldn't get it"); 1.67 + }).then(runNextTest)); 1.68 +}); 1.69 + 1.70 +addTest(function testComputedUserMatched() { 1.71 + let localNode = gInspectee.querySelector("#computed-test-node"); 1.72 + let elementStyle = null; 1.73 + promiseDone(gWalker.querySelector(gWalker.rootNode, "#computed-test-node").then(node => { 1.74 + return gStyles.getComputed(node, { filter: "user", markMatched: true }); 1.75 + }).then(computed => { 1.76 + ok(!computed["white-space"].matched, "Default style shouldn't match"); 1.77 + ok(!computed["display"].matched, "Only user styles should match"); 1.78 + ok(computed["cursor"].matched, "Asked for matched, should get it"); 1.79 + ok(computed["color"].matched, "Asked for matched, should get it"); 1.80 + ok(computed["font-size"].matched, "Asked for matched, should get it"); 1.81 + }).then(runNextTest)); 1.82 +}); 1.83 + 1.84 +addTest(function testComputedSystemMatched() { 1.85 + let localNode = gInspectee.querySelector("#computed-test-node"); 1.86 + let elementStyle = null; 1.87 + promiseDone(gWalker.querySelector(gWalker.rootNode, "#computed-test-node").then(node => { 1.88 + return gStyles.getComputed(node, { filter: "ua", markMatched: true }); 1.89 + }).then(computed => { 1.90 + ok(!computed["white-space"].matched, "Default style shouldn't match"); 1.91 + ok(computed["display"].matched, "System stylesheets should match"); 1.92 + ok(computed["cursor"].matched, "Asked for matched, should get it"); 1.93 + ok(computed["color"].matched, "Asked for matched, should get it"); 1.94 + ok(computed["font-size"].matched, "Asked for matched, should get it"); 1.95 + }).then(runNextTest)); 1.96 +}); 1.97 + 1.98 +addTest(function testComputedUserOnlyMatched() { 1.99 + let localNode = gInspectee.querySelector("#computed-test-node"); 1.100 + let elementStyle = null; 1.101 + promiseDone(gWalker.querySelector(gWalker.rootNode, "#computed-test-node").then(node => { 1.102 + return gStyles.getComputed(node, { filter: "user", onlyMatched: true }); 1.103 + }).then(computed => { 1.104 + ok(!("white-space" in computed), "Default style shouldn't exist"); 1.105 + ok(!("display" in computed), "System stylesheets shouldn't exist"); 1.106 + ok(("cursor" in computed), "User items should exist."); 1.107 + ok(("color" in computed), "User items should exist."); 1.108 + ok(("font-size" in computed), "User items should exist."); 1.109 + }).then(runNextTest)); 1.110 +}); 1.111 + 1.112 +addTest(function testComputedSystemOnlyMatched() { 1.113 + let localNode = gInspectee.querySelector("#computed-test-node"); 1.114 + let elementStyle = null; 1.115 + promiseDone(gWalker.querySelector(gWalker.rootNode, "#computed-test-node").then(node => { 1.116 + return gStyles.getComputed(node, { filter: "ua", onlyMatched: true }); 1.117 + }).then(computed => { 1.118 + ok(!("white-space" in computed), "Default style shouldn't exist"); 1.119 + ok(("display" in computed), "System stylesheets should exist"); 1.120 + ok(("cursor" in computed), "User items should exist."); 1.121 + ok(("color" in computed), "User items should exist."); 1.122 + ok(("font-size" in computed), "User items should exist."); 1.123 + }).then(runNextTest)); 1.124 +}); 1.125 + 1.126 +addTest(function cleanup() { 1.127 + delete gStyles; 1.128 + delete gWalker; 1.129 + delete gClient; 1.130 + runNextTest(); 1.131 +}); 1.132 + 1.133 + </script> 1.134 +</head> 1.135 +<body> 1.136 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=">Mozilla Bug </a> 1.137 +<a id="inspectorContent" target="_blank" href="inspector-styles-data.html">Test Document</a> 1.138 +<p id="display"></p> 1.139 +<div id="content" style="display: none"> 1.140 + 1.141 +</div> 1.142 +<pre id="test"> 1.143 +</pre> 1.144 +</body> 1.145 +</html>