2010-05-03 Abhishek Arya <inferno@chromium.org>
[WebKit-https.git] / LayoutTests / inspector / elements-panel-styles.html
1 <html>
2 <head>
3 <link rel="stylesheet" type="text/css" href="resources/elements-panel-styles.css">
4 <script src="../http/tests/inspector/inspector-test.js"></script>
5 <script src="elements-tests.js"></script>
6 <script>
7
8 function doit()
9 {
10     function callback(result)
11     {
12         if (result instanceof Array) {
13             for (var i = 0; i < result.length; ++i) {
14                 output(result[i]);
15             }
16         } else
17             output(result);
18         notifyDone();
19     }
20     evaluateInWebInspector("frontend_dumpStyles", callback);
21 }
22
23 // Frontend functions.
24
25 function frontend_dumpStyles(testController)
26 {
27     testController.waitUntilDone();
28
29     frontend_expandDOMSubtree(WebInspector.domAgent.document);
30     testController.runAfterPendingDispatches(function() {
31         frontend_selectElementContinuation(testController);
32     });
33 }
34
35 function frontend_selectElementContinuation(testController)
36 {
37     var node = frontend_nodeForId("foo");
38     if (!node) {
39         testController.notifyDone("No node found.");
40         return;
41     }
42
43     WebInspector.updateFocusedNode(node.id);
44     testController.runAfterPendingDispatches(function() {
45         frontend_dumpSelectedNodeStyles(testController);
46     });
47 }
48
49 function frontend_dumpSelectedNodeStyles(testController)
50 {
51     var result = [];
52     var styleSections = WebInspector.panels.elements.sidebarPanes.styles.sections;
53     for (var pseudoId in styleSections) {
54         var pseudoName = WebInspector.StylesSidebarPane.PseudoIdNames[pseudoId];
55         var sections = styleSections[pseudoId];
56         for (var i = 0; i < sections.length; ++i) {
57             var section = sections[i];
58             if (section.element.previousSibling && section.element.previousSibling.className === "styles-sidebar-separator")
59                 result.push("======== " + section.element.previousSibling.textContent + " ========");
60             result.push((section.expanded ? "[expanded] " : "[collapsed] ") + section.titleElement.textContent + " (" + section.subtitleElement.textContent + ")");
61             section.expand();
62             frontend_dumpTreeItem(section.propertiesTreeOutline, result, "");
63             result.push("");
64         }
65         result.push("");
66     }
67     testController.notifyDone(result);
68 }
69
70 function frontend_dumpTreeItem(treeItem, result, prefix)
71 {
72     var children = treeItem.children;
73     for (var i = 0; i < children.length; ++i) {
74         var treeItem = children[i];
75         if (treeItem.listItemElement.hasStyleClass("inherited"))
76             continue;
77         var overloadedPrefix = "";
78         if (treeItem.listItemElement.hasStyleClass("overloaded"))
79             overloadedPrefix = "/-- overloaded --/ ";
80         result.push(prefix + overloadedPrefix + treeItem.listItemElement.textContent);
81         treeItem.expand();
82         frontend_dumpTreeItem(treeItem, result, prefix + "> ");
83     }
84 }
85 </script>
86 </head>
87
88 <body onload="onload()">
89 <p>
90 Tests that elements panel shows proper styles in the sidebar panel.
91 </p>
92
93 <div id="container">
94     <div id="foo" class="foo" style="display:none">Foo</div>
95 </div>
96
97 </body>
98 </html>