Selenium Webdriver drag and drop NOT working in Chrome - selenium-webdriver

I used the below code for drag and drop. It worked in Firefoxdriver but NOT in chromedriver.
WebElement dragElement = driver.findElement(By.id(dragid1));
WebElement dropElement = driver.findElement(By.id(dropid1));
Actions builder = new Actions(driver);
Action drag = builder.clickAndHold(dragElement).build();
drag.perform();
Action move = builder.moveByOffset(355, -20).build();
move.perform();
TimeUnit.SECONDS.sleep(2);
Actions release = builder.clickAndHold(dropElement).release();
release.perform();
Please Help!

If you have both source and target IDs, then why don't you try to use drag and drop?
I'm not very good with Java, but here's how I've done it in Python. I hope it helps you a bit.
from selenium.webdriver.common.action_chains import ActionChains
actionChains = ActionChains(driver)
actionChains.drag_and_drop(dragElement, dropElement).perform()

Tried below sample code with chromedriver:2.15, chrome:v43 and is working fine with Chrome.
Sample Code:
System.setProperty("webdriver.chrome.driver","drivers/chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.manage().timeouts().implicitlyWait(1,TimeUnit.MINUTES);
driver.get("http://jqueryui.com/droppable");
driver.switchTo().frame(0);
WebElement dragElement = driver.findElement(By.id("draggable"));
WebElement dropElement = driver.findElement(By.id("droppable"));
Actions builder = new Actions(driver);
builder.clickAndHold(dragElement).moveToElement(dropElement).release().build().perform();

Try bundling all those seperate Action objects into a single Actions object
Actions act = new Actions(driver);
act.ClickAndHold(dragElement );
act.MoveToElement(dropElement );
act.Release(dragElement );
act.Build().Perform();
Note: For me, in Chrome & IE, sometimes just dragging to an Element was not enough to make it stick there, and I would have to add in an extra act.MoveByOffset(0, 5); before releasing to move just a few pixels, which seems to work
Is there a reason you have to wait for 2 seconds before releasing, or is that just what worked in FF?

I had the same problem but got to override it like this:
//Setup robot
Robot robot = new Robot();
robot.setAutoDelay(50);
//Maximized browser:
robot.keyPress(KeyEvent.VK_F11);
Thread.sleep(2000);
WebElement dragElement = driver.findElement(drag_element);
Actions builder = new Actions(driver);
builder.dragAndDropBy(dragElement,0, 200).build().perform();

Related

Hover Electronics -> Mobiles and Click using Selenium in Flipkart UI using Chrome

Actions action = new Actions(driver);
WebElement we = driver.findElement(By.xpath("//*[#id=\"container\"]/div/div[2]/div/ul/li[1]/span"));
action.moveToElement(we).moveToElement(driver.findElement(By.xpath("//*[#id=\"container\"]/div/div[2]/div/ul/li[1]/ul/li/ul/li[1]/ul/li[1]/a[#href='/mobile-phones-store?otracker=nmenu_sub_Electronics_0_Mobiles']"))).click().build().perform();
I am trying to hover and click using xpath. The code is not throwing any error but it is still unable to perform click option after hover.
Try with the below code snippet. I have tested it with chrome driver and works fine.
WebElement electronics_menuname = driver.findElement(By.xpath("//span[contains(text(),'Electronics')]"));
Actions builder = new Actions(driver);
builder.moveToElement(electronics_menuname).build().perform();
WebElement mobile_menu_button = driver.findElement(By.xpath("//li[#class='_1KCOnI _2BfSTw _1h5QLb _3ZgIXy']//a[contains(text(),'Mobiles')]"));
new WebDriverWait(driver,20).until(ExpectedConditions.elementToBeClickable(mobile_menu_button)).click();

Draw on a Canvas Using Selenium

I'm using selenium with java (latest for both). Trying to draw on a small canvas area inside a modal in our webapp. The library we used for our canvas was 'signature pad js'. I have confirmed it is not inside an iframe or anything tricky that could be the problem (it's just a regular div.modal-body with a div.signature-input canvas element).
But it is not doing anything. Have looked at many posts here on stackoverflow and most of them seem pretty identical with few variations to try (I've been trying them all).
Here's the latest code I tried:
// Draw a signature of some sort
WebElement element = driver.findElement(Using.locator(SIGNATURE_AREA)); // canvas element
Actions builder = new Actions(driver);
builder.clickAndHold(element).moveByOffset(10, 50).
moveByOffset(50,10).
moveByOffset(-10,-50).
moveByOffset(-50,-10).release().perform();
I've tried all sorts of offsets, and such to no avail.
If anyone has experience with this, would really love a hand.
I think your issue is in the code , I've done this with ruby and it worked fine.. Code in Ruby below (worked in FireFox)
driver.find_element(:xpath, "html/body/div[1]/div[5]/div[2]/canvas").click
element = driver.find_element(:xpath, "html/body/div[1]/div[5]/div[2]/canvas");
driver.action.move_to(element).perform
driver.action.click_and_hold(element).perform
driver.action.move_by(150, 50).click.perform
driver.action.move_to(element).perform
driver.action.click_and_hold(element).perform
driver.action.move_by(100, 50).click.perform
driver.action.move_to(element).perform
driver.action.click_and_hold(element).perform
driver.action.move_by(300, 10).click.perform
sleep (5)
So I have tried same thing using Java for you , and its working fine , Its drawing two lines as expected. The trick is that moveby should not be followed with a click otherwise it will loose focus. Below code is working fine in java and chrome . I used https://sketchtoy.com/ to draw on canvas
public class BrowserTesting {
WebDriver driver;
#Test
public void test1() throws InterruptedException {
//WebDriverManager.chromedriver().setup();
System.setProperty("webdriver.chrome.driver","C:\\Users\\pathtyourchrome\\chromedriver.exe");
ChromeOptions options = new ChromeOptions();
options.setExperimentalOption("useAutomationExtension", false);
//disable automation info bar
options.addArguments("disable-infobars");
driver = new ChromeDriver(options);
driver.get("https://sketchtoy.com/");
WebElement element = driver.findElement(By.xpath("//div[#class='sketch-canvas-container']/canvas"));//canvas element
Actions builder = new Actions(driver);
builder.moveToElement(element).perform();
builder.clickAndHold(element).perform();
builder.moveByOffset(150, 50).perform();
builder.moveToElement(element).perform();
builder.clickAndHold(element).perform();
builder.moveByOffset(100, 50).perform();
builder.moveToElement(element).perform();
Thread.sleep(5000);
//driver.quit();
}
}
See this screen shot for the drawing:
Let me know if this worked!

Drag and drop not executing in chrome

HI I am working on this webdriver program with chrome browser. All are working fine except this drag and drop function.
It is not throwing me the error but it is still not executing the action. Can you help me with this. Thanks
WebElement name = driver.findElement(By.xpath("xpath id"));
WebElement target = driver.findElement(By.xpath("xpath id"));
Actions builder = new Actions(driver);
Action dragAndDrop = builder.clickAndHold(name)
.moveToElement(target)
.release(target)
.build();
dragAndDrop.perform();
}
Seems to be this Chrome bug (just run into this myself) https://code.google.com/p/chromedriver/issues/detail?id=841
The same code worked fine in Firefox.

Right Click Drag and Drop Selenium Webdriver

so I'm trying to perform a right click drag and drop using Selenium webdriver, I was wondering if anyone had any ideas on how to do this?
I have tried using ActionChains to do it, but they dont seem to run.
For right click with mouse you can use
WebElement elementToRightClick = driver.findElement(By.id("gbqfba"));
Actions clicker = new Actions(driver);
clicker.contextClick(elementToRightClick).perform();
For drag&drop, you can use
Actions builder = new Actions(driver);
Action dragAndDrop = builder.clickAndHold(source Element).moveToElement(target Element).release(target Element).build();
dragAndDrop.perform();
(or)
Actions builder = new Actions(driver);
Action dragAndDrop = builder.dragAndDrop(source Element, target Element).build();
dragAndDrop.perform();

Is drag-and-drop possible in chrome-webdriver?

I cannot get drag-and drop working with the Java Junit WebDriver bindings. I am working with Google Chrome on Windows.I have used below code,but i did not work.
{WebElement draggable = driver.findElement(By.id("source"));
WebElement to = driver.findElement(By.id("target"));
Actions builder = new Actions(driver);
builder.dragAndDrop(element, to).build().perform();
builder.clickAndHold(element).moveToElement(to).release(to).build().perform();}
Please try the following solution (it works for us):
WebElement dragArea = driver.findElement(By.cssSelector("#" + idDragProduct"));
WebElement to = driver.findElement(By.cssSelector("#" + idTarget));
new Actions(driver).clickAndHold(dragArea).moveToElement(to).release().build().perform();
In case you want to try and test drag-and-drop as functionality, it's not neccesary to move it to another element.
You can do:
WebElement to = driver.findElement(By.cssSelector("#" + idTarget));
new Actions(driver).clickAndHold(dragArea).moveByOffset(X_OFF,Y_OFF).release().build().perform();

Resources