Experitest Blog

How to Process JavaScript tests for web and mobile via Selenium

Introduction

JavaScript, or, simply, JS is a high-level programming language and one of the core technologies of the World Wide Web. Most web-pages and web-applications heavily utilize JS. And it’s possible to interact with an application on a very complex level by using JavaScript scripts. It’s really, a very powerful tool. A way to turn a good tool into a great one, however, is to use it to enhance automated testing with Selenium.

Fortunately, Selenium already has really deep connections with JavaScript to perform some interactions with web applications. And it allows a user to execute any JS script on a current page by invoking executeScript or executeAsyncScript methods of its JavaScriptExecutor interface.

Script execution methods

So, as stated above, there are two methods that can execute your JS script: executeScript and executeAsyncScript. All of them have a common syntax:

((JavascriptExecutor) driver).executeScript(Script,Arguments);

Where the driver is your Selenium WebDriver, Script is your JavaScript as String, and Arguments are arguments, you want to pass to the script, accessible via arguments magic variable. Arguments for the script must be a number, a boolean, a String, a WebElement, or a List of any combination of the above.

Let’s take a closer look at each of them.

executeScript

Executes JavaScript in the context of the currently selected frame or window via anonymous Selenium function. To get access to a current page DOM, you can use a document variable.

If your script returns any value you can assign it to a variable, using types as follows:

  • WebElement – if your script returns an HTML element
  • Double – if it’s a decimal number
  • Long for non-decimal numbers
  • Boolean for a boolean value
  • String – all the other cases

Your script can also return List<Object> or Map<String, Object> using the rules above for Object type. It also can assign the null value if the returned value is null or no value returned.

For example, you can refresh a browser window by the following code:

((JavascriptExecutor) driver).executeScript(“history.go(0)”);

executeAsyncScript

Executes an asynchronous piece of JavaScript in the context of the currently selected frame or window. Unlike executeScript, scripts executed with this method must explicitly signal they are finished by invoking the provided callback. This callback is always injected into the executed function as the last argument, which can be accessed by arguments[arguments.length – 1] variable. Also, with this method, the script has a timeout for execution. By default, it’s 0 milliseconds, and you can change it by setting WebDriver.Timeouts.setScriptTimeout(long, java.util.concurrent.TimeUnit) beforehand to a value sufficiently large enough. The same rules for return types apply for synchronous executeScript.

Useful examples

So, when might it be useful to invoke JavaScript in Selenium? Well, sometimes Selenium is unable to interact with web elements by itself, due to, a site’s, strict security policy. In this case, JavaScript MIGHT be able to overcome it. Thankfully, via JavaScript, you can perform any interactions with a web element. Here are some interesting examples:

For all of our examples, we will use the following structure of our test class which you can get from our git repository of this blog post.

Locating an element:

In case, Selenium is unable to locate an element by itself, we can try to use JavaScript to find this element.

Interacting with an element:

In the same way, you can interact with an element, using JavaScript. This way, you can perform any action on an object: entering a text in a text field, checking checkboxes, and so on.

Showing an output via alerts:

One of the interesting ways of having an output is alert messages. You will see something like this:

JavaScript Tests

Scrolling a window:

You can use JavaScript to scroll a browser window. For example, you can scroll a window down, before a specified element is in view:

JavaScript Tests

Changing the style of an element:

Interestingly enough, we can temporarily change the style of an element on a page. It can be useful when you want to highlight some important elements to have pretty screenshots in your automated reports.

JavaScript Tests

Implementing waits:

Let’s see how we can use executeAsyncScript method to manage waits. For example, if we want to open our page and wait for 5 seconds for the page to load:

JavaScript Tests

In this example we used both the executeScript and executeAsyncScript methods, as well as made use of custom arguments.

Conclusion

So, as we have seen, the possibilities of JavaScript in your Selenium tests are, indeed, limitless. Basically, any JavaScript can be executed on a page under the test. Most of the time, it’s useful when you are unable to interact with web elements, using only Selenium. But the creative approach and clever scripting can achieve a great amount of control over the behavior of a page.

Konstantin Tonkov – Performance Engineer ISSArt QA team

 

Comments are closed.