@wix/design-system/dist/cjs/utils/DragAndDrop/dragAndDropPlaywrightDriverFactory.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.dragAndDropPlaywrightDriverFactory = void 0;
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var dragAndDropPlaywrightDriverFactory = _ref => {
  var {
    base
  } = _ref;
  return {
    beginDrag: function () {
      var _beginDrag = (0, _asyncToGenerator2.default)(function* (_ref2) {
        var {
          dataHook
        } = _ref2;
        var baseLocator = yield base.unwrap();

        // Use evaluate to dispatch synthetic events like Puppeteer does
        yield baseLocator.evaluate((baseElement, sourceDataHook) => {
          var sourceElement = baseElement.querySelector("[data-hook=\"".concat(sourceDataHook, "\"]"));
          if (!sourceElement) {
            throw new Error("Element with data-hook=\"".concat(sourceDataHook, "\" not found"));
          }
          var {
            x,
            y,
            height
          } = sourceElement.getBoundingClientRect();
          sourceElement.dispatchEvent(new MouseEvent('mousedown', {
            bubbles: true,
            clientX: x,
            clientY: y + height / 2
          }));
        }, dataHook);
      });
      function beginDrag(_x) {
        return _beginDrag.apply(this, arguments);
      }
      return beginDrag;
    }(),
    dragOver: function () {
      var _dragOver = (0, _asyncToGenerator2.default)(function* (_ref3) {
        var {
          dataHook,
          offset
        } = _ref3;
        var baseLocator = yield base.unwrap();
        var moveMouseToNewPosition = () => baseLocator.evaluate((baseElement, args) => {
          var destinationElement = baseElement.querySelector("[data-hook=\"".concat(args.destinationDataHook, "\"]"));
          if (!destinationElement) {
            throw new Error("Element with data-hook=\"".concat(args.destinationDataHook, "\" not found"));
          }
          var {
            x,
            y,
            height
          } = destinationElement.getBoundingClientRect();
          var eventOptions = {
            bubbles: true,
            clientX: args.xAxisOffset ? x + args.xAxisOffset : x,
            clientY: y + height / 2
          };
          baseElement.dispatchEvent(new MouseEvent('mousemove', eventOptions));
        }, {
          destinationDataHook: dataHook,
          xAxisOffset: offset == null ? void 0 : offset.x
        });

        // Move twice to ensure proper drag-over registration (same as Puppeteer driver)
        yield moveMouseToNewPosition();
        yield moveMouseToNewPosition();
      });
      function dragOver(_x2) {
        return _dragOver.apply(this, arguments);
      }
      return dragOver;
    }(),
    endDrag: function () {
      var _endDrag = (0, _asyncToGenerator2.default)(function* () {
        var baseLocator = yield base.unwrap();
        yield baseLocator.evaluate(baseElement => {
          baseElement.dispatchEvent(new MouseEvent('mouseup', {
            bubbles: true
          }));
        });
      });
      function endDrag() {
        return _endDrag.apply(this, arguments);
      }
      return endDrag;
    }()
  };
};
exports.dragAndDropPlaywrightDriverFactory = dragAndDropPlaywrightDriverFactory;
//# sourceMappingURL=dragAndDropPlaywrightDriverFactory.js.map