blob: 41244a4117a7737a844ffdd647350bbb60683a1f [file] [log] [blame]
<!DOCTYPE html>
<html>
<script src="../resources/run-after-layout-and-paint.js"></script>
<style>
canvas, img { margin-bottom: -10px; }
</style>
<body style="overflow: hidden">
<!-- The red sector of the canvas images should be at 12 o'clock. -->
<p title="html canvas 2d element">
<canvas width="700px" height="200px" />
</p>
<!-- The blue sector of the source images should be at 12 o'clock. -->
<img title="source image to draw on canvas">
</body>
<script>
window.onload = function() {
var image = document.querySelector('img');
image.onload = function() {
runAfterLayoutAndPaint(loadedImage);
};
image.src = 'resources/color-profile-image-data-url.svg';
};
function loadedImage() {
setTimeout(drawImageToCanvas, 0, document.querySelector('img'));
}
function drawImageToCanvas(image) {
var canvas = document.querySelector('canvas');
canvas.getContext('2d').clearRect(0, 0, canvas.width, canvas.height);
canvas.getContext('2d').drawImage(image, 0, 0);
if (window.testRunner)
setTimeout(function() { testRunner.notifyDone() }, 0);
}
if (window.testRunner) {
testRunner.dumpAsTextWithPixelResults();
testRunner.waitUntilDone();
}
</script>
</html>