Drag and Drop Operation using Selenium WebDriver

October 7, 2016

“Drag and Drop” is another mouse operation which means grabbing a WebElement and dropping it at another location. Selenium WebDriver provides Actions class to perform all mouse operations, and the method id dragAndDrop();

This operation can also we performed in another way. Let us understand both ways with an example:

Scenario:

  1. Navigate to https://jqueryui.com/droppable/
  2. There are two WebElements “Drag me to my target” and “Drop here”
  3. Grab the first WebElement, move it other and drop there.

Refer below image:

Drag and Drop

Refer the code here:

Here, in the above code, the two Web Elements “Draggable” and “Dropable” are in a frame. So we have to first switch to a frame before performing the further operations.

Identify both Web Elements:

Perform Drag and Drop Operation: Actions class provides a method called dragAndDrop(source, target);

Drag and Drop can also be performed in another way, see below code:

First, we are moving to a particular WebElement, click and hold this web element, then move to other WebElement and then release it.

I hope you enjoyed this article, I tried to explain it with a simple example.

For any questions, queries, or feedback feel free to write us at support@qatechhub.com or saurabh@qatechhub.com. Happy Learning 🙂

Saurabh

About the Author

Saurabh

Follow Saurabh:

Leave a Comment: