使用 Leadfoot 测试拖放

Question

我们正在使用 Intern 和出色的新 Leadfoot 客户端库测试简单的拖放行为。我们的要求很简单：

1. 找到一个元素并移动到它
2. 按下鼠标按钮（拾取可拖动项目）
3. 找到另一个元素并移动到它（拖动）
4. 松开鼠标按钮（放下可拖动项目）
5. 检查发生了什么事情

我希望以下示例语法可以执行此任务：

.findById("MY_DRAGGABLE")
  .moveMouseTo()
  .pressMouseButton()
.end()

.findById("MY_DROP_ZONE")
  .moveMouseTo()
  .releaseMouseButton()
.end()

这不起作用。我已经知道 Selenium 可能有一个特性，并且可能需要一些“移动”来拾取可拖动的东西：

.findById("MY_DRAGGABLE")
  .moveMouseTo()
  .pressMouseButton()
  .moveMouseTo(null, 1, 1)
.end()

这仍然不起作用，实际上要使“拾取”工作，我还必须添加一个 click()：

.findById("MY_DRAGGABLE")
  .moveMouseTo()
  .click()
  .pressMouseButton()
  .moveMouseTo(null, 1, 1)
.end()

这部分现在可以工作，并且可以拾取可拖动，但移动和释放不起作用。事实上，为了让他们做我想做的事，我必须使用一种相当奇怪的语法，它打破了承诺链：

.findById("MY_DROP_ZONE")
  .then(function(element) {
    browser.moveMouseTo(element)
  })
  .releaseMouseButton()
.end()

所以最后我有：

.findById("MY_DRAGGABLE")
  .moveMouseTo()
  .click()
  .pressMouseButton()
  .moveMouseTo(null, 1, 1)
.end()

.findById("MY_DROP_ZONE")
  .then(function(element) {
    browser.moveMouseTo(element)
  })
  .releaseMouseButton()
.end()

我想知道的是我在这里是否缺少关于对象定位的某些内容，或者我们使用的命令是否存在错误？

我们主要在各种平台上的 Firefox 上对此进行测试。

Answer 1

不幸的是，Selenium doesn't support HTML5 drag-and-drop，所以当鼠标按下和释放被浏览器注册时，拖动操作没有。

一种解决方案是使用 JavaScript 来模拟拖放过程。 Leadfoot 的dnd 分支中的DragAndDrop helper 就是一个示例。