src/third_party/WebKit/LayoutTests/virtual/implsidepainting/inspector/timeline/tracing/paint-command-log-nodes.html

   1 <html>
   2 <head>
   3 <style>
   4 </style>
   5 <script src="../../../../../http/tests/inspector/inspector-test.js"></script>
   6 <script src="../../../../../http/tests/inspector/timeline-test.js"></script>
   7 <script src="../../../../../inspector/tracing-test.js"></script>
   8 <script>
   9
  10 function doActions(callback)
  11 {
  12     document.getElementById("a").style.visibility = "visible";
  13     requestAnimationFrame(function() {
  14         testRunner.displayAsyncThen(callback);
  15     });
  16 }
  17
  18 function test()
  19 {
  20     var imageCount = 0;
  21
  22     InspectorTest.invokeWithTracing("doActions", onTracingComplete, "disabled-by-default-blink.graphics_context_annotations");
  23
  24     var inFlightPictures = 0;
  25     function onTracingComplete()
  26     {
  27         var events = InspectorTest.tracingTimelineModel.inspectedTargetEvents();
  28         for (var i = 0; i < events.length; ++i) {
  29             var event = events[i];
  30             if (event.name !== WebInspector.TracingTimelineModel.RecordType.Paint)
  31                 continue;
  32             if (!event.picture)
  33                 continue;
  34             ++inFlightPictures;
  35             processPicture(event.picture);
  36         }
  37         if (!inFlightPictures)
  38             InspectorTest.completeTest();
  39     }
  40
  41     function processPicture(picture)
  42     {
  43         WebInspector.PaintProfilerSnapshot.load(WebInspector.targetManager.targets()[0], picture, onSnapshotLoaded);
  44     }
  45
  46     function onSnapshotLoaded(snapshot)
  47     {
  48         snapshot.commandLog(onGotLog);
  49     }
  50
  51     function onGotLog(log)
  52     {
  53         var seenNodes = {};
  54         for (var i = 0; i < log.length; ++i) {
  55             if (!log[i].annotations)
  56                 continue;
  57             var nodeId = Number(log[i].annotations["INSPECTOR_ID"]);
  58             if (nodeId)
  59                 seenNodes[nodeId] = true;
  60         }
  61         var requestedNodes = Object.keys(seenNodes).map(function(value) { return Number(value); });
  62         var domModel = WebInspector.targetManager.mainTarget().domModel;
  63         WebInspector.targetManager.mainTarget().domModel.pushNodesByBackendIdsToFrontend(requestedNodes, onNodesResolved.bind(this, log, requestedNodes));
  64     }
  65
  66     function onNodesResolved(log, requestedNodes, resolvedNodes)
  67     {
  68         InspectorTest.assertEquals(requestedNodes.length, resolvedNodes.length);
  69         var nodeMap = {};
  70         var domModel = WebInspector.targetManager.mainTarget().domModel;
  71         for (var i = 0; i < requestedNodes.length; ++i) {
  72             if (resolvedNodes[i])
  73                 nodeMap[requestedNodes[i]] = domModel.nodeForId(resolvedNodes[i]);
  74         }
  75         InspectorTest.addResult("Paint command log:");
  76         for (var i = 0; i < log.length; ++i) {
  77             if (!log[i].annotations)
  78                 continue;
  79             if (!/^draw/.test(log[i].method))
  80                 continue;
  81             var nodeId = Number(log[i].annotations["INSPECTOR_ID"]);
  82             if (!nodeId)
  83                 continue;
  84             InspectorTest.addResult("    " + WebInspector.DOMPresentationUtils.simpleSelector(nodeMap[nodeId]) + " " + log[i].method);
  85         }
  86         if (!--inFlightPictures)
  87             InspectorTest.completeTest();
  88     }
  89
  90 }
  91
  92 </script>
  93 </head>
  94
  95 <body onload="runTestAfterDisplay()">
  96 <p>
  97 Tests snapshot command log for trace-based Timeline paint event
  98 </p>
  99 <div id="a" style="visibility:hidden; -webkit-transform: translateZ(0px); background-color:blue; width:100px; height:100px;">
 100     <div id="b" style="width:50px; height:50px; background-color:red;"></div>
 101     <img id="c" src="../timeline/resources/test.png">
 102     <svg id="d">
 103         <rect id="e" x="0" y="0" width="10" height="10" style="opacity:0.5"/>
 104     </svg>
 105 </div>
 106 </body>
 107 </html>