canvas-stretch-color-bleeding.html 771 B

1234567891011121314151617181920212223242526272829303132333435
  1. <!DOCTYPE html>
  2. <head>
  3. <style>
  4. body {
  5. background: black;
  6. }
  7. </style>
  8. <body>
  9. This test checks if the color bleeds due to interpolation filter when the canvas is stretched. We expect to see a white band extending from left to right without any vertical black lines.
  10. <canvas id='foo' width='100' height='100' style='width:500px;height:100px'> </canvas>
  11. <script>
  12. if (window.testRunner) {
  13. testRunner.waitUntilDone();
  14. }
  15. var i = 0;
  16. var ctx = document.getElementById("foo").getContext("2d");
  17. ctx.fillStyle = 'white';
  18. function draw_slice() {
  19. if (i >= 100) {
  20. if (window.testRunner) {
  21. testRunner.notifyDone();
  22. }
  23. }
  24. ctx.fillRect(i, 0, 2, 100);
  25. i+=2;
  26. window.requestAnimationFrame(draw_slice);
  27. }
  28. draw_slice();
  29. </script>
  30. </body>
  31. </head>