blob: 46a1d8ffae7745a56a8594bd0eaf24e46f79336a [file] [log] [blame]
<!DOCTYPE html>
<html>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<style>
canvas, img { margin: 5px; width: 380px }
</style>
<body style="overflow: hidden">
<!-- The _blue_ sector of the <img> image should be at 12 o'clock. -->
<img>
<!-- The red sector of the <canvas> image should be at 12 o'clock. -->
<canvas></canvas>
</body>
<script>
window.onload = function() {
var image = document.querySelector('img');
image.onload = function() {
runAfterLayoutAndPaint(window.testRunner ? changeColorProfile : profileChanged);
};
image.src = 'resources/red-at-12-oclock-with-color-profile.jpg';
};
function changeColorProfile() {
window.testRunner.setColorProfile('sRGB', profileChanged);
}
function profileChanged() {
setTimeout(drawImageToCanvas, 0);
}
function drawImageToCanvas() {
var canvas = document.querySelector('canvas');
canvas.getContext('2d').clearRect(0, 0, canvas.width = 380, canvas.height = 380);
var image = document.querySelector('img');
canvas.getContext('2d').drawImage(image, 0, 0, canvas.width, canvas.height);
if (window.testRunner)
window.testRunner.setColorProfile('colorSpin', done);
}
function done() {
setTimeout(function() { window.testRunner.notifyDone() }, 0);
}
if (window.testRunner) {
testRunner.dumpAsTextWithPixelResults();
testRunner.waitUntilDone();
}
</script>
</html>