Drag and drop (webpage)

Ask general questions here.
cs97jjm3
Posts: 33
Joined: Mon Jan 14, 2019 4:30 pm

Drag and drop (webpage)

Post by cs97jjm3 » Fri Mar 06, 2020 4:21 pm

Hello, hope someone can help.

I have a page which allows drag and drop.

i can select but when i use the move function i get out of bounds errors

i am trying to move the green blob Snow, Sandra to 1700 on the same row:
Daily.rxsnp
(123.86 KiB) Downloaded 6 times
I am not a coder: so please be gentle
Attachments
daily.png
daily.png (64.28 KiB) Viewed 247 times

User avatar
Vega
Certified Professional
Certified Professional
Posts: 222
Joined: Mon Jul 11, 2016 2:15 pm

Re: Drag and drop (webpage)

Post by Vega » Fri Mar 06, 2020 8:08 pm

Are you using a custom implementation for your drag and drop functionality or are you using the Drag and Drop method from the Ranorex automation helpers?

If you are not using the Ranorex automation helpers, I would suggest starting there:

https://www.ranorex.com/help/latest/han ... g-started/

Code: Select all

User code methods
The user code methods included in the Ranorex Automation Helpers can be accessed in the ⇢ user code library. Select the desired method, define the required strings, and confirm your selection.

DragNDropLibrary
DragAndDrop
Picks the source element, drags it to the target element and drops it there.

...
hope this helps

cs97jjm3
Posts: 33
Joined: Mon Jan 14, 2019 4:30 pm

Re: Drag and drop (webpage)

Post by cs97jjm3 » Mon Mar 09, 2020 10:03 am

Neither: thanks i will check this out

cs97jjm3
Posts: 33
Joined: Mon Jan 14, 2019 4:30 pm

Re: Drag and drop (webpage)

Post by cs97jjm3 » Mon Mar 09, 2020 10:31 am

Hello again: i could not find
DragNDropLibrary in Nuget Application Helpers

User avatar
odklizec
Ranorex Guru
Ranorex Guru
Posts: 6180
Joined: Mon Aug 13, 2012 9:54 am
Location: Zilina, Slovakia

Re: Drag and drop (webpage)

Post by odklizec » Mon Mar 09, 2020 10:45 am

Hi,

Could you please show us, how exactly do you perform the drag&drop operation? For example, post a screenshot of the recording table.

The problem is, that there is no "table" or "cells" to track. There is a number of divs, mimicking the table, where "cells" are mimicked by vertical "tabs" ;)

What you need to do, in case you want to drop something to "cell" belonging to 17:00 column, is to first detect the child index of header cell 17:00 (childindex=17). And then find vertical tab with the same childindex.
Here is the xpath to detect the header cell "17:00", from which you need to take the childindex value and store it in variable (e.g. varCelIndex):
/dom[@domain='test2.mywebroster.com']//div[#'pane_2']//div[@class='header-container']/div[@innertext='17:00']
And here is the xpath to detect the cell split bar belonging to cell "17:00"
/dom[@domain='test2.mywebroster.com']//div[#'pane_2']//div[@class='body-container']/div[@Childindex=$varCelIndex]

Of course, you can completely skip the part where you detect childindex od header cell and simply insert "17 in repo xpath, but I personally don't like such hardcoded approach. It's always better to detect element based of the label or another identification attribute, either directly from the element in question or its ancestor or sibling.

Once the appropriate "cell" is detected, you may need to release the mouse not directly over the split element, but rather on the split bar + few pixels position? But this may need some tests ;)
Pavel Kudrys
Ranorex explorer at Descartes Systems

Please add these details to your questions:
  • Ranorex Snapshot. Learn how to create one >here<
  • Ranorex xPath of problematic element(s)
  • Ranorex version
  • OS version
  • HW configuration

User avatar
odklizec
Ranorex Guru
Ranorex Guru
Posts: 6180
Joined: Mon Aug 13, 2012 9:54 am
Location: Zilina, Slovakia

Re: Drag and drop (webpage)

Post by odklizec » Mon Mar 09, 2020 2:28 pm

Hi,
cs97jjm3 wrote:
Mon Mar 09, 2020 10:31 am
Hello again: i could not find
DragNDropLibrary in Nuget Application Helpers
There is no Drag&Drop library in nuget packages. You must find and install Ranorex Automation Helpers where you can find Drag&Drop code module. For more details about Ranorex automation helpers read Ranorex user guide...
https://www.ranorex.com/help/latest/han ... g-started/
Pavel Kudrys
Ranorex explorer at Descartes Systems

Please add these details to your questions:
  • Ranorex Snapshot. Learn how to create one >here<
  • Ranorex xPath of problematic element(s)
  • Ranorex version
  • OS version
  • HW configuration

User avatar
Vega
Certified Professional
Certified Professional
Posts: 222
Joined: Mon Jul 11, 2016 2:15 pm

Re: Drag and drop (webpage)

Post by Vega » Wed Mar 11, 2020 4:23 pm

cs97jjm3 wrote:
Mon Mar 09, 2020 10:31 am
Hello again: i could not find
DragNDropLibrary in Nuget Application Helpers
As Pavel mentioned, there is no nuget package specifically for drag and drop. What you want to do is add the Ranorex automation helpers, and then when you create a new user code method, chose 'Select from library'. Here you will see tons of pre-built methods for you to chose from. Once of them is DragAndDrop. I would highly recommend checking out the documentation (there is a webinar too) but overall here are the high level steps:

https://www.ranorex.com/help/latest/han ... g-started/
  1. Right click your solution -> Ranorex Autiomation helpers -> Add
  2. Right click your solution -> Ranorex Autiomation helpers -> Update
  3. Open any recording module
  4. Add new action -> User code -> Select from library
  5. Pick DragAndDrop
hope this helps

cs97jjm3
Posts: 33
Joined: Mon Jan 14, 2019 4:30 pm

Re: Drag and drop (webpage)

Post by cs97jjm3 » Thu Mar 12, 2020 11:18 am

Thanks i have been pushed to another project for a bit: but thanks i will will re investigate this very soon