July 2014

Simulating dragAndDrop event

On Protractor/WebdriverJs we can simulate dragAndDrop in following ways,

this.swapStages = function(){
   var vStage1 = element(by.xpath(“(//div[@class = ‘stage’])[1]”));
   var vStage2 = element(by.xpath(“(//div[@class = ‘stage’])[2]”));
   vProt.actions().dragAndDrop(vStage1, vStage2).perform();
 };

this.swapStages = function(){
   var vStage1 = element(by.xpath(“(//div[@class = ‘stage’])[1]”));
   var vStage2 = element(by.xpath(“(//div[@class = ‘stage’])[2]”));
    vProt.actions().mouseMove(vStage1).
                mouseDown(vStage1).
                mouseMove(vStage2).
                mouseUp(vStage2).
                perform();
    vProt.sleep(5000);
 };

this.swapStages = function(){ var vElement = element(by.xpath(“(//div[@class = ‘stage’])[1]”));
 vProt.actions().dragAndDrop(vElement.find(),{x:40,y:40}).perform();
};

Please note that HTML5 drag events (dragstart, dragend, dragover, dragenter, dragleave, and drop) are not working – https://code.google.com/p/selenium/issues/detail?id=3604