如何在 WebdriverIO 中执行拖放操作?
rest assureddynamic programmingprogramming更新于 2025/4/5 7:37:17
WebdriverIO 可以使用 dragAndDrop 方法执行鼠标拖放等操作。通过此方法，我们可以在当前对象(源)上执行点击和长按事件，然后将该对象传递给目标元素。最后，松开鼠标。
语法
let p = $('#loc')
let t = $('#target')
p.dragAndDrop(t)
这里，p 是源定位器，t 是目标定位器。
让我们对以下元素执行拖放功能 −
在上图中，名称为"Drag me to my target"的元素必须被拖放到元素上 -已删除!
示例
代码实现
// 测试套件名称
describe('Tutorialspoint application', function(){
// 测试用例
it('Drag and Drop', function(){
// 启动 URL
browser.url('https://jqueryui.com/droppable/')
// 最大化浏览器
browser.maximizeWindow()
//切换到框架
browser.switchToFrame($(".demo-frame"))
//识别源元素
const src = $('#draggable')
//识别目标元素
const trg = $('#droppable')
//拖放
src.dragAndDrop(trg)
});
});
输出
执行后，名为"Drag me to my target"的元素已被拖放到"Dropped!"元素上。
