| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <style> |
| |
| html { position: absolute; } |
| body { |
| margin: 0; |
| height: 2000px; |
| } |
| #container { |
| position: absolute; |
| left: 0; |
| top: 50px; |
| width: 700px; |
| height: 2000px; |
| } |
| #target { |
| margin-top: 150px; |
| margin-left: 100px; |
| width: 200px; |
| height: 100px; |
| background: silver; |
| } |
| |
| </style> |
| <div id="container"> |
| <div id="target"></div> |
| </div> |
| <script> |
| |
| function run(zoom, scroll) { |
| if (!window.testRunner) |
| return; |
| testRunner.setPageZoomFactor(zoom); |
| scrollTo(0, scroll); |
| var result; |
| var target = document.querySelector("#target"); |
| var rect = target.getBoundingClientRect(); |
| target.addEventListener("click", (event) => { |
| result = [event.offsetX, event.offsetY, event.layerX, event.layerY]; |
| }); |
| eventSender.mouseMoveTo( |
| (rect.left + rect.width / 2) * zoom, |
| (rect.top + rect.height / 2) * zoom); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| // layerX and layerY are relative to #container |
| assert_array_approx_equals(result, [100, 50, 200, 200], 5); |
| } |
| |
| test(() => { run(1, 0); }, 'no zoom or scroll'); |
| test(() => { run(1, 100); }, 'scroll without zoom'); |
| test(() => { run(2, 0); }, 'zoom without scroll'); |
| test(() => { run(2, 100); }, 'zoom and scroll'); |
| |
| </script> |