pointerevent-boundary-event-target-when-hover-generates-content-under-pointer.html (1797B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name=viewport content="width=device-width,initial-scale=1"> 6 <title>Making generated content under pointer at hover should keep targeting the boundary event target to parent element</title> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="/resources/testdriver.js"></script> 10 <script src="/resources/testdriver-actions.js"></script> 11 <script src="/resources/testdriver-vendor.js"></script> 12 <script> 13 "use strict"; 14 15 addEventListener("load", () => { 16 promise_test(async () => { 17 const div = document.querySelector("div"); 18 await new test_driver.Actions() 19 .pointerMove(0, 0, {origin: div}) 20 .send(); 21 const span = document.querySelector("span"); 22 const promisePointerOver = new Promise(resolve => { 23 span.addEventListener("pointerover", event => resolve(event.target), {once: true}); 24 }); 25 const promiseMouseOver = new Promise(resolve => { 26 span.addEventListener("mouseover", event => resolve(event.target), {once: true}); 27 }); 28 await new test_driver.Actions() 29 .pointerMove(0, 0, {origin: span}) 30 .pointerDown() 31 .pointerUp() 32 .send(); 33 const pointerOverTarget = await promisePointerOver; 34 assert_equals( 35 pointerOverTarget, 36 span, 37 "pointerover target should be the <span>" 38 ); 39 const mouseOverTarget = await promiseMouseOver; 40 assert_equals( 41 mouseOverTarget, 42 span, 43 "mouseover target should be the <span>" 44 ); 45 }, "Generating text content under pointer"); 46 }, {once: true}); 47 </script> 48 <style> 49 span:hover::before { 50 content: "Here is generated content... "; 51 } 52 </style> 53 </head> 54 <body><span>Hover me!</span><div>Move pointer here first!</div></body> 55 </html>