A cypress child command for drag'n'drop support.
Install using npm:
npm install --save-dev @4tw/cypress-drag-drop
yarn add --dev @4tw/cypress-drag-drop
Before Cypress is loaded (usually in your
commands.js) put the following line:
Or, if you are using ES module syntax:
This will register the
drag command is a child command.
The command only accepts elements.
As the drop target simply pass a selector as string.
In your cypress spec use the command as follows:
The second argument of the
.drag command is an object containing options.
Decide at which position the element should be dropped.
Possible values are topLeft, top, topRight, left, center, right, bottomLeft, bottom, and bottomRight.
The default position is
Force the drag'n'drop interaction. Meaning that the grabbing, moving and dropping is forced. See https://docs.cypress.io/guides/core-concepts/interacting-with-elements.html#Forcing for more information.
The plugin itselt is implemented in the
The tests can be run using cyress:
The test fixtures are under
src/examples/. Using the
setExample cypress command
the fixture is loaded and ready to run tests on. The first attribute in the
is the name of the fixture which needs to be the filename of the component.