Testing D3.js drag events with Cypress.js

I have an SVG object which uses d3-zoom for zoom and pan functionality. It works flawlessly but the problem showed up when I started to work on integration tests using Cypress.js.

I tried using standard mouse events on SVG element to simulate the Drag behavior:

cy.get('svg')
  .trigger('mousedown', { which: 1, force: true })
  .trigger('mousemove', { position: 'left' })
  .trigger('mouseup', { position: 'left', force: true });

The example above is taken from Cypress drag and drop recipe and it's followed by an error cannot read property document of undefined in nodrag.js file.

Below you can see where the error occurs (view is undefined).

__webpack_exports__["default"] = (function(view) {
  var root = view.document.documentElement,
  ...

I spent a lot of hours trying to trigger the event in another way but without a success - like trying the snippet above with SVG container.

Please keep in mind that I cannot access any d3.js package from Cypress test because it's imported as npm package in React application.

Thank you in advance for you help!

from Testing D3.js drag events with Cypress.js