pointerevent_pointerleave_descendants-manual.html 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>Pointerleave + descendant</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="pointerevent_support.js"></script>
  10. <script src="mochitest_support_internal.js"></script>
  11. </head>
  12. <body onload="run()">
  13. <h1>pointerleave</h1>
  14. <!--
  15. <h4>
  16. Test Description: This test checks if pointerleave event works properly.
  17. <p>Put your mouse over the black rectangle and then move it out through purple rectangle boundaries.</p>
  18. </h4>
  19. <p>
  20. -->
  21. <div id="target0" style="background:black; height: 47px;">
  22. <div style="background:purple; height: 35px; width: 90%; position: absolute"></div>
  23. </div>
  24. <script>
  25. var eventTested = false;
  26. var detected_pointertypes = {};
  27. add_completion_callback(showPointerTypes);
  28. function run() {
  29. var target0 = document.getElementById("target0");
  30. var test_pointerleave = async_test("pointerleave event received");
  31. on_event(target0, "pointerover", function(event) {
  32. detected_pointertypes[ event.pointerType ] = true;
  33. });
  34. // When a pointing device is moved off of the hit test boundaries of an element and all of its descendants, the pointerleave event must be dispatched.
  35. // TA: 9.1
  36. on_event(target0, "pointerleave", function (event) {
  37. if (eventTested == false) {
  38. test_pointerleave.done();
  39. eventTested = true;
  40. }
  41. });
  42. }
  43. </script>
  44. <h1>Pointer Events pointerleave tests</h1>
  45. <div id="complete-notice">
  46. <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p>
  47. <p>Refresh the page to run the tests again with a different pointer type.</p>
  48. </div>
  49. <div id="log"></div>
  50. </body>
  51. </html>