| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <style> |
| #layer { |
| position: relative; |
| left: 10px; |
| width: 400px; |
| height: 300px; |
| overflow: hidden; |
| } |
| .composited { |
| will-change: transform; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="layer" class="composited">A layer that may or may not be composited</div> |
| <p id="description"></p> |
| <div id="console"></div> |
| |
| <script src="../../../resources/js-test.js"></script> |
| <script src="../../../resources/run-after-layout-and-paint.js"></script> |
| <script> |
| jsTestIsAsync = true; |
| description("Make sure we don't crash when a layer with a touch event handler becomes non-composited"); |
| |
| var layer = document.getElementById('layer'); |
| layer.addEventListener('touchstart', function() {}); |
| |
| |
| var rects; |
| if (window.internals) { |
| // Ensure we've done a layout, updated compositing, and we have a hit rect on this composited layer. |
| internals.forceCompositingUpdate(document); |
| rects = internals.touchEventTargetLayerRects(document); |
| shouldBe("rects.length", "1"); |
| shouldBe("rects[0].hitTestRect.x", "0"); |
| shouldBe("rects[0].hitTestRect.y", "0"); |
| shouldBe("rects[0].hitTestRect.width", "400"); |
| shouldBe("rects[0].hitTestRect.height", "300"); |
| } |
| |
| // Make the layer non-composited |
| layer.className = ''; |
| |
| // Verify we now have a hit rect on the document after layout and paint. |
| runAfterLayoutAndPaint(function() { |
| if (window.internals) { |
| rects = internals.touchEventTargetLayerRects(document); |
| shouldBe("rects.length", "1"); |
| shouldBe("rects[0].hitTestRect.x", "18"); |
| shouldBe("rects[0].hitTestRect.y", "8"); |
| shouldBe("rects[0].hitTestRect.width", "400"); |
| shouldBe("rects[0].hitTestRect.height", "300"); |
| } |
| finishJSTest(); |
| }); |
| </script> |
| </body> |
| </html> |
