Drag and Drop in selenium:

 

What is Drag and Drop:

  • HTML drag and drop interface enables applications to use drag and drop features in Firefox and other browsers.
  • With these characteristics, the user can select draggable elements with the mouse, dragging the elements into a droppable element, releasing the mouse button and leaving those elements.
  • One Drag Element can be Drop into Other Element.

 

Different Methods to Perform Drag and Drop:

  1. Drag and Drop using Action Class dragAndDrop Method.
  2. Drag and Drop using clickAndHold, moveToElement and release Method.
  3. Drag and Drop using dragAndDropBy and offset method.

 

1. Drag and Drop using Action Class dragAndDrop method:

  • dragAndDrop is an inbuilt method in the Actions class.
  • Then using the dragAndDrop inbuilt method we pass Drag and Drop elements and do build(.perform() operation.

 

 

Example of Drag and Drop using dragAndDrop method: 

 

2. Drag and Drop using clickAndHold, moveToElement and release Method.

  1. Hold the source
  2. Move the element
  3. Release the element

 

The different methods of Action class we will be using here for Drag and Drop in Selenium:

  • clickAndHold(WebElement element) – Clicks a web element at the middle(without releasing).
  • moveToElement(WebElement element) – Moves the mouse pointer to the middle of the web element without clicking.
  • release(WebElement element) – Releases the left click (which is in pressed state).
  • build() – Generates a composite action

 

DragandDrop using clickAndHold, moveToElement and release method:

 

Example of DragandDrop using clickAndHold, moveToElement and release method:

 

3. Drag and Drop using dragAndDropBy and offset method:

  • Using dragAndDropBy Method we drop WebElement on particular WebPage offset location.

 

Example of Drag and Drop using dragAndDropBy and offset method: