This is a migrated thread and some comments may be shown as answers.

Randomize Drag and Drop

8 Answers 203 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Dan
Top achievements
Rank 1
Dan asked on 30 Aug 2012, 08:28 PM
Hi,

I need to test the ability for a web application to draw a box(using drag and drop).  My script needs to be able to draw a box in a unique location every time i run it.  So i need to randomize where the boxes are drawn AND make sure that boxes are not drawn in areas where there is already a box.  Is there an easy solution for this using a coded step or using the Telerik UI itself?  Any help is much appreciated!

Thanks,
Dan

8 Answers, 1 is accepted

Sort by
0
Stoich
Telerik team
answered on 04 Sep 2012, 01:22 PM
Hi Dan,
you'll have to resort to coding for this.

The Telerik Testing Framwork allows for drag and drop actions based on coordinates:
http://www.telerik.com/automated-testing-tools/support/documentation/user-guide/write-tests-in-code/intermediate-topics/html-control-suite/drag-and-drop-using-html-classes.aspx

Additionally, you can get the coordinates of exiting element through the Rectangle class:
The code that does that might look something like this:
HtmlControl button = Find.ById("buttonId");
      Rectangle r = button.GetRectangle();
      String height = r.Height;

As you can probably tell this is fairly advanced stuff and you will have to spend some time familiarizing yourself with API. Let me know if you require additional assistance with any of this.

Kind regards,
Stoich
the Telerik team
Quickly become an expert in Test Studio, check out our new training sessions!
Test Studio Trainings
0
Dan
Top achievements
Rank 1
answered on 06 Sep 2012, 06:56 PM
Hi Stoich,

So to create a drag and drop events based on start and end coordinates would be this?

DragDrop(startX, startY, endX, endY);

I am getting a compilation failure with the following message:

"An object reference is required for the non-static field, method, or property 'ArtOfTest.WebAii.Win32.Mouse.DragDrop(int, int, int, int)'"
0
Dan
Top achievements
Rank 1
answered on 06 Sep 2012, 07:56 PM
my references are  as follows:

using Telerik.TestingFramework.Controls.KendoUI;
using Telerik.WebAii.Controls.Html;
using Telerik.WebAii.Controls.Xaml;
using System;
using System.Collections.Generic;
using System.Text;
using System.Linq;
using System.Windows.Forms;
using System.Data.SqlClient;
using System.Web;
using System.Web.Services;

using ArtOfTest.Common.UnitTesting;
using ArtOfTest.WebAii;
using ArtOfTest.WebAii.Core;
using ArtOfTest.WebAii.Controls.HtmlControls;
using ArtOfTest.WebAii.Controls.HtmlControls.HtmlAsserts;
using ArtOfTest.WebAii.Design;
using ArtOfTest.WebAii.Design.Execution;
using ArtOfTest.WebAii.ObjectModel;
using ArtOfTest.WebAii.Silverlight;
using ArtOfTest.WebAii.Silverlight.UI;
using ArtOfTest.WebAii.Win32;

I also tried:
Manager.Desktop.Mouse.Click(startX, startY);
Manager.Desktop.Mouse.DragDrop(startX, startY, endX, endY);

where i have defined the coordinates earlier in the method. 

but i'm getting this message in the log:
"An object reference is required for the non-static field, method, or property 'ArtOfTest.WebAii.Core.Manager.Desktop.get' "




0
Stoich
Telerik team
answered on 12 Sep 2012, 08:33 AM
Hi Dan,
here's simple example of how to do drag-n-drop in code:
You have the following page:
http://www.javascriptkit.com/howto/drag.shtml

The page contains two cartoony images of cars - both of those are drag-able. In IE you'll be able to actually change the position of the cars. It doesn't work in Chrome/FF (you can still drag them around but it will return to its original position).

Let's break down the code that does it:
HtmlControl carImage = Find.ByExpression<HtmlControl>("class=drag","src=~tn00607a.gif");
The above line gets the element into a variable for easy access.

carImage.DragToWindowLocation(ArtOfTest.Common.OffsetReference.TopLeftCorner,0,0,true,ArtOfTest.Common.OffsetReference.TopLeftCorner, 100,100, true);
The above line will then move the image into the desired location.

As you can see we use DragToWindowLocation:
http://www.telerik.com/automated-testing-tools/support/documentation/online-api-reference-1-1/html/m_artoftest_webaii_controls_htmlcontrols_htmlcontrol_dragtowindowlocation.htm

You can get a good idea of how it works if you experiment with different values for the parameters.

Let me know how it goes.

Greetings,
Stoich
the Telerik team
Are you enjoying Test Studio? We’d appreciate your vote in the ATI automation awards.
Vote now
0
Dan
Top achievements
Rank 1
answered on 12 Sep 2012, 08:51 PM
Hi Stoich,

I tried using the exact same code that you provided and got a "Object reference not set to an instance of an object." Error

I have the correct image source and my functions are in the correct form.  

I tried both this:

HtmlControl Box = Find.ByExpression<HtmlControl>("class=ui-boxingTool","src=some url");
DragToWindowLocation(ArtOfTest.Common.OffsetReference.TopLeftCorner,0,0,true,ArtOfTest.Common.OffsetReference.TopLeftCorner, 100,100, true);

and this:
HtmlControl Box = Find.ByExpression<HtmlControl>("class=ui-boxingTool","src=some url"); 
Box.MouseClick(ArtOfTest.WebAii.Core.MouseClickType.LeftDown, 100, 120);
Box.DragTo(150, 180);
Box.MouseClick(ArtOfTest.WebAii.Core.MouseClickType.LeftUp, 150, 180);

Please note that the image I am using is a background on which I need to perform my click-drag-drop operation on in order to draw boxes.                      
0
Stoich
Telerik team
answered on 15 Sep 2012, 10:21 AM
Hello Dan,
the Find Expression:
HtmlControl Box = Find.ByExpression<HtmlControl>("class=ui-boxingTool","src=some url");
is probably not doing what it's supposed to do.

If the Find Expression comes up empty - the box object will be initialized to "null". When you try to invoke a method on a null object - you get "Object reference not set to an instance of an object.".

Make sure the Find Expression is returning an element before you try to do anything else. You can put in a little code to do that for you:
HtmlControl Box = Find.ByExpression<HtmlControl>("class=ui-boxingTool","src=some url");
  
if (box == null) {
WriteLine("Box element was not found!") //Write message the application log
} else {
box.DragToWindowLocation(ArtOfTest.Common.OffsetReference.TopLeftCorner,0,0,true,ArtOfTest.Common.OffsetReference.TopLeftCorner, 100,100, true); 
}

Let me know how it goes.

Regards,
Stoich
the Telerik team
Are you enjoying Test Studio? We’d appreciate your vote in the ATI automation awards.
Vote now
0
Mythily
Top achievements
Rank 1
answered on 18 Sep 2020, 09:05 AM

Hi Admin,

As we grow through all your suggestions and solution given for drag and drop issues are fine.

We are also facing drag and drop issue when controls are drag and drop to our design area. When control drag and drop to our design area controls are not get placed and disappeared even using your suggesed codes. Our design area made up with react native.

Is it possible to loop until pass, when control drag and drop get failed

Awaiting for your responce and metioned sample code below for your reference

 

 

 

/*Text box control*/
                ActiveBrowser.RefreshDomTree();
                HtmlAnchor dragtxtbx = Manager.ActiveBrowser.Find.ByExpression<HtmlAnchor>("tagname=a", "Code=MC0004");
                dragtxtbx.Focus(); dragtxtbx.MouseHover(); Thread.Sleep(2000);
                dragtxtbx.DragToWindowLocation(ArtOfTest.Common.OffsetReference.TopLeftCorner, 42, 12, true, ArtOfTest.Common.OffsetReference.TopLeftCorner, 460, 260, true);
                Thread.Sleep(8000);

0
Elena
Telerik team
answered on 21 Sep 2020, 01:43 PM

Hello Mythily,

Thank you for sharing details for the encountered difficulties - these will help me share some ideas with you. 

Based on the shared sample code, I don't see any obstacle to implement in a while loop. If there is no verification, which you can use for a condition, then you can use the do..while loop with a help counter. You can see simple examples for both these here

As an alternative, I would recommend you revise the so far implemented method for dragging the controls over the design area - possibly using a method like this will allow you specify the details for the destination control as well. 

In addition, here is an article with a sample code, which, I hope, will be of further help for you. 

Thank you in advance for your time and cooperation. 

Regards,
Elena
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
General Discussions
Asked by
Dan
Top achievements
Rank 1
Answers by
Stoich
Telerik team
Dan
Top achievements
Rank 1
Mythily
Top achievements
Rank 1
Elena
Telerik team
Share this question
or