resize-lock-input.https.html (4596B)
1 <!DOCTYPE html> 2 <title>Test FencedFrames Resize Lock</title> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script src="/resources/testdriver.js"></script> 6 <script src="/resources/testdriver-actions.js"></script> 7 <script src="/resources/testdriver-vendor.js"></script> 8 <script src="resources/utils.js"></script> 9 <script src="/common/dispatcher/dispatcher.js"></script> 10 <script src="/common/utils.js"></script> 11 12 <body> 13 14 <script> 15 promise_test(async t => { 16 const fencedframe = attachFencedFrameContext(); 17 18 // Set up the inner frame to receive mouse events. 19 await fencedframe.execute(() => { 20 window.testing_touchpoint = 'pending' 21 window.addEventListener('mousedown', async (event) => { 22 window.testing_touchpoint = event.clientX + "," + event.clientY; 23 }); 24 }); 25 26 let getCoordinates = async () => { 27 return fencedframe.execute(() => { 28 let point = window.testing_touchpoint; 29 window.testing_touchpoint = 'pending'; 30 return point; 31 }); 32 } 33 34 // Send an event to the origin of the frame. 35 for (let i = 0; i < 3; i++) { 36 await new test_driver.Actions() 37 .setContext(window) 38 .addPointer("finger1", "touch") 39 .pointerMove(10, 10, {origin: "viewport", sourceName: "finger1"}) 40 .pointerDown({sourceName: "finger1"}) 41 .pointerUp({sourceName: "finger1"}) 42 .send(); 43 } 44 45 let result = await getCoordinates(); 46 assert_equals(result, "0,0", "fenced frame event before resize 1"); 47 48 // The frame should be frozen at 300x150. Resize to create a 2x scale 49 // and a horizontal offset of 50px. 50 frame.width = "700"; 51 frame.height = "300"; 52 53 // Let the inner frame animate in order for the resize to take effect. 54 await fencedframe.execute(async () => { 55 await new Promise(resolve => requestAnimationFrame(resolve)); 56 }); 57 58 // The hit-test data is replicated in the browser and updated 59 // asynchronously. Wait to ensure the update has finished. 60 t.step_timeout(async () => { 61 // Now send an event to the same location. The event should be 62 // routed to the main frame. 63 let promise = new Promise((resolve, reject) => { 64 window.addEventListener('mousedown', (event) => { 65 let point = event.clientX + "," + event.clientY; 66 assert_equals(result, "10,10", "main frame event after resize"); 67 }); 68 }); 69 for (let i = 0; i < 3; i++) { 70 await new test_driver.Actions() 71 .setContext(window) 72 .addPointer("finger1", "touch") 73 .pointerMove(10, 10, {origin: "viewport", sourceName: "finger1"}) 74 .pointerDown({sourceName: "finger1"}) 75 .pointerUp({sourceName: "finger1"}) 76 .send(); 77 } 78 await promise; 79 80 // Send an event to where the origin of the scaled frame should 81 // render. 82 for (let i = 0; i < 3; i++) { 83 await new test_driver.Actions() 84 .setContext(window) 85 .addPointer("finger1", "touch") 86 .pointerMove(60, 10, {origin: "viewport", sourceName: "finger1"}) 87 .pointerDown({sourceName: "finger1"}) 88 .pointerUp({sourceName: "finger1"}) 89 .send(); 90 } 91 result = await getCoordinates(); 92 assert_equals(result, "0,0", "fenced frame event after resize 1"); 93 94 // Send an event where the bottom left of the scaled frame should 95 // render. 96 for (let i = 0; i < 3; i++) { 97 await new test_driver.Actions() 98 .setContext(window) 99 .addPointer("finger1", "touch") 100 .pointerMove(660, 310, {origin: "viewport", sourceName: "finger1"}) 101 .pointerDown({sourceName: "finger1"}) 102 .pointerUp({sourceName: "finger1"}) 103 .send(); 104 } 105 result = await getCoordinates(); 106 assert_equals(result, "300,150", "fenced frame event after resize 2"); 107 }, 1000); 108 }, "Test Resize Lock"); 109 </script> 110 111 </body> 112 </html>