Drag and Drop not working using Protractor in HTML

2019-09-14 17:31发布

问题:

I have a scenario where i had to drag and drop the columns. However, i tried below commands but none of them are working

browser.actions().mouseDown(elements).perform();
                browser.actions().mouseMove({x:20, y:120}).perform();
               browser.actions().mouseDown(elements).perform();
                browser.actions().mouseMove({x:20, y:120}).perform();
                browser.actions().mouseUp().perform();

browser.actions().dragAndDrop(elements,{x:20 , y:120}).mouseMove(elements).perform();

 browser.actions().dragAndDrop(elements,a).mouseUp().perform()

The command just highlights the column but doesn't drag to the location.

回答1:

I have seen this answer somewhere else so I share it here as well. (Im not the creator of this function!)

browser.actions().mouseDown(el).perform();
browser.actions().mouseMove({x:0, y:100}).perform();
browser.actions().mouseDown(el).perform();
browser.actions().mouseMove({x:0, y:75}).perform();
browser.actions().mouseUp().perform();


回答2:

if the drag&drop functionality was implemented with HTML5 you need simulate the drag&drop events.

See this solution How to simulate a drag and drop action in protractor in angular2?