Drag and Drop not behaving as expected

1,098 views
Skip to first unread message

j.wi...@gmail.com

unread,
Jun 5, 2015, 6:32:51 PM6/5/15
to robotframe...@googlegroups.com
I am trying to click on an element and drag it to another element and then release using robot framework and Selenium2Library. I'm having issues with getting mouse down/mouse down on image paired with mouse up to work as well as drag and drop. An example would be going to google and then clicking on the google image and dragging it into the search box and releasing the mouse (I chose this for the visual confirmation that the action worked). The expected result would be that the google page updates with the image in the search and the pre-view of the search performed. Code included below. I tried to include all relevant info, let me know anything I am missing.

Chrome:43
RF:2.8.7
httplibrary:0.4.2
s2l:1.6.0

*** Settings ***
Library    Selenium2Library    run_on_failure=Nothing
Library    HttpLibrary.HTTP

*** Test Cases ***
Google Image Drag Check
    Open Browser    https://www.google.com    gc
    sleep  .2
    #Drag And Drop    id=hplogo    id=sb_ifc0
    Mouse Down On Image    id=hplogo
    #Mouse Down    id=hplogo
    Mouse Up    id=sb_ifc0

Any help appreciated!

Tatu Aalto

unread,
Jun 12, 2015, 2:21:24 AM6/12/15
to j.wi...@gmail.com, robotframework-users

Ugh

I did also tried and could not get it working with chrome (with Drag And Drop keyword). By a quick look, there seems to be issues on functionality on selenium[1] side. But I know Selenium2Library has acceptance test for the keyword, but they are run against Firefox. So have you tried an older version of Firefox?

-Tatu
Send from my mobile
[1] https://code.google.com/p/chromedriver/issues/detail?id=841

--
You received this message because you are subscribed to the Google Groups "robotframework-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to robotframework-u...@googlegroups.com.
To post to this group, send email to robotframe...@googlegroups.com.
Visit this group at http://groups.google.com/group/robotframework-users.
For more options, visit https://groups.google.com/d/optout.

Ana Knyazeva

unread,
Jun 12, 2015, 1:24:32 PM6/12/15
to robotframe...@googlegroups.com, j.wi...@gmail.com
I tested this on Firefox 30.0 and Firefox 38.0.5 and I am seeing it on both.
To unsubscribe from this group and stop receiving emails from it, send an email to robotframework-users+unsub...@googlegroups.com.

HelioGuilherme66

unread,
Jun 12, 2015, 6:42:06 PM6/12/15
to robotframe...@googlegroups.com, j.wi...@gmail.com
The drag and drop acceptance tests usually work with Firefox, Chrome and IExplorer. 
In the example you posted, I cannot drag and drop the image manually. Did you try this?

Anyway the acceptance test is at [1] and it uses the page at [2]. Please note that the dragged elements are div types, see the HTML snippet:

<div class="demo">
   
<div id="draggable" class="ui-widget-content">
     
<p>Drag me to my target</p>
   
</div>
   
<div id="droppable" class="ui-widget-header">
     
<p>Drop here</p>
   
</div>
 
</div>

Hélio

j.wi...@gmail.com

unread,
Jun 16, 2015, 2:08:59 PM6/16/15
to robotframe...@googlegroups.com, j.wi...@gmail.com

Apologies for not responding quicker, I just got back from being out of the office since last Wednesday.

I did manually drag and drop the image into the search box, which acted as I expected (image is loaded into the search and the search preemptively does a preview search). I included images. I forgot to mention I'm using Windows 7.

I did notice locators being potentially picky with drag and drop which is why I also doubled down by testing the mouse down on image+mouse up combination. I would expect them to cover the scenario with an image assuming drag and drop didn't work with images (since it just specifies "Drags element identified with source which is a locator." in the documentation). However mouse down+mouse up did not behave as expected either.

I also thought up this example before I left since the google logo isn't explicitly draggable (as my eventual item to test will be). I wrote this up to test for that:

W3S Image Drag Check
[Tags] w3s
Open Browser http://www.w3schools.com/html/html5_draganddrop.asp gc
sleep .2
#Drag And Drop id=drag1 id=div2
Mouse Down On Image id=drag1 #img_w3slogo.gif
Mouse Up id=div2

The end result for me is still that the image isn't in the drop region.


After reading your reply I set out to find a div only draggable object and ended up with this:

Div Based DnD Example

    [Tags]   elated

    Open Browser    http://www.elated.com/res/File/articles/development/javascript/jquery/drag-and-drop-with-jquery-your-essential-guide/droppable.html    gc

    sleep  .2

    Drag And Drop    id=makeMeDraggable    id=makeMeDroppable

    #Mouse Down    id=makeMeDraggable

    #Mouse Up    id=makeMeDroppable


Which behaves as expected in chrome with the red box moving into the outlined box. (both drag and drop as well as mouse down and mouse up)

So drag and drop appears to be behaving as expected. (assuming that draggable being explicitly required)

This does however raise the question of what are the constraints on mouse up and mouse down. Are they also required to be draggable? If so they are not nearly as robust as the documentation lead me to believe. The documentation only mentions a locator which must be id or name which fits all of these.


Additionally I re-attempted to use FF with my google example which failed initially. One issue was that the mouse was required to be in the fire fox window. A second issue was that the mouse had to be in the search frame for it to properly drop the item (I actually switched from the image to the gmail button since that is a div). However I could not simulate this behavior in ie or gc regardless of mouse position. Unfortunately I need to simulate a mouse down+up/drag and drop accross gc/ie/safari/ff (of which GC is our currently supported browser).


Thanks for the help, been super useful in helping to narrow this down.

dnd_initial.png
dnd_mid.png
dnd_post.png
Reply all
Reply to author
Forward
0 new messages