Web Inspector: InspectorTimelineAgent doesn't need to recompile functions because...
[WebKit-https.git] / LayoutTests / inspector / layers / layers-reflected-content.html
1 <html>
2 <head>
3 <script type="text/javascript" src="../../http/tests/inspector/resources/protocol-test.js"></script>
4 <script type="text/javascript">
5
6 function test()
7 {
8
9     var nodes;
10  
11     InspectorProtocol.eventHandler["DOM.setChildNodes"] = setChildNodes;
12
13     enableLayerTreeAgent();
14     
15     function enableLayerTreeAgent(result)
16     {
17         step({
18             name: "Enable the LayerTree agent",
19             command: "LayerTree.enable",
20             parameters: {},
21             callback: getDocument
22         });
23     };
24
25     function getDocument()
26     {
27         // We must first get the document so that later on we may get sensible nodeIds.
28         step({
29             name: "Get the Document",
30             command: "DOM.getDocument",
31             parameters: {},
32             callback: getLayerTree
33         });
34     };
35
36     function getLayerTree(result)
37     {
38         step({
39             name: "Get the layer tree",
40             command: "LayerTree.layersForNode",
41             parameters: {"nodeId": result.root.nodeId},
42             callback: gotLayerTree
43         });
44     };
45
46     function gotLayerTree(result)
47     {
48         var reflectedLayers = result.layers.filter(function(layer) {
49             return layer.isReflection;
50         });
51
52         logTestName("Check layers");
53
54         assert("Expected number of reflected layers", reflectedLayers.length, 1);
55         assert("First reflected layer has a node", reflectedLayers[0].nodeId > 0, true);
56
57
58         logTestName("Check reflected node");
59
60         var node;
61         var nodeId = reflectedLayers[0].nodeId;
62         for (var i = 0, count = nodes.length; i < count; ++i) {
63             if (nodes[i].nodeId === nodeId) {
64                 node = nodes[i];
65                 break;
66             }
67         }
68
69         assert("Node for layer was found", !!node, true);
70         assert("Node has expected localName", node.localName, "div");
71         assert("Node has expected number of attributes", node.attributes.length, 2);
72         assert("Node has CSS class", node.attributes[0], "class");
73         assert("Node has expected CSS class", node.attributes[1], "reflected composited");
74         
75         ProtocolTest.completeTest();
76     };
77
78     function setChildNodes (messageObject) {
79         nodes = messageObject.params.nodes;
80     };
81
82     function step(test)
83     {
84         if (test.callback)
85             logTestName(test.name);
86         runCommand(test);
87     };
88
89     function logTestName(name)
90     {
91         ProtocolTest.log("\n=== " + name + " ===\n");
92     };
93
94     function runCommand(command)
95     {
96         InspectorProtocol.sendCommand(command.command, command.parameters, function(messageObject) {
97             if (messageObject.hasOwnProperty("error")) {
98                 ProtocolTest.log("FAIL: " + messageObject.error.message + " (" + messageObject.error.code + ")");
99                 ProtocolTest.completeTest();
100                 return;
101             }
102
103             if (command.name)
104                 ProtocolTest.log("PASS");
105
106             if (command.callback)
107                 command.callback(messageObject.result);
108         });
109     };
110
111     function assert(name, actual, expected)
112     {
113         if (expected === actual)
114             ProtocolTest.log("PASS: " + name + ".");
115         else
116             ProtocolTest.log("FAIL: " + name + ". Expected " + expected + " but got " + actual);
117     };
118
119 };
120
121 window.addEventListener("DOMContentLoaded", function()
122 {
123     runTest();
124 }, false);
125
126 </script>
127 <style type="text/css">
128
129     .reflected {
130         position: absolute;
131         width: 100px;
132         height: 100px;
133         background-color: black;
134         -webkit-box-reflect: below;
135     }
136
137     .composited {
138         -webkit-transform: translateZ(0);
139     }
140
141 </style>
142 </head>
143 <body>
144
145     <div class="reflected"></div>
146     <div class="reflected composited"></div>
147
148 </body>
149 </html>