| OLD | NEW |
|---|
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <style> | 3 <style> |
| 4 div#img-container { | 4 div#img-container { |
| 5 position: relative; | 5 position: relative; |
| 6 width: 99px; | 6 width: 99px; |
| 7 height: 99px; | 7 height: 99px; |
| 8 overflow: clip; | 8 overflow: clip; |
| 9 } | 9 } |
| 10 </style> | 10 </style> |
| 11 <script src="../../http/tests/inspector/inspector-test.js"></script> | 11 <script src="../../http/tests/inspector/inspector-test.js"></script> |
| 12 <script src="../../http/tests/inspector/timeline-test.js"></script> | 12 <script src="../../http/tests/inspector/timeline-test.js"></script> |
| 13 <script> | 13 <script> |
| 14 | 14 |
| 15 function display() | 15 var images = [ |
| 16 {src: "resources/test.bmp", width: "25", height: "25"}, |
| 17 {src: "resources/test.gif", width: "25", height: "25"}, |
| 18 {src: "resources/test.ico", width: "25", height: "25"}, |
| 19 {src: "resources/test.jpg", width: "25", heigth: "25"}, |
| 20 {src: "resources/test.png", width: "25", height: "25"}, |
| 21 {src: "resources/test.webp", width: "25", height: "25"}, |
| 22 {src: "resources/big.png", width: "150", heigth: "150"} |
| 23 ]; |
| 24 |
| 25 function performActions(callback) |
| 16 { | 26 { |
| 17 if (window.testRunner) | 27 var imageIndex = 0; |
| 18 testRunner.displayAsync(); | |
| 19 } | |
| 20 | 28 |
| 21 function addImage(src, width, height) | 29 addImage(); |
| 22 { | 30 |
| 23 var img = document.getElementById("img-container").firstElementChild; | 31 function addImage() |
| 24 img.width = width; | 32 { |
| 25 img.height = height; | 33 if (window.testRunner) |
| 26 img.src = src; | 34 testRunner.displayAsync(); |
| 35 |
| 36 if (imageIndex === images.length) { |
| 37 callback(); |
| 38 return; |
| 39 } |
| 40 var img = document.getElementById("img-container").firstElementChild; |
| 41 img.width = images[imageIndex].width; |
| 42 img.height = images[imageIndex].height; |
| 43 img.src = images[imageIndex].src; |
| 44 ++imageIndex; |
| 45 img.onload = function() { |
| 46 window.requestAnimationFrame(addImage); |
| 47 } |
| 48 } |
| 27 } | 49 } |
| 28 | 50 |
| 29 function test() | 51 function test() |
| 30 { | 52 { |
| 31 var images = [ | 53 InspectorTest.startDumpingProtocolMessages(); |
| 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/test.webp", "25", "25"], | |
| 38 ["resources/big.png", "150", "150"] | |
| 39 ]; | |
| 40 var imageCount = 0; | |
| 41 WebInspector.timelineManager.addEventListener(WebInspector.TimelineManager.E
ventTypes.TimelineEventRecorded, recordSniffer); | |
| 42 InspectorTest.startTimeline(showImage); | |
| 43 | 54 |
| 44 function showImage() | 55 InspectorTest.invokeAsyncWithTimeline("performActions", finish); |
| 45 { | |
| 46 if (imageCount >= images.length) { | |
| 47 allImagesShown(); | |
| 48 return; | |
| 49 } | |
| 50 InspectorTest.evaluateInPage('addImage("' + images[imageCount].join('",
"') + '");'); | |
| 51 imageCount++; | |
| 52 } | |
| 53 | 56 |
| 54 function recordSniffer(event) | 57 function finish(records) |
| 55 { | |
| 56 processRecord(event.data); | |
| 57 } | |
| 58 | |
| 59 function processRecord(record) | |
| 60 { | |
| 61 if (record.type === WebInspector.TimelineModel.RecordType.DecodeImage) { | |
| 62 showImage(); | |
| 63 } | |
| 64 (record.children || []).forEach(processRecord); | |
| 65 } | |
| 66 | |
| 67 function allImagesShown() | |
| 68 { | |
| 69 WebInspector.timelineManager.removeEventListener(WebInspector.TimelineMa
nager.EventTypes.TimelineEventRecorded, recordSniffer); | |
| 70 InspectorTest.stopTimeline(dumpRecords); | |
| 71 } | |
| 72 | |
| 73 function dumpRecords(records) | |
| 74 { | 58 { |
| 75 for (var i = 0; i < records.length; ++i) { | 59 for (var i = 0; i < records.length; ++i) { |
| 76 var record = records[i]; | 60 var record = records[i]; |
| 77 if (record.type === WebInspector.TimelineModel.RecordType.DecodeImag
e || record.type === WebInspector.TimelineModel.RecordType.ResizeImage) { | 61 if (record.type === WebInspector.TimelineModel.RecordType.DecodeImag
e || record.type === WebInspector.TimelineModel.RecordType.ResizeImage) { |
| 78 // Some decode events may happen in the background, so we won't
have a stack trace. | 62 // Some decode events may happen in the background, so we won't
have a stack trace. |
| 79 delete record.stackTrace; | 63 delete record.stackTrace; |
| 80 InspectorTest.printTimelineRecordProperties(record); | 64 InspectorTest.printTimelineRecordProperties(record); |
| 81 } | 65 } |
| 82 } | 66 } |
| 83 InspectorTest.completeTest(); | 67 InspectorTest.completeTest(); |
| 84 } | 68 } |
| 85 } | 69 } |
| 86 | 70 |
| 71 function manualRunTest() |
| 72 { |
| 73 if (window.testRunner) |
| 74 runTest(); |
| 75 else |
| 76 performActions(); |
| 77 } |
| 78 |
| 87 </script> | 79 </script> |
| 88 </head> | 80 </head> |
| 89 | 81 |
| 90 <body onload="runTest()"> | 82 <body onload="manualRunTest()"> |
| 91 <p> | 83 <p> |
| 92 Tests the Timeline API instrumentation of a DecodeImage and ResizeImage events | 84 Tests the Timeline API instrumentation of a DecodeImage and ResizeImage events |
| 93 </p> | 85 </p> |
| 94 <div id="img-container"><img onload="display()"></div> | 86 <div id="img-container"><img></div> |
| 95 </body> | 87 </body> |
| 96 </html> | 88 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 399043002:
DevTools: switch Timeline frontend into buffered mode and remove the corresponding experiment. (Closed)
Base URL: svn://svn.chromium.org/blink/trunk