Need help about Find.jQuery() using

[Bod]

Hi,

I try to use Find.jQuery() to click on a picture in a dynamically javascript generated tree, but i don't understand how it works. :(

As you can see in attachments (F12 in Chrome), the highlighted line is the element that I try to click.

In first i've just tried to use Find.ByExpression but it always returns null in liItem  (The parent LisItem have a unique guid as id)

HtmlListItem liItem = Find.ByExpression<HtmlListItem>("id=56e5c928-4413-4a36-8676-72bea0c4e51d");
liItem.Find.ByExpression<HtmlImage>("class=menu-button").MouseClick();


I think it's due to the fact that the code is not html hardcoded but generated by JS.

How can I use Find.jQuery() (or another function) to make a MouseClick on this picture ?

Thanks :)

[Velin Koychev]

Hi Bod,

I am sorry to hear that  you are experiencing this issue.

The code you are using usually should work. I have only a few concerns - is the ID of this list item static (every time the same) or it is dynamically generated and for that reason different every time you execute the test? 
Is this element inside a frame?

If this issue still exists, please provide us with a copy of your test and if it is possible, grant us access to your application so we can reproduce the issue on our end and give you a solution. 
If direct access is not possible, capture a Fiddler trace and attach it to this support ticket in a zip file. If you are unfamiliar with how to do so, this link will provide you with step-by-step instructions for download and use. Please make sure to enable 'Decrypt HTTPS traffic' and 'Store binaries' options (see attached image) before starting capture.

Looking forward to hearing from you.

Regards,
Velin Koychev
Telerik

[jwize]

Obviously, if the element is not in the tree yet it will not be found. However, if it is available you you can create a library function in visual studio and add an extensions class and add it using the preferences in test studio. You should make your library build to the bin folder of the Test Studio project.

 

public static class TestStudioExtensions
{
    public static T FindByJQuery<T>(this BaseTest test, String selector) where T : Control, new()
    {
        var random = new Random();
        var classId = "_" + random.Next(1000000);
        test.Actions.InvokeScript(String.Format("$('{0}').addClass('{1}');", selector, classId));
        return test.Find.ByAttributes("class=~" + classId).As<T>();
    }
}

NOTE: If test studio is loaded you will not be able to build the extensions project since the DLL is loaded into memory and is being used by test studio. Also, you also have to have jquery.js referenced for this to work. 

 You don't really need any framework selectors after you have this.

// Call it like this
 HtmlInputText text = this.FindByJQuery<HtmlInputText>("#FirstName");

 // Verification
​text.AssertContent().TextContent(StringCompareType.Exact, "Jim");

 

[jwize]

Also, for any library conflicts you might change the code to "jQuery('{0}').addClass('{1}');" And on other note is that you should put the extension class in the same namespace of the BaseTest so you don't have to add reference when using it.

namespace SameAsTheWebTestBase  // Sorry, I don't have the namesapce off-hand.
{
   //   ... Extension class here.
}

[Boyan Boev]

Hi Jaime,

Thank you for sharing your knowledge with the community.

I have updated your Telerik points.

Thank you!

Regards,
Boyan Boev
Telerik

 

 

[jwize]

I think my verification code is wrong since TextContent won't exist on the HtmlTextInput but should be able to use the following:

text.AssertAttribute().Value("​value", StringCompareType.Exact, "Jim");

[Boyan Boev]

Hi Jaime,

Yes if it is not set then you should use the value.

Thank you again.

Regards,
Boyan Boev
Telerik