Forum Discussion

nitingambhir88's avatar
nitingambhir88
Occasional Contributor
5 years ago

not able to use Drag method

Hi,   I am trying to drag and drop an item from one panel to another. When i record and play the script, it works fine. But when i try to use the Drag method in my script (using javascript), it say...
drag
javascript
TestComplete
  • AlexKaras's avatar
    AlexKaras
    5 years ago

    Hi,

     

    > So, it clearly depicts that test complete is not able to recognize

    The error message means not that TestComplete cannot recognize, but that TestComplete cannot find web element that match provided search criteria.

    You must examine the elements that you need to find in the Object Browser and identify a set of stable and unique properties that make it possible to find the elements that you are looking for.

     

AlexKaras's avatar
AlexKaras
Champion Level 3
5 years ago

Hi,

 

> Drag is not a function. What is possible wrong here ?

.Drag() method is provided by TestComplete.
The error reported means that your code tries to call the .Drag() method for the object that does not provide it.

The reason is the use of native DOM objects and methods in the code (contentDocument and getElementsByClassName() ) - as it is described in the documentation, native DOM object is returned in case when TestComplete cannot match the object that is returned by native DOM methods to the object from TestComplete's Object Tree (which is your case).
Solution: either stick to the methods provided by TestComplete (.FindXXX() methods and Aliases) or check whether or not the returned object is native DOM one and don't use properties and methods provided by TestComplete for native DOM objects.

 

P.S. As it was often mentioned on these forums: use of native DOM properties and methods as well as Selenium-like search by XPath, ClassName, etc. (except for extreme cases and in case of cross-platform test code for TC 14.50 and up) is highly not recommended in TestComplete's world and can be considered to be a bad style/approach.

 

 

  • nitingambhir88's avatar
    nitingambhir88
    Occasional Contributor
    5 years ago

    Hi Alex,

     

    Thanks for the quick and efficient reply.

     

    I checked with object spy and found out that the object which i am trying to drag and drop , supports Drag() method. 

    Can you suggest me something appropriate with a Find() method OR whatever best solution you provide, i am all game.

     

    P.S. I am using javascript + my project uses angular.

    Please check screenshot for better idea of what and where i am trying to drag and drop.

     

    Thanks in advance.

     

     

    • AlexKaras's avatar
      AlexKaras
      Champion Level 3
      5 years ago

      Hi,

       

      > something appropriate with a Find()

      You need to examine tested web page in the Object Browser and find out a set of unique and stable parameters that correspond to the source and target web elements (i.e. web elements you are going to drag from and to).

       

      My preference is to use .Find() method and, considering your initial message, the code might look like this:

      let page = Aliases.pageShoppingPortal;

      let memberdragFrom = page.Find("class", "*name cdk-drag*", -1);

      let memberdragTo = page.Find("class", "*name cdk-dragTo*", -1);

      if (!(memberdragFrom.Exists && memberdragTo.Exists))

        ... ' handle the case when one or both web elements were not found

       

      let toX = memberdragFrom.Left - memberdragTo.Left +memberdragTo.Width / 2;

      let toY = memberdragFrom.Top - memberdragTo.Top +memberdragTo.Height / 2;

       

      memberdragFrom.Drag (memberdragFrom.Width / 2, memberdragFrom.Height / 2, toX, toY, skNoShift);

       

      Note: Depending on the tested page you might need to adjust the value of the Dragging Delay / Mouse Movement Delay parameters under Tools | Current Project Properties -> Playback.

       

      • nitingambhir88's avatar
        nitingambhir88
        Occasional Contributor
        5 years ago

        let memberdragFrom = page.Find("class", "*name cdk-drag*", -1);

         

        Here, there are 2 elements with the same class name, and i want to pick the 2nd one.

        Similarly, for memberdragTo , there are 3 elements with the same class name(dragHere), and i want to pick the 3rd one. 

        I am not able to find unique identifiers for these two. That is why in my example above, i was using item(1) and item(2) to pick 2nd and 3rd item of the same name class.

         

        I am sorry to bug you again and again, but i am scratching my head and trying codes, but nothing is working for me.