| <html> |
| <head> |
| <script src="../../http/tests/inspector/inspector-test.js"></script> |
| <script src="../../http/tests/inspector/layers-test.js"></script> |
| <script src="../tracing-test.js"></script> |
| |
| <script> |
| function doActions(callback) |
| { |
| var div = document.createElement("div"); |
| div.id = "b4"; |
| document.getElementById("a").appendChild(div); |
| |
| // Make sure to force commit, otherwise some owner nodes will be missing. |
| var style = document.createElement("style"); |
| style.textContent = ".layer { -webkit-transform: translateZ(10px); opacity: 0.8; }"; |
| document.head.appendChild(style); |
| |
| if (!window.testRunner) { |
| callback(); |
| return; |
| } |
| testRunner.displayAsyncThen(callback); |
| } |
| |
| function test() |
| { |
| InspectorTest.invokeWithTracing("doActions", onTracingComplete); |
| |
| var target = /** @type {!WebInspector.Target} */ (WebInspector.targetManager.mainTarget()); |
| var layerTree = new WebInspector.TracingLayerTree(target); |
| |
| function onTracingComplete() |
| { |
| var events = InspectorTest.tracingTimelineModel.inspectedTargetEvents(); |
| for (var i = events.length - 1; i >= 0; --i) { |
| if (events[i].phase === WebInspector.TracingModel.Phase.SnapshotObject && events[i].name === "cc::LayerTreeHostImpl") { |
| var rootLayer = events[i].args["snapshot"]["active_tree"]["root_layer"]; |
| dumpLayerTreeSnapshot(rootLayer); |
| return; |
| } |
| } |
| InspectorTest.addResult("FAIL: cc::LayerTreeHostImpl snapshot not found"); |
| InspectorTest.completeTest(); |
| } |
| |
| function dumpLayerTreeSnapshot(rootLayer) |
| { |
| layerTree.setLayers(rootLayer, onLayersSet); |
| } |
| |
| function onLayersSet() |
| { |
| InspectorTest.layerTreeModel.setLayerTree(layerTree); |
| InspectorTest.dumpLayerTree(); |
| InspectorTest.completeTest(); |
| } |
| } |
| </script> |
| |
| <body onload="runTestAfterDisplay()"> |
| Tests that LayerTreeModel successfully imports layers from a trace. |
| </p> |
| <div id="a" style="width: 200px; height: 200px" class="layer"> |
| <div class="layer" id="b1" style="width: 150px; height: 100px"></div> |
| <div id="b2" class="layer" style="width: 140px; height: 110px"> |
| <div id="c" class="layer" style="width: 100px; height: 90px"></div> |
| </div> |
| <div id="b3" class="layer" style="width: 140px; height: 110px"></div> |
| </div> |
| </body> |
| </html> |