43 lines
1.1 KiB
HTML
43 lines
1.1 KiB
HTML
<html><head></head><body>
|
|
1, 3, and 4 should all show the same red square. 2 should show nothing.
|
|
<ol>
|
|
<li><canvas id="canvas" width="100" height="100"></canvas></li>
|
|
<li><img src="" id="a"></li>
|
|
<li><img src="" id="b"></li>
|
|
<li><img src="" id="c"></li>
|
|
</ol>
|
|
|
|
<script type="text/javascript">
|
|
|
|
if (window.testRunner)
|
|
testRunner.dumpAsText(true);
|
|
|
|
var canvas = document.getElementById( 'canvas' );
|
|
var context = canvas.getContext( '2d' );
|
|
var img = context.getImageData( 0, 0, canvas.width, canvas.height );
|
|
|
|
var img_a = canvas.toDataURL( 'image/png' );
|
|
|
|
/* fill with red */
|
|
for ( var i = 0; i < img.data.length; i += 4 )
|
|
img.data[i] = img.data[i+3] = 255;
|
|
|
|
context.putImageData( img, 0, 0 );
|
|
var img_b = canvas.toDataURL( 'image/png' );
|
|
|
|
console.log( 'a == b? ' + (img_a == img_b) );
|
|
|
|
context.moveTo( 0, 0 );
|
|
context.lineTo( 0, 0 );
|
|
context.stroke();
|
|
|
|
var img_c = canvas.toDataURL( 'image/png' );
|
|
console.log( 'a == c? ' + (img_a == img_c) );
|
|
|
|
document.getElementById( 'a' ).src = img_a;
|
|
document.getElementById( 'b' ).src = img_b;
|
|
document.getElementById( 'c' ).src = img_c;
|
|
</script>
|
|
|
|
</body></html>
|