| <html> |
| <head> |
| <script src="../../http/tests/inspector/inspector-test.js"></script> |
| <script src="../../http/tests/inspector/layers-test.js"></script> |
| <script> |
| function test() |
| { |
| InspectorTest.requestLayers(onGotLayers); |
| |
| async function onGotLayers() |
| { |
| var layer = InspectorTest.findLayerByNodeIdAttribute("a"); |
| var snapshotWithRect = await layer.snapshots()[0]; |
| await testImageForSnapshot(snapshotWithRect.snapshot, undefined); |
| await testImageForSnapshot(snapshotWithRect.snapshot, 0.5); |
| InspectorTest.completeTest(); |
| } |
| |
| async function testImageForSnapshot(snapshot, scale) |
| { |
| var imageURL = await snapshot.replay(scale); |
| var image = await new Promise(fulfill => { |
| var image = new Image(); |
| image.addEventListener("load", () => fulfill(image), false); |
| image.src = imageURL; |
| }); |
| InspectorTest.addResult(`Image dimensions at scale ${scale}: ${image.naturalWidth} x ${image.naturalHeight}`); |
| } |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <p> |
| Tests that when layer snapshots are replayed with scaling applied the image dimensions are properly scaled. |
| </p> |
| <div id="a" style="background-color:blue; transform: translateZ(0px); overflow: hidden;"> |
| <script> |
| (function() |
| { |
| var a = document.getElementById("a"); |
| var size = (180 / window.devicePixelRatio) + "px"; |
| a.style.width = size; |
| a.style.height = size; |
| })(); |
| </script> |
| <div style="width:50px; height:50px; background-color:red;"></div> |
| <img src="../tracing/resources/test.png"> |
| <svg> |
| <rect x="0" y="0" width="10" height="10" style="opacity:0.5"/> |
| </svg> |
| </div> |
| </body> |
| </html> |
