RWAP / jquery-ui-touch-punch

A duck punch for adding touch events to jQuery UI
http://touchpunch.furf.com/
103 stars 29 forks source link

initMouseEvent() method is deprecated #33

Closed dustinbolton closed 8 months ago

dustinbolton commented 1 year ago

As per the following page this method should no longer be used: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/MouseEvent

The event constructor MouseEvent() should be used instead. It would be good to update this great tool for future-proofing.

melloware commented 1 year ago

@dustinbolton did you want to submit a PR?

RWAP commented 1 year ago

Just looking at the code, is it as simple as re-writing the function simulateMouseEvent:

  function simulateMouseEvent (event, simulatedType) {

    // Ignore multi-touch events
    if (event.originalEvent.touches.length > 1) {
      return;
    }

    //Ignore input or textarea elements so user can still enter text
    if ($(event.target).is("input") || $(event.target).is("textarea")) {
      return;
    }

    // Prevent "Ignored attempt to cancel a touchmove event with cancelable=false" errors
    if (event.cancelable) {
      event.preventDefault();
    }

    let touch = event.originalEvent.changedTouches[0],
        simulatedEvent = document.createEvent('MouseEvents');

    // Initialize the simulated mouse event using the touch event's coordinates
    simulatedEvent.MouseEvent(simulatedType, {
      bubbles: true,
      cancelable: true,
      view:window,
      screenX:touch.screenX,
      screenY:touch.screenY,
      clientX:touch.clientX, 
      clientY:touch.clientY
    });

    // Dispatch the simulated event to the target element
    event.target.dispatchEvent(simulatedEvent);
  }
RWAP commented 8 months ago

This appears to work and has now been incoporated in the v1.1.0 code.