Site Loader
Auckland, New Zealand
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
        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(); 
            window.ExecuteScript("alert('Hello World')");
        }
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”

    1. Currently focusing on Android and mobile automation.

      Will plan some articles for VS as well !!!

      Thanks,
      Karthik KK

  1. 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

  2. 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);

  3. 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.

    1. 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.

Leave a Reply to Thi Cancel reply

Your email address will not be published. Required fields are marked *