| <!DOCTYPE html> |
| <style> |
| #container { |
| width: 100px; |
| height: 100px; |
| position: relative; |
| overflow: hidden; |
| } |
| |
| #composited { |
| will-change: transform; |
| width: 100px; |
| height: 100px; |
| background-color: green; |
| } |
| </style> |
| This test verifies layout overflow will be recomputed when CSS transform is changed. |
| <div id="container" data-expected-scroll-width="100" data-expected-scroll-height="100"> |
| <div id="composited"> |
| </div> |
| </div> |
| <script src="../../resources/check-layout.js"></script> |
| <script> |
| checkLayout("#container"); |
| var composited = document.getElementById('composited'); |
| composited.style.webkitTransform = 'translate3d(100px, 100px, 0)'; |
| var container = document.getElementById('container'); |
| container.setAttribute("data-expected-scroll-width", 200); |
| container.setAttribute("data-expected-scroll-height", 200); |
| checkLayout("#container"); |
| </script> |
