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

automating UI action on rad ComboBox

8 Answers 85 Views

ComboBox

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

alan asked on 27 Jan 2011, 12:08 AM

Hello

I'm writing a test script that automates UI actions by accessing controls from the application under test using javascript/jquery. I load the test code which is a regular HTML page containing the test script into one frame and the application under test into another frame on the same page. Then I automate the UI action with something like this:

var completeBtn = $(parent.rightFrame.document).find("#completeButton");

completeBtn.click();

var genderSelect = $(parent.rightFrame.document).find("#genderDropDown");

genderSelect.val("F");

genderSelect.change();

I'm not familiar with the rad controls and I see that they are rendered completely different in the browser then the standard dropdowns. What do I need to do in order to select a value from the list items and fire the event that is usually triggered when a user selects an item from the drop down menu? (I would like to do this without writing anything on the page of the actual application under test and without even seeing anything of that page besides for the source code of what's actually rendered in the browser.)

Thanx

Alan

8 Answers, 1 is accepted

answered on 01 Feb 2011, 09:42 PM

Hi Helen,

Thanx for your timely reply. I created a little mock-up of what I'm trying to do. Kind of cheesy but I think you'll get the idea.
The testHarness page references the other pages so just load it into the browser and hopefully it'll work.

testHarness.html

<html>

<head>

<title>Test Harness</title>

</head>

<frameset cols="45%,*">

<frame src="testScript.html" name="leftFrame">

<frame src="testApp.html" name="rightFrame">

</frameset>

</html>

testApp.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title></title>

<script type="text/javascript">

window.onload = initAll;

function initAll() {

document.getElementById("Age").onchange = showResult;

document.getElementById("button1").onclick = showMsg;

}

function showResult() {

var selection = document.getElementById("Age").selectedIndex;

var age = document.getElementById("Age").options[selection].value;

document.getElementById("resultArea").innerHTML = "You selected " + age;

}

function showMsg() {

document.getElementById("msgArea").innerHTML = "You clicked me!";

return false

}

</script>

</head>

<body>

Select your age

<select id="Age">

<option value="20-30">20-30</option>

<option value="30-40">30-40</option>

<option value="40-50">40-50</option>

</select></br>

<input type="submit" id="button1" value="click me" /></br>

<p id="resultArea"></p></br>

<p id="msgArea"></p>

</body>

</html>

testScript.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title></title>

<script type="text/javascript" src="jquery-1.4.4.js"></script>

<script type="text/javascript">

window.onload = function() {

$("#runTestBtn").click(runTest);

}

function runTest() {

var ddlAge = $(parent.rightFrame.document).find("#Age");

ddlAge.val("30-40");

ddlAge.change();

var button = $(parent.rightFrame.document).find("#button1").click();

}

</script>

</head>

<body>

<input type="submit" value="run test" id="runTestBtn" />

</body>

</html>

The test script uses the jquery library. Just make sure the reference matches the version you're using.

Thank you so much for your ongoing support. I really appreciate it.

Alan

Accepted

answered on 02 Feb 2011, 11:59 AM

ComboBoxTest.zip

Hi Alan,

Thank you for the code.
Please find attached a sample test which selects the third item from RadComBobox.
Once you have a reference to the RadComboBox's client-side object you may use the API to execute its methods. Please refer to the links I sent you previously.

Hope it helps.

Greetings,
Helen
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

automating UI action on rad ComboBox

8 Answers, 1 is accepted