third_party/WebKit/LayoutTests/inspector/tracing/decode-resize.html

   1 <html>
   2 <head>
   3 <style>
   4 div {
   5     display: inline-block;
   6 }
   7
   8 div.img-container {
   9     position: relative;
  10     width: 99px;
  11     height: 99px;
  12     overflow: clip;
  13 }
  14
  15 .background, .border {
  16     width: 25px;
  17     height: 25px;
  18 };
  19
  20 .border {
  21     border-width: 12px;
  22 }
  23
  24 </style>
  25 <script src="../../http/tests/inspector/inspector-test.js"></script>
  26 <script src="../../http/tests/inspector/timeline-test.js"></script>
  27 <script src="../tracing-test.js"></script>
  28 <script>
  29
  30 var images = [
  31     ["./resources/test.webp", "25", "25"],
  32     ["./resources/test.bmp", "25", "25"],
  33     ["./resources/test.gif", "25", "25"],
  34     ["./resources/test.ico", "25", "25"],
  35     ["./resources/test.jpg", "25", "25"],
  36     ["./resources/test.png", "25", "25"],
  37     ["./resources/big.png", "150", "150"]
  38 ];
  39
  40 function showImages(callback)
  41 {
  42     var nextImageIndex = 0;
  43
  44     addImages();
  45
  46     function addImages()
  47     {
  48         if (nextImageIndex >= images.length) {
  49             // Allow several frames for image decoding to complete on rasterizer threads.
  50             generateFrames(3, callback);
  51             return;
  52         }
  53
  54         var imgContainer = document.createElement("div");
  55         imgContainer.className = "img-container";
  56         document.body.appendChild(imgContainer);
  57
  58         var imgElement = document.createElement("img");
  59         imgElement.addEventListener("load", testRunner.layoutAndPaintAsyncThen.bind(testRunner, addImages));
  60         imgContainer.appendChild(imgElement);
  61
  62         var backgroundElement = document.createElement("div");
  63         backgroundElement.className = "background";
  64         document.body.appendChild(backgroundElement);
  65
  66         var borderElement = document.createElement("div");
  67         borderElement.className = "border";
  68         document.body.appendChild(borderElement);
  69
  70         var image = images[nextImageIndex++];
  71         imgElement.width = image[1];
  72         imgElement.height = image[2];
  73         imgElement.src = image[0];
  74         backgroundElement.style.backgroundImage = "url(" + image[0] + "?background)";
  75         borderElement.style.borderImage = "url(" + image[0] + "?border)";
  76     }
  77 }
  78
  79
  80 function test()
  81 {
  82     InspectorTest.invokeWithTracing("showImages", InspectorTest.safeWrap(onTracingComplete));
  83     function onTracingComplete()
  84     {
  85         function isDecodeImageEvent(event)
  86         {
  87             return event.name === WebInspector.TimelineModel.RecordType.DecodeImage;
  88         }
  89         function compareImageURLs(a, b)
  90         {
  91             var urlA = InspectorTest.formatters.formatAsURL(a.url || "<missing>");
  92             var urlB = InspectorTest.formatters.formatAsURL(b.url || "<missing>");
  93             return urlA.localeCompare(urlB);
  94         }
  95         var events = InspectorTest.tracingTimelineModel().inspectedTargetEvents();
  96         var sortedDecodeEvents = events.filter(isDecodeImageEvent).sort(compareImageURLs);
  97         for (var i = 0; i < sortedDecodeEvents.length; ++i) {
  98             var event = sortedDecodeEvents[i];
  99             // Skip duplicate events, as long as they have the imageURL
 100             if (i && event.url && event.url === sortedDecodeEvents[i - 1].url)
 101                 continue;
 102             InspectorTest.addResult("event: " + event.name);
 103             InspectorTest.addResult("imageURL: " + InspectorTest.formatters.formatAsURL(event.url));
 104             InspectorTest.addResult("backendNodeId: " + (event.backendNodeId > 0 ? "present" : "absent"));
 105         }
 106         InspectorTest.completeTest();
 107     }
 108 }
 109
 110 </script>
 111 </head>
 112
 113 <body onload="runTest()">
 114 <p>
 115 Tests the instrumentation of a DecodeImage and ResizeImage events
 116 </p>
 117 </body>
 118 </html>