Revision 36857c5f01b941752b8877902dccd8b7b01202be authored by Tooru Fujisawa on 02 October 2018, 08:23:59 UTC, committed by moz-wptsync-bot on 02 October 2018, 08:23:59 UTC
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1495601
gecko-commit: 6568853848ac62384a094e521965e101978b1f62
gecko-integration-branch: mozilla-inbound
gecko-reviewers: sfink
1 parent b7fcdf3
Raw File
pointerevent_on_event_handlers.html
<!doctype html>
<html>
    <head>
        <title>PointerEvent: Constructor test</title>
        <meta name="viewport" content="width=device-width">
        <link rel="stylesheet" type="text/css" href="pointerevent_styles.css">
        <script src="/resources/testharness.js"></script>
        <script src="/resources/testharnessreport.js"></script>
        <!-- Additional helper script for common checks across event types -->
        <script type="text/javascript" src="pointerevent_support.js"></script>
    </head>
    <body>
    <h1>PointerEvent: Dispatch custom event</h1>
    <h4>Test Description: This test checks if on pointer event handlers through attributes works properly using synthetic pointerevents. For valid results, this test must be run without generating real (trusted) events on the black rectangle below.</h4>
    <div id="target0"
         onpointercancel="window.eventHappened = 'pointercancel';"
         onpointerdown="window.eventHappened = 'pointerdown';"
         onpointerup="window.eventHappened = 'pointerup';"
         onpointermove="window.eventHappened = 'pointermove';"
         onpointerout="window.eventHappened = 'pointerout';"
         onpointerover="window.eventHappened = 'pointerover';"
         onpointerleave="window.eventHappened = 'pointerleave';"
         onpointerenter="window.eventHappened = 'pointerenter';"
         ongotpointercapture="window.eventHappened = 'gotpointercapture';"
         onlostpointercapture="window.eventHappened = 'lostpointercapture';"
    ></div>
    <script>
        window.eventHappened = '';

        All_Pointer_Events.forEach(function(event) {
            var on_event = "on" + event;

            test(function() {
              const htmlElement = document.createElement("span");
              const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "g");
              for (var location of [window, htmlElement, svgElement, document]) {
                assert_equals(location[on_event], null,
                  `The default value of the property is null for a ${location.constructor.name} instance`);
              }
            }, "The default value of " + on_event + " is always null");

            test(function() {
              window.eventHappened = '';
              const element = document.querySelector("#target0");
              const compiledHandler = element[on_event];
              assert_equals(typeof compiledHandler, "function", "The " + on_event + " property must be a function");
              compiledHandler();
              assert_equals(window.eventHappened, event, "Calling the handler must run the code");
            }, "The " + on_event + " content attribute must be compiled into the " + on_event + " property");

            var handlerTest = async_test("dispatching a " + event + " event must trigger element." + on_event);
            const element = document.createElement("meta");
            element[on_event] = function(e) {
              handlerTest.step(function() {
                assert_equals(e.currentTarget, element, "The event must be fired at the <meta> element");
              });
              handlerTest.done();
            };
            element.dispatchEvent(new Event(event));
        });
    </script>
    <div id="complete-notice">
    <p>The following pointer types were detected: <span id="pointertype-log"></span>.</p>
    </div>
    <div id="log"></div>
    </body>
</html>
back to top