| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <canvas id="canvas"></canvas> |
| <script> |
| description("Ensure the image frame is drawn when it finishes decoding even if it takes more than the previous frame duration."); |
| jsTestIsAsync = true; |
| |
| if (window.internals) { |
| internals.settings.setAnimatedImageDebugCanvasDrawingEnabled(true); |
| internals.clearMemoryCache(); |
| } |
| |
| var image = new Image; |
| image.onload = imageLoaded; |
| image.src = "resources/animated-red-green-blue.gif"; |
| |
| function imageLoaded() |
| { |
| if (!window.internals) |
| return; |
| internals.setImageFrameDecodingDuration(image, 0.050); |
| drawImage(); |
| drawLoop(); |
| } |
| |
| function drawImage() |
| { |
| if (drawImage.count == undefined) |
| drawImage.count = 0; |
| var canvas = document.getElementById("canvas"); |
| var ctx = canvas.getContext("2d"); |
| ctx.drawImage(image, 0, 0, canvas.width, canvas.height); |
| return ++drawImage.count; |
| } |
| |
| function drawLoop() |
| { |
| // 1st time the image is drawn, time = 0, current_frame = 0 |
| // 2nd time the image is drawn, time = 40, current_frame = 0 |
| // 3rd time the image is drawn, time = 80, current_frame = 1 |
| setTimeout(function() { |
| if (drawImage() == 3) { |
| shouldBe("internals.imageFrameIndex(image)", "1"); |
| finishJSTest(); |
| } else |
| drawLoop(); |
| }, 40); |
| } |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
