In this post we will discuss one of the most useful and important feature of Coded UI testing, which is executing Javascript (or any script for that matter) on a browser using Coded UI. There are various advantages and uses of running a Javascript on the browser, since JS gives us the leverage of getting the complete DOM (Document Object Model) of the page and perform operations which the in-built methods of Coded UI test cannot perform (or can perform with lots of code)
Running Javascript with Coded UI
Using BrowserWindow’s ExecuteScript method we can execute any script on the browser, and we are going to execute a Javascript using the ExecuteScript() method.
For example, to get the number of Html input controls on the given page, we can use the length method of getElementsByTagName() of javascript and get the value, here is the screenshot below for our login page
We can achieve the same result with coded UI as well with the help of FindMatchingControls() method and UITestControlCollection class as discussed in previous post but as we know, its lot of code and its slow comparing to Javascript.
Here is the complete video explaining the above discussion
Here is the code to execute a simple alert window of Javascript
Code to Get the total number of controls and check if they are correct
public BrowserWindow TopParentWindow()
{
//BrowserWindow.ClearCookies();
//BrowserWindow.ClearCache();
BrowserWindow window = BrowserWindow.Locate("Execute Automation");
window.SearchProperties[UITestControl.PropertyNames.ClassName] = BrowserWindow.CurrentBrowser.ToString();
Image image = window.CaptureImage();
image.Save(@"D:\captured.jpeg", ImageFormat.Jpeg);
image.Dispose();
//Execute Script to count the number of controls
var result = window.ExecuteScript("var controlCount = document.getElementsByTagName('Input').length; return controlCount;");
if (result.ToString() == "3")
Console.WriteLine("PASSED");
else
Console.WriteLine("FAILED");
return window;
}
Thanks for watching the video and reading the post !!!
Please leave your comments and let me know if there is anything need to be improved in the post.
Thanks,
Karthik KK
Post Author:
Karthik kk
12 Replies to “Executing Javascript on Browser with Coded UI”
Hi Karthik,
since long time new post for the Visual Studio automation 🙁 🙁 🙁
Thanks for the video! It helps me through my coded UI project.
When I was trying executing javascript with the simple example:
BrowserWindow browserWindow = BrowserWindow.Launch(“http://www.bing.com”);
browserWindow.ExecuteScript(“alert(‘Hello World’)”);
I got this error: Specified cast is not valid.
What do you think could be the reason? The VS I am using is Ultimate 2013 with update 4.
Karthik, thaks for your excellent videos. What is the line of code to enter text in webelemnt with C#+Webdriver. I tried but had syntax errors.
IJavaScriptExecutor js = this.WebDriver as IJavaScriptExecutor;
IWebElement body = WebDriver.FindElement(By.id(“myelement”));
js.ExecuteScript(“arguments[0].innerHTML =” + “‘” + Messagebody + “‘”, body);
Hi Karthik,
I try your code above, and keep getting window exception.
Can I use ExecuteScript to find a control in a Window which cannot be found by Coded UI builder or by handcoding. I think the application itself is misaligned. When I hover a control, the property is actually something else. So coded UI can’t spy, can’t record …etc.
I try to get all the HtmlSpan controls on the window.
This is what I tried, and didn’t work:
If the application has only window container with all Javascript app within it, then its nothing do with Win controls class, hence its not supported like WinControl, rather its a Web control, which is still supported.
Hi Karthik,
since long time new post for the Visual Studio automation 🙁 🙁 🙁
Currently focusing on Android and mobile automation.
Will plan some articles for VS as well !!!
Thanks,
Karthik KK
Ok thanks. I will be waiting for the same. 🙂
Hi Karthik,
Thanks for the video! It helps me through my coded UI project.
When I was trying executing javascript with the simple example:
BrowserWindow browserWindow = BrowserWindow.Launch(“http://www.bing.com”);
browserWindow.ExecuteScript(“alert(‘Hello World’)”);
I got this error: Specified cast is not valid.
What do you think could be the reason? The VS I am using is Ultimate 2013 with update 4.
Thanks!
May
Karthik, thaks for your excellent videos. What is the line of code to enter text in webelemnt with C#+Webdriver. I tried but had syntax errors.
IJavaScriptExecutor js = this.WebDriver as IJavaScriptExecutor;
IWebElement body = WebDriver.FindElement(By.id(“myelement”));
js.ExecuteScript(“arguments[0].innerHTML =” + “‘” + Messagebody + “‘”, body);
hi can i have a hard copy of the code on coded ui examples please
Hard copy ?
may i know some more examples how javascript is useful in coded ui instead of record and playback?
Hi Karthik,
I try your code above, and keep getting window exception.
Can I use ExecuteScript to find a control in a Window which cannot be found by Coded UI builder or by handcoding. I think the application itself is misaligned. When I hover a control, the property is actually something else. So coded UI can’t spy, can’t record …etc.
I try to get all the HtmlSpan controls on the window.
This is what I tried, and didn’t work:
AlertNotesEDITWindow.ExecuteScript(“var clickable = document.getElementsByTagName(‘SPAN’).lenght; alert(clickable);”);
Thank you so much.
I really appreciate all the coded UI testing video you posted on you tube. Awesome lectures.
Hi Karthick,
Does Coded UI supports EXT JS appplications.If yes,could you please share some videos on that in detail.
Hi Karthik
Does CodedUI support automating desktop applications written in JavaScript?
If the application has only window container with all Javascript app within it, then its nothing do with Win controls class, hence its not supported like WinControl, rather its a Web control, which is still supported.