Unable to run automated UI tests with Microsoft Test Manager (MTM) or coded UI test

[Christian]

Hello,

Ivan Ivanov, from Telerik, ask me to open up a new thread for this topic, so I will ask my question again:

our data center want to have some automated test scenarios with Microsoft Test Manager (MTM) 2015 and some coded UI tests in Visual Studio 2015. But there is a problem with the Telerik RadComponents in version 2013.2.717.35 of the Telerik.Web.UI. We can create and record the test case without any problems, but if we want to make an automated test, by clicking "run" in the MTM or VS2015, the test failed with an exception (see post attachments).
The Visual Studio seems to be unable to "find" the Telerik components (i.e. RadRadioButton, etc.) and stops the test with an error. As I read in this thread (http://www.telerik.com/forums/vs2010-codedui-test-wont-see-telerik-controls) there seems to be a problem with the MSAA support (https://en.wikipedia.org/wiki/Microsoft_Active_Accessibility) in the Telerik components.

Here is some more background: we don't have the source code of the product which uses the Telerik components, because these components are integrated as third party components in a work flow tool we use. Our goal is to test the workflows, which are based on ASP.NET webpages, so yes we only want to make 1st level testing. But how can we solve the problem with the "hidden" Telerik components and the failing tests?
A sample of one ASP.NET page, we should test, is attached to this post. The coded UI test should "click" the RadRadioButton, but fails to do so.
 

Best Regards
Christian Beermann

 

 

[Misho]

Hello Christian,

We haven't had similar issues related to Microsoft Test Manager and Coded UI testing framework in Visual Studio 2015 reported for the Telerik UI for ASP.NET AJAX controls so far. That's why we will need more time to investigate and research the issue more thoroughly in order to provide you with a reliable solution.
Meanwhile, I would like to ask you for some additional details on your exact configuration of the system under test.
The best option is if you could create a new sample project with configuration of Telerik UI controls similar to you Work Flow tool setup where the problematic behavior is reproducible and send it back to us. 
Another option is to provide us with live URL to the problematic page, against which the tests are failing with the exception. 
Since the issue looks like related to either RadButton type radio or asp buttons, decorated by Telerik RadFormDecorator, it would be very helpful if you could confirm whether you are able to replicate the same problematic behavior doing Record/Run over any of the following online demos:

http://demos.telerik.com/aspnet-ajax/button/examples/radiosandcheckboxes/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/formdecorator/examples/overview/defaultcs.aspx

Thank you for your understanding and collaboration in advance.

Best Regards,
Misho
Telerik

[Joana]

Hi Christian,

Let's clarify the scenario you have described. What can I see from your screenshots, you are using RadFormDecorator to style asp:RadioButton. In order to skin the Radio buttons, the RadFormDecorator hide the “real” radio button with position: fixed, left: -9999px, top: 0 by actually moving these controls away from browser's viewport. That's why exception is thrown when you try to select this hidden input in your test. You could use the following code to click at the label of the button to select it:

var label = new HtmlLabel(document);
label.SearchProperties.Add(HtmlLabel.PropertyNames.LabelFor, "RadioButton1");
//RadioButton1 represents the id of the asp:RadioButton
Mouse.Click(label);

or you could execute script:

window.ExecuteScript("$get('RadioButton1').checked = true");

I ran several tests to confirm that this piece of code is working. Another option is to use the Telerik RadButton component is your web site.

You could have a look at our Testing Framework.

Regards,
Joana
Telerik

[Christian]

Hello Joana,

well done. Now it works fine for us. The only gap is that we have to record the tests with the MTM and then we have to edit all the clickable components... It's a little bit scary, but it works. Thank you for your nice and fast feedback and the solution! 

For everyone who has the same problem:

Code from the MTM as Coded UI test:

01.public void Eingangskanalpersönlichauswählen()
02.{
03.   #region Variable Declarations
04.   HtmlRadioButton uIPersönlichRadioButton = this.UIBürgeranliegenerfassWindow.UIBürgeranliegenerfassDocument.UIOpenTextMBPMFormContFrame.UIBeschwerdeDocument.UIPersönlichRadioButton;
05.   #endregion
06.
07.   // Select 'persönlich' radio button
08.   uIPersönlichRadioButton.Selected = this.EingangskanalpersönlichauswählenParams.UIPersönlichRadioButtonSelected;
09.}

 

Code after the manipulation (I searched the "real" radio Buttons by preesing F12 in Chrome, then I clicked on the magnifier and after that I clicked on the RadioButton for getting the "real" name of the label): 

 

1.public void Eingangskanalpersönlichauswählen()
2.{
3.   var label = new HtmlLabel(this.UIBürgeranliegenerfassWindow.UIBürgeranliegenerfassDocument.UIOpenTextMBPMFormContFrame);
4.   label.SearchProperties.Add(HtmlLabel.PropertyNames.LabelFor, "txtEingangsart_Editor_persönlich");
5.            //RadioButton1 represents the id of the asp:RadioButton
6.            Mouse.Click(label);
7.}​

 

 

Best regards
Christian Beermann

 

[Joana]

Hi Christian,

I am glad to hear that you've resolved the issue.

Regards,
Joana
Telerik

[George]

Hi Jhoan,

 I have a similar problem and I have tried your code. It works however, after it will select the radio button, it will throw the same error and will not proceed to other steps. I have attached the error. 

[Joana]

Hi George,

I assume that the test fails at the following step.

uICheckedRadioButton.Selected = this.SelectCheckedfromtheCheckBoxStateoptionsParams.UICheckedRadioButtonSelected;

Clicking over the label should be enough to select the RadioButton and it's not necessary to set selected state which throws the error. Could you please test whether the RadioButton is successfully selected after removing the line of code I pasted before?

If there is still issue with toggling the state of radio buttons, I suggest you open a support ticket with the code of your test, so I would be able to examine it on my side and give you more details on the matter.

Regards,
Joana
Telerik

[Chelsea]

Hi Joana,

What is the code for opening a kendo dropdown box and selecting a particular value inside in c#?

[Joana]

Hi Chelsea,

In the support ticket you have sent, you are automating UI for ASP.NET AJAX. Could you please be more precise whether you are using Kendo or UI for ASP.NET AJAX, so that we'll be able to assist? What dropdown box are you trying to select via CodedUI test? (HtmlSelect, DropdownList, Combobox etc.)

Regards,
Joana
Telerik

[Chelsea]

Hi Joana,

 I am using KendoUI. It is a RadDropDownList, or a kendo Drop DownList. In the Html I was told it's a type of a textbox.

[Joana]

Hi Chelsea,

I have created a small sample for your scenario. Based on this dojo sample DropDown, you could choose an option from it through CodedUI via the following approach:

Code from the sample of the DropDownList:

<input id="color" value="1" style="width: 100%;" /><br><br>

           <script>
               $(document).ready(function() {
                   var data = [
                       { text: "Black", value: "1" },
                       { text: "Orange", value: "2" },
                       { text: "Grey", value: "3" }
                   ];
                   $("#color").kendoDropDownList({
                       dataTextField: "text",
                       dataValueField: "value",
                       dataSource: data,
                       index: 0
                   });

               });
           </script>

var selectSpan = new HtmlSpan(document);
selectSpan.SearchProperties.Add(HtmlSpan.PropertyNames.Class, "k-input");
selectSpan.SearchProperties.Add(HtmlSpan.PropertyNames.InnerText, "Black");
Mouse.Click(selectSpan);

var colorList = new HtmlCustom(document);
colorList.SearchProperties.Add(HtmlCustom.PropertyNames.TagName, "LI");
colorList.SearchProperties.Add(HtmlCustom.PropertyNames.InnerText, "Orange");
colorList.EnsureClickable();
Mouse.Click(colorList);

This is a basic example how you could achieve the scenario via CodedUI test. You could modify the SearchProperties how you like.

Regards,
Joana
Telerik

[Chelsea]

Hi Joana,

The code I have does not explicitly contain the list items, it calls the endpoint to populate the values.

In this case, how do I click these elements if they do not have any definite inner text or other properties?

 

[Joana]

Hi,

You could extend the example I gave you to meet your requirements. Please note, that getting reference to a specific HTML element is not related to the Telerik controls, but  general knowledge in writing tests in code. Locate the parent element of the Dropdown and then search for a child that contains a span with class "k-input" as shown in my example. Then use indexes to select the option you want if you can't rely on InnerText or other property.

Regards,
Joana
Telerik