Web Inspector: InspectorTimelineAgent doesn't need to recompile functions because...
[WebKit-https.git] / LayoutTests / inspector / layers / layers-generated-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 beforeLayers = [];
49         var afterLayers = [];
50         result.layers.forEach(function (layer) {
51             if (!layer.isGeneratedContent)
52                 return;
53
54             if (layer.pseudoElement === "before")
55                 beforeLayers.push(layer);
56             if (layer.pseudoElement === "after")
57                 afterLayers.push(layer);
58         });
59
60         logTestName("Check layers");
61
62         assert("Expected number of ::before layers", beforeLayers.length, 1);
63         assert("The sole ::before layer has a pseudo element", beforeLayers[0].pseudoElementId !== "", true);
64
65         assert("Expected number of ::after layers", afterLayers.length, 2);
66         assert("The first ::after layer has a pseudo element", afterLayers[0].pseudoElementId !== "", true);
67         assert("The second ::after layer has a pseudo element", afterLayers[1].pseudoElementId !== "", true);
68         assert("The second ::after layer is a reflection", afterLayers[1].isReflection, true);
69         assert("The two ::after layers have the same node id", afterLayers[0].nodeId, afterLayers[1].nodeId);
70         assert("The two ::after layers have the same pseudo element id", afterLayers[0].pseudoElementId, afterLayers[1].pseudoElementId);
71
72         assert("The non-reflection generated generated layers have the same node id", beforeLayers[0].nodeId, afterLayers[0].nodeId);
73         assert("The non-reflection generated layers have different pseudo element ids", beforeLayers[0].pseudoElementId !== afterLayers[0].pseudoElementId, true);
74
75         var node;
76         var nodeId = beforeLayers[0].nodeId;
77         for (var i = 0, count = nodes.length; i < count; ++i) {
78             if (nodes[i].nodeId === nodeId) {
79                 node = nodes[i];
80                 break;
81             }
82         }
83
84         logTestName("Check generating node");
85         
86         assert("Generating node was found", !!node, true);
87         assert("Generating node has expected localName", node.localName, "div");
88         assert("Generating node has id", node.attributes[0], "id");
89         assert("Generating node has expected id", node.attributes[1], "generator");
90         
91         ProtocolTest.completeTest();
92     };
93
94     function setChildNodes (messageObject) {
95         nodes = messageObject.params.nodes;
96     };
97
98     function step(test)
99     {
100         if (test.callback)
101             logTestName(test.name);
102         runCommand(test);
103     };
104
105     function logTestName(name)
106     {
107         ProtocolTest.log("\n=== " + name + " ===\n");
108     };
109
110     function runCommand(command)
111     {
112         InspectorProtocol.sendCommand(command.command, command.parameters, function(messageObject) {
113             if (messageObject.hasOwnProperty("error")) {
114                 ProtocolTest.log("FAIL: " + messageObject.error.message + " (" + messageObject.error.code + ")");
115                 ProtocolTest.completeTest();
116                 return;
117             }
118
119             if (command.name)
120                 ProtocolTest.log("PASS");
121
122             if (command.callback)
123                 command.callback(messageObject.result);
124         });
125     };
126
127     function assert(name, actual, expected)
128     {
129         if (expected === actual)
130             ProtocolTest.log("PASS: " + name + ".");
131         else
132             ProtocolTest.log("FAIL: " + name + ". Expected " + expected + " but got " + actual);
133     };
134
135 };
136
137 window.addEventListener("DOMContentLoaded", function()
138 {
139     runTest();
140 }, false);
141
142 </script>
143 <style type="text/css">
144       
145     #generator::before,
146     #generator::after {
147         position: absolute;
148         width: 100px;
149         height: 100px;
150         background-color: black;
151         -webkit-transform: translateZ(0);
152         content: "";
153     }
154
155     #generator::after {
156         -webkit-box-reflect:below 1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.5, transparent), to(white));
157     }
158
159 </style>
160 </head>
161 <body>
162
163     <div id="generator"></div>
164
165 </body>
166 </html>