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 says Drag is not a function. What is possible wrong here ?

 

Record script - 

let page = Aliases.pageShoppingPortal;

page.panel.Drag(134, 23, 26, 182);

 

Javascript - 

let memberdrag = page.contentDocument.getElementsByClassName("name cdk-drag");

memberdrag.item(1).Drag(134, 23, 26, 182);

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.