| OLD | NEW |
| 1 <!doctype HTML> | 1 <!doctype HTML> |
| 2 <body> | 2 <body> |
| 3 <div id="targetDiv" style="height: 2000px; width: 2000px; will-change: transform
"> | 3 <div id="targetDiv" style="height: 2000px; width: 2000px; will-change: transform
"> |
| 4 <img id="targetImage"> | 4 <img id="targetImage"> |
| 5 </div> | 5 </div> |
| 6 <script src="../../fast/repaint/resources/text-based-repaint.js"></script> | 6 <script src="../../fast/repaint/resources/text-based-repaint.js"></script> |
| 7 <script> | 7 <script> |
| 8 window.testIsAsync = true; | 8 window.testIsAsync = true; |
| 9 | 9 |
| 10 // The image should not show a paint invalidation if offscreen if Slimming Paint
is on. | 10 // Disable under-invalidation checking because the "under-invalidation" of |
| 11 // Otherwise it should. | 11 // offscreen gif animation is intentional. |
| 12 | 12 if (window.internals) |
| 13 // Steps: | 13 internals.runtimeFlags.paintUnderInvalidationCheckingEnabled = false; |
| 14 // 1. Load the image | |
| 15 // 2. Move the image offscreen | |
| 16 // 3. Start tracking paint invalidation rects | |
| 17 // 4. Call layoutAndPaintAsyncThen (via runRepaintTest, which does this for us)
to draw a frame | |
| 18 // 5. Wait longer than 100ms, so that the timer between the first and second ani
mated GIF | |
| 19 // frame expires and a paint invalidation is issued on the animated GIF. (100
ms is the | |
| 20 // length of the first frame of the animation in the GIF file.) | |
| 21 // 6. Stop tracking paint invalidation rects (finishRepaintTest does this for us
) | |
| 22 | |
| 23 // These steps differ from a standard repaint test in that step 3 precedes step
4. | |
| 24 // This is critical because layoutAndPaintAsyncThen may take longer than the 100
ms of the timer, | |
| 25 // so we may miss it. | |
| 26 | 14 |
| 27 function repaintTest() { | 15 function repaintTest() { |
| 28 setTimeout(finishRepaintTest, 150); | 16 if (window.internals) |
| 17 internals.advanceImageAnimation(targetImage); |
| 18 requestAnimationFrame(function() { |
| 19 finishRepaintTest(); |
| 20 }); |
| 29 } | 21 } |
| 30 | 22 |
| 31 function targetImageOnload() { | 23 function targetImageOnload() { |
| 32 targetDiv.style.transform = "translateY(-1000px)"; | 24 targetDiv.style.transform = "translateY(-1000px)"; |
| 33 if (window.internals) | |
| 34 window.internals.startTrackingRepaints(document); | |
| 35 runRepaintTest(); | 25 runRepaintTest(); |
| 36 } | 26 } |
| 37 | 27 |
| 38 window.onload = function() { | 28 window.onload = function() { |
| 39 targetImage.onload = targetImageOnload; | 29 targetImage.onload = targetImageOnload; |
| 40 targetImage.src="../../fast/backgrounds/resources/red-green-animated.gif"; | 30 targetImage.src="../../fast/backgrounds/resources/red-green-animated.gif"; |
| 41 } | 31 } |
| 42 </script> | 32 </script> |
| OLD | NEW |