7

How do I drag and drop an object from one grid to another in the same page using Selenium IDE. This is a web page, and it is designed in ExtJS. Please help me out doing this using the IDE.

6

http://www.software-testing-tutorials-automation.com/2013/06/selenium-draganddrop-and.html

In Selenium IDE there are 2 main drag and drop commands;


(1) dragAndDrop - Locates the target element and drags the element by x pixels horizontally and y pixels vertically.

In the IDE this should look like;

Command  -  dragAndDrop<br/>
Target   -  [ locator of the target element ]<br/>
Value    -  [ (x-pixels),(y-pixels) ]  <br/>

where x-pixels/y-pixels can be negative (left/up respectively) or positive (right/down respectively)


(2) dragAndDropToObject - Locates the target element and drags the element to the centre pixel location of the destination element

In the IDE this should look like;

Command  -  dragAndDropToObject<br/>
Target   -  [ locator of the target element ]<br/>
Value    -  [ locator of the destination element to drop it on top of ]<br/>

The other drag and drop commands impose the -AndWait suffix, so assume that in response to the drag and drop done a request is sent and selenium should wait for the page to reload.

1

The functions (APIs) available in selenium for drag and drop do not work properly. So my suggestion for the drag and drop, can be resolved by the below code:

selenium.mouseDown(fromLocator, "0,0");
selenium.mouseMove(toLocator, "0,0");
selenium.mouseUp(toLocator, "0,0");

Please try and let us post your observation.

1

Our pages are programmed with extJS too and I managed to drag and drop elements with the following steps:

  • mouseOver
  • mouseDownAt
  • MouseMoveAt
  • MouseUpAt

But for me it is just possible if the element is visible at loading of the element. When I have to scroll to the element to get it visible, I did not find a way to drag 'n drop it.

-3

For "dragAndDropToObject":

If you want to drag "A" and drop to Location of "B"

Command: dragAndDropToObject Target: enter the Xpath or CSS path of A value: enter the Xpath or CSS path of B

Hope it helps.

  • 1
    How is this a different (or more informative) answer than pmafi's answer below? – Suchit Parikh Oct 1 '12 at 22:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.