| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <script src="resources/shadow-dom.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="sandbox"></div> |
| <pre id="console"></pre> |
| <script> |
| description("Tests to ensure that MouseEvent's offsetX and offsetY are adjusted in re-targeting."); |
| |
| function moveMouseOver(element) |
| { |
| if (!window.eventSender || !window.internals) |
| return; |
| |
| var x = element.offsetLeft + element.offsetWidth / 2; |
| var y = element.offsetTop + element.offsetHeight / 2; |
| eventSender.mouseMoveTo(x, y); |
| } |
| |
| var eventRecords = {}; |
| |
| function recordEvent(event) |
| { |
| var eventType = event.type |
| var eventRecord = {} |
| eventRecord['currentTarget'] = event.currentTarget.id |
| eventRecord['target'] = event.target.id |
| eventRecord['offsetX'] = event.offsetX; |
| eventRecord['offsetY'] = event.offsetY; |
| eventRecords[event.currentTarget.id] = eventRecord; |
| } |
| |
| function addEventListeners(nodes) |
| { |
| for (var i = 0; i < nodes.length; ++i) { |
| var node = getNodeInComposedTree(nodes[i]); |
| node.addEventListener('mouseover', recordEvent, false); |
| } |
| } |
| |
| function testMouseEventOffset() |
| { |
| var sandbox = document.getElementById('sandbox'); |
| sandbox.innerHTML = ''; |
| sandbox.appendChild( |
| createDOM('div', {'id': 'top', 'style': 'padding-top: 77px;'}, |
| createDOM('div', {'id': 'shadow-host', 'style': 'padding-left: 100px; padding-top: 20px'}, |
| createShadowRoot( |
| createDOM('div', {'id': 'parent'}, |
| createDOM('div', {'id': 'target', 'style': 'padding-top: 10px; width: 80px'})))))); |
| addEventListeners(['top', 'shadow-host', 'shadow-host/parent']); |
| sandbox.offsetLeft; |
| moveMouseOver(getNodeInComposedTree('shadow-host/target')); |
| |
| shouldBe("eventRecords['parent']['offsetY']", "5"); |
| shouldBe("eventRecords['shadow-host']['offsetY']", "5 + 20"); |
| shouldBe("eventRecords['top']['offsetY']", "5 + 20"); |
| |
| shouldBe("eventRecords['parent']['offsetX']", "80 / 2"); |
| shouldBe("eventRecords['shadow-host']['offsetX']", "80 / 2 + 100"); |
| shouldBe("eventRecords['top']['offsetX']", "80 / 2 + 100"); |
| } |
| |
| testMouseEventOffset(); |
| </script> |
| </body> |
| </html> |
