Question

是否有一些秘密方法可以使它正常工作？

我们正在使用可拖动库在用户界面中执行此操作。

https://github.com/Shopify/draggable/tree/master/src/Draggable

我正在尝试使用赛普拉斯自动化运行器将一列拖到下一列。

这是我的代码：

cy.get(dataExplorerTableAttributeDraggable)
      .eq(0)
      .trigger('mousedown', { which: 1 });
    cy.get(dataExplorerTableAttributeDraggable)
      .eq(1)
      .trigger('mousemove')
      .trigger('mouseup');

执行此代码没有任何可见结果。

也尝试过：

cy.get(dataExplorerTableAttributeDraggable)
      .eq(2)
      .trigger('mousedown', { which: 1 })
      .trigger('dragstart', {})
      .trigger('drag', {});
    cy.get(dataExplorerTableAttributeDraggable)
      .eq(0)
      .trigger('dragover')
      .trigger('drop')
      .trigger('dragend')
      .trigger('mouseup');

我必须明确指出，我需要自动化来实际执行拖放操作，而不仅仅是触发事件。

我想念什么？

Answer 1

我什至也遇到过类似的问题；唯一可以帮助我进行设置的调整-{clientX: 505, clientY: 357}

cy.get(etlWidget)
    .trigger('mouseover')
    .trigger('mousedown', {which: 1})
    .trigger('mousemove', {clientX: 505, clientY: 357})
    .xpath(PageElements.workflow.x_initial_drop_target_area)
    .trigger('mousemove')
    .trigger('mouseup', {force: true})

仅供参考，您必须收听浏览器事件并设置这些详细信息。此处有更多详细信息-https://developers.google.com/web/tools/chrome-devtools/console/events

此外，我认为这将仅在固定视口上运行。请查看是否有帮助。

Answer 2

问题描述

我遇到了同样的问题，但是我没有使用任何库。

问题是我在代码中某处进行了事件类型检查，例如：

if (event instanceof MouseEvent) {
    /* this never gets executed in Cypress but works fine when manually testing in browser */
}

经过一些调试后，我发现mousedown event（从Cypress发射）是Event的实例，但来自不同的环境（event instanceof Event总是返回false）。我从来没有深入研究过，所以我对此可能是错的。

无论如何，对我来说，解决方案是使用MouseEvent中的cy.window()在Cypress中触发本机JavaScript事件。

可能的解决方案

现在，环顾四周您正在使用的库之后，我看到它使用了诸如DragMouseEvent之类的事件，这些事件可能与我遇到的问题相同。如果是这种情况，我想以下代码可以使其正常工作（我尚未测试）：

cy.window().then(win => { cy.get(dataExplorerTableAttributeDraggable) .eq(0) .then($element => $element[0].dispatchEvent(new win.MouseEvent('mousedown', {button: 1, clientX: 100, clientY: 100}))); cy.get(dataExplorerTableAttributeDraggable) .eq(1) .then($element => $element[0].dispatchEvent(new win.MouseEvent('mousemove', {clientX: 100, clientY: 100}))) .then($element => $element[0].dispatchEvent(new win.MouseEvent('mouseup', {clientX: 100, clientY: 100}))); })

请注意，$element是jQuery包装的元素。另外，clientX和clientY应该在您要拖动的页面中具有适当位置的元素位置值（100只是占位符）。

上述问题的替代解决方案是在代码中执行鸭子式检查，如下所示：

if (event.pageX && event.pageY) { /* this now gets executed in Cypress and when manually testing in browser */ }

这仅在您编写自己的代码（不使用库）的情况下有效。

Answer 3

我也遇到过类似的问题。我试图在以下元素中触发拖放操作：

cy.wrap

但是没有用。我通过在返回的元素中使用cy.selectTag() .contains('Car') .parent('div.tag') .then(($el) => { cy.wrap($el) .trigger('mousedown', { button: 0 }) .trigger('mousemove', { clientX: 100, clientY: 0 }) .trigger('mouseup'); });来修复它。

cy.wrap

我的观察-如果没有trigger，则元素对象（$ el）在原型中没有$process = Invoke-Command -ComputerName "vmonnetwork" -ScriptBlock { Get-Process -name "powershell" -IncludeUserName } | Select-Object UserName if ($process -eq "userA") { Write-Host "Process is running" } else { Write-host "Process is not running" }方法。

带有mousedown，mousemove和mouseup的Cypress .trigger命令不起作用

3 个答案:

问题描述

可能的解决方案