pointerevent_setpointercapture_pointerup_mouse.html (4301B)
1 <!doctype html> 2 <html> 3 <head> 4 <title>setPointerCapture on pointerup</title> 5 <meta name="viewport" content="width=device-width"> 6 <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> 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 src="pointerevent_support.js"></script> 13 </head> 14 <body> 15 <h1>Pointer Events Capture Test - setPointerCapture on pointerup</h1> 16 <h4> 17 Test Description: This test checks if setPointerCapture works properly. Complete the following actions: 18 <ol> 19 <li> Press and hold left mouse button over black rectangle 20 <li> Release left mouse button 21 </ol> 22 </h4> 23 Test passes if the proper behavior of the events is observed. 24 <div id="target0" style="background:black; color:white"></div> 25 <br> 26 <script type='text/javascript'> 27 var count=0; 28 var event_log = []; 29 var actions_promise; 30 31 var detected_pointertypes = {}; 32 add_completion_callback(end_of_test); 33 function end_of_test() { 34 showLoggedEvents(); 35 showPointerTypes(); 36 } 37 38 var target0 = document.getElementById('target0'); 39 40 setup({ explicit_done: true }); 41 42 window.onload = function() { 43 on_event(target0, 'pointerdown', function(e) { 44 event_log.push('pointerdown@target0'); 45 detected_pointertypes[e.pointerType] = true; 46 test(function () { 47 assert_equals(event.pointerType, "mouse", "Test should be run using a mouse as input"); 48 }, "Test should be run using a mouse as input"); 49 }); 50 51 on_event(target0, 'gotpointercapture', function(e) { 52 event_log.push('gotpointercapture@target0'); 53 test(function () { 54 assert_true(false, "target0 shouldn't receive gotpointercapture"); 55 }, "target0 shouldn't receive gotpointercapture"); 56 }); 57 58 on_event(target0, 'lostpointercapture', function(e) { 59 event_log.push('lostpointercapture@target0'); 60 test(function () { 61 assert_true(false, "target0 shouldn't receive lostpointercapture"); 62 }, "target0 shouldn't receive lostpointercapture"); 63 }); 64 65 on_event(target0, 'pointerup', function(e) { 66 event_log.push('pointerup@target0'); 67 var thrown = false; 68 try { 69 target0.setPointerCapture(e.pointerId); 70 } catch(e) { 71 thrown = true; 72 } 73 test(function() { 74 assert_false(thrown, "target0.setPointerCapture should not throw"); 75 }, "target0.setPointerCapture should not throw"); 76 // Make sure the test finishes after all the input actions are completed. 77 actions_promise.then( () => { 78 done(); 79 }); 80 }); 81 82 // Inject mouse inputs. 83 actions_promise = new test_driver.Actions() 84 .pointerMove(0, 0, {origin: target0}) 85 .pointerDown() 86 .pointerMove(10, 0, {origin: target0}) 87 .pointerUp() 88 .send(); 89 } 90 </script> 91 <h1>Pointer Events Capture Test</h1> 92 <div id="complete-notice"> 93 <p>Test complete: Scroll to Summary to view Pass/Fail Results.</p> 94 <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p> 95 <p>The following events were logged: <span id="event-log"></span>.</p> 96 </div> 97 <div id="log"></div> 98 </body> 99 </html>