webdriverio/build/commands/element/dragAndDrop.js

Next-gen browser and mobile automation test framework for Node.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = dragAndDrop;

var _utils = require("../../utils");

const ACTION_BUTTON = 0;

async function dragAndDrop(target, {
  duration = 100
} = {}) {
  if (!target || target.constructor.name !== 'Element' && (typeof target.x !== 'number' || typeof target.y !== 'number')) {
    throw new Error('command dragAndDrop requires an WebdriverIO Element or and object with "x" and "y" variables as first parameter');
  }

  const moveToElement = target.constructor.name === 'Element';

  if (!this.isW3C) {
    await this.moveTo();
    await this.buttonDown(ACTION_BUTTON);

    if (moveToElement) {
      await target.moveTo();
    } else {
      await this.moveToElement(null, target.x, target.y);
    }

    return this.buttonUp(ACTION_BUTTON);
  }

  const {
    scrollX,
    scrollY
  } = await (0, _utils.getScrollPosition)(this);
  const sourceRect = await (0, _utils.getElementRect)(this);
  const sourceX = parseInt(sourceRect.x - scrollX + sourceRect.width / 2, 10);
  const sourceY = parseInt(sourceRect.y - scrollY + sourceRect.height / 2, 10);
  let targetX, targetY;

  if (moveToElement) {
    const targetRect = await (0, _utils.getElementRect)(target);
    targetX = parseInt(targetRect.x - scrollX + targetRect.width / 2, 10) - sourceX;
    targetY = parseInt(targetRect.y - scrollY + targetRect.height / 2, 10) - sourceY;
  } else {
    targetX = target.x;
    targetY = target.y;
  }

  return this.performActions([{
    type: 'pointer',
    id: 'finger1',
    parameters: {
      pointerType: 'mouse'
    },
    actions: [{
      type: 'pointerMove',
      duration: 0,
      x: sourceX,
      y: sourceY
    }, {
      type: 'pointerDown',
      button: ACTION_BUTTON
    }, {
      type: 'pause',
      duration: 10
    }, {
      type: 'pointerMove',
      duration,
      origin: 'pointer',
      x: targetX,
      y: targetY
    }, {
      type: 'pointerUp',
      button: ACTION_BUTTON
    }]
  }]).then(() => this.releaseActions());
}