javascript - 为什么在 cypress.io 中拖放不能按预期工作？

Question

我正在尝试在网站上自动化一个简单的拖放场景。

https://gojs.net/latest/samples/htmldragdrop.html

我将按照 cypress doc 中提供的方法进行

https://github.com/cypress-io/cypress-example-recipes/blob/master/examples/testing-dom__drag-drop/cypress/integration/drag_n_drop_spec.js

我的示例测试用例是：

 cy.visit("https://gojs.net/latest/samples/htmldragdrop.html")
      cy.get('#paletteZone .draggable').first().trigger('mousedown', { which: 1 })
      .trigger('mousemove', { clientX: 500, clientY: 500 }) 
      .trigger('mouseup', { force: true })

运行相同后：

赛普拉斯专注于触发 mousedown 我想要拖动的元素，但在 mousemove 的步骤上 - 当我使用“之前”和“之后”状态检查相同的内容时没有发生任何事情。已经尝试过不同的放置位置，只是为了确保它与 x,y 坐标问题无关，但徒劳无功。请帮忙

编辑 1：能够使用赛普拉斯网站本身提供的插件拖放相同的内容，即 '@4tw/cypress-drag-drop' 。这在同一个网站上就像魅力一样

  cy.get('#paletteZone .draggable').first().drag('canvas','center') 

但是当我在不同的网站上尝试相同的（仅用于测试目的，我不拥有相同的）时，该插件也有问题。 https://www.seleniumeasy.com/test/drag-and-drop-demo.html

  cy.visit("https://www.seleniumeasy.com/test/drag-and-drop-demo.html")
        //cy.viewport(1600, 800)
        cy.get('#todrag span').first().drag('#mydropzone','center')
        cy.get('#todrag span').first().drag('#mydropzone','center')
        cy.get('#todrag span').first().drag('#mydropzone','center')
        cy.get('#todrag span').first().drag('#mydropzone','center')

在实际的网站上，左侧的可拖动项目被删除并放置在右侧，但在运行我的代码后 - 尽管项目被添加到右侧，但它们并没有从左侧 div 中删除。我们需要在这里添加什么吗（在我的屏幕截图中 - 代码运行后 Draggagble 1 不应该出现）

标签： javascriptautomated-testscypressbrowser-automation