Is it possible to trigger mouse events on the pixi canvas element using cypress for automation testing?

[fakob]

Hi,
we are using cypress tests in our project. There are issues with webgl and cypress when it comes to interactivity and test recordings, but in general it works ok.

However, we are unfortunately not able to cover a large section of our project, as we can not trigger mouse events on the pixi canvas element to simulate mousedown/mousemove/mouseup/...

I found this old issue discussing automation testing, but no solution. I assume it is not possible, but still hope that someone can proof me wrong :-)

[fakob]

Seems that I have found a solution for it. Using the following plugin worked. https://github.com/dmtrKovalenko/cypress-real-events
I still had to fiddle a bit with the timings, but this is how a drag action looked like:

  const dragFromAtoB = (startX, startY, endX, endY) => {
    cy.get('body')
      .realMouseMove(startX, startY)
      .realMouseDown({ x: startX, y: startY })
      .realMouseMove(endX, endY)
      .realMouseUp({ x: endX, y: endY });
    cy.wait(1000);
  };