12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- <!DOCTYPE html>
- <style>
- body {
- margin: 0px;
- }
- #box {
- background-color: purple;
- height: 100px;
- width: 100px;
- }
- </style>
- <script>
- if (window.testRunner) {
- testRunner.dumpAsText();
- testRunner.waitUntilDone();
- }
- window.onload = function() {
- var i = 0;
- var finalIteration = 6;
- var startTrackingRectIteration = 3; // We need to put out a few frames before reproducing the bug.
- var testedLocations = [];
- function tick(t) {
- var x = 300 * i;
- if (i > startTrackingRectIteration) {
- testedLocations.push(x);
- if (window.internals)
- internals.startTrackingRepaints(document);
- }
- box.style.transform = "translate(" + x + "px, 0px)";
- if (++i < finalIteration) {
- requestAnimationFrame(tick);
- } else {
- if (window.internals) {
- var layerTree = internals.layerTreeAsText(document, internals.LAYER_TREE_INCLUDES_INVALIDATIONS);
- internals.stopTrackingRepaints(document);
- document.getElementById("result").textContent = "Tested locations: " + testedLocations + '\n' + layerTree;
- }
- if (window.testRunner)
- testRunner.notifyDone();
- }
- }
- requestAnimationFrame(tick);
- };
- </script>
- <div id="box"></div>
- This test checks that changing the transform on an element triggers a correct invalidation.<br>
- The paint invalidations below should match the transformed element's coordinates.
- <pre id="result"></pre>
|