| <!DOCTYPE html> |
| <!-- |
| Tests that a change from the worker produces a visual update. |
| --> |
| <style> |
| #box { |
| width: 100px; |
| height: 100px; |
| /* A composited DIV background is clipped differently from a non-composited |
| one. This causes the box to be composited in both cases |
| TODO(majidvp): fix this mismatch between CC and blink rendering |
| */ |
| backface-visibility: hidden; |
| } |
| |
| #covered, #green { |
| width: 85px; |
| height: 85px; |
| } |
| |
| #box, #covered { |
| background-color: #ff8080; |
| overflow: auto; |
| } |
| |
| #green { |
| position: relative; |
| left: 100px; |
| top: 100px; |
| background-color: #00ff00; |
| } |
| |
| </style> |
| |
| <div id="box"> |
| <div id="green"></div> |
| </div> |
| <div id="covered"></div> |
| |
| <script> |
| var box = document.getElementById('box'); |
| box.style.transform = 'translate(0, 100px)'; |
| box.style.opacity = 0.5; |
| box.scrollLeft = 100; |
| box.scrollTop = 100; |
| </script> |