In case you need custom drag & drop (or similar actions) performed you should implement a custom helper following commands from webdriverio api.
There are two versions of API:
- JsonWire Protocol (currently used in Chrome)
- WebDriver protocol (used for Firefox).
So for compatibility, you should implement Drag & Drop for both using different methods.
Here is my sample function to drag by a specific offset:
// inside a helper
async dragToPoint(el, x, y) {
const browser = this.helpers.WebDriver.browser;
await this.helpers.WebDriver.moveCursorTo(el);
if (browser.isW3C) {
// W3C version
return browser.performActions([
{"type": "pointerDown", "button": 0},
{"type": "pointerMove", "origin": "pointer", "duration": 1000, x, y },
{"type": "pointerUp", "button": 0}
]);
}
// JSON Wire version
await browser.buttonDown(0);
await browser.moveToElement(null, x, y);
await browser.buttonUp(0);
}