Javascript error handling is generally painful in selenium webdriver test automation projects. In some cases in test automation run, we need to handle javascript alert and javascript notification messages. Some of the javascript alerts visible only limited time such as 5 seconds. Then, they disappear. If we are using built-in selenium webdriver wait features, we may have flaky test executions. Thus, we should wait and handle these kinds of javascript alerts by using javascriptexecutor in selenium and custom javascript codes.

Hi all,

In this article, I will share with you a javascriptexecutor method to handle javascript notification messages in your test automation projects. Sometimes we deal with notification messages for a limited period of time. They appear and then disappear. In these kinds of circumstances, selenium webdriver visibility or presence features don’t work so resilient. It is better to make the notification handling more robust with javascriptexecutor and our custom javascript codes. Let’s take a look an example and then try to create a solution together.

Our test website is https://www.odamax.com/en/ it is one of the leading tourism websites. When we click the Log in link, we see the login screen and when we click the login button, we see the red error message on right top of the browser. This error message is visible only 4-5 seconds and we have a limited time to handle this error message in our automation code. First, Let’s look at what happens in the DOM when we click the login button. Now, open the developer tools of the chrome and then click the login button. When you see the error message, click it with the inspector. When we click the login button, there is a line appears in the DOM which has a class name as “ns-box ns-bar ns-effect-slidetop ns-type-error ns-show”. It is visible for a limited period of time.

javascript error handling

When I use Selenium Webdriver’s visibility expected condition, sometimes I get a failure because time is elapsing before checking the visibility of the alert message. Javascript error handling is needed to get the alert message and make the tests more robust. Thus, I changed my wait tactic as follows:

  • First, I click the login button.
  • Then, I wait for the presence of element. It checks that the element is available in the DOM.
  • After that, I will write a JavaScript code to get the error code.
  • Then, I write an assertion to check the error message as expected.

Now, let’s check what is happening when I click the login button on the console. As you see below screenshots, I got an XHR error message as “Your e-mail address or password doesn’t match any account.”

javascript error message

javascriptexecutor selenium

Then, I wrote the below Javascript code to get this error message for javascript error handling operation.

With above code snippet, first, we should call init function to assign XHR error response to message variable and also we replace “Error” text with “” to remove it. Thus, we will get only “Your e-mail address or password doesn’t match any account.” error message.

We can test this on the console. First, open a new browser and open the console and execute the above code.

Then, run the “window.getError.init()” function to execute the function.

Then, try to login with empty credentials and see the error message.

Then, run the “window.getError.message” command to see the error message. This is shown in below screenshot.

Now, we can write our test automation code in combination with the javascript code. I wrote inline comments. If you don’t understand some points in the code, please write a comment about your javascript error handling problems.

JavaScript Error Handling Example Code

In this way, our tests will be more robust. We learned javascript error handling in selenium webdriver projects.

You can find another JavaScriptExecutor Tips and Trick here: http://www.swtestacademy.com/selenium-javascriptexecutor/

Thanks.
-Onur