Saturday, September 7, 2013

2 Handling java-script alert and confirmation box using Selenium IDE

Alert and Confirmation box are most common on webpages. We can handle them using Selenium IDE. Let's proceed and see how this can be done.

Handling java-script Alert box

Alert box looks something like this,


and note that it has only one button to get user confirmation, i.e. "OK" button. When you come across such alert box you would like to click on "OK" button. Below is a sample test scenario that I would like to automate for the same.

Test Case: 1                Test Case Name "Click 'Show alert box' button"
Test Steps
1. Open URL: http://www.questionselenium.com/2013/09/sample-alert-box.html
2. Click on "Show alert box" button
3. Verify that an alert box with text "Hello! you clicked 'show alert box' button" appears.
4. Click on OK
5. Repeat step 1 to 4 and confirm that behavior is not changed
First manually execute the above test case to understand what we are supposed to automate.

I automated the above test case and placed it -->here<--. Please download it and follow the instruction below.
  • Open Firefox 
  • Open Selenium IDE
  • Open the automated test case you had recently downloaded in Selenium IDE from 'File -> Open' menu of Selenium IDE
  • Selenium IDE should like this,


  • Click on the run button of Selenium IDE. 
  • Check the result log. 




Notes on commands used in the above program
1. For open and click commands refer --> this page <--
2. For echo command refer --> this page <--
3. storeAlert command
    Usage: To get the message of most recent Java script alert box.
    Notes from Selenium IDE reference tab
    Note:
  1. I am storing the return value of 'storeAlert' into the variable "alertText" for future reference i.e. printing it to the log using command 'echo'
  2. 'storeAlert' is internally calling 'getAlert' function which handles alert box. In place of 'storeAlert' you can also use 'getAlert' command to handle the alert box. 'getAlert' command also returns the text of alert box. It is recommended to use 'getAlert' command over 'storeAlert'


Handling java-script Confirm box

Confirmation box looks something like this,



Unlike alert box note that it has two buttons to get user confirmation, i.e. "OK" and "Cancel" button. When you come across such confirmation box you would like to either click on OK button or Cancel button. Below is a sample test scenario that I would like to automate for the same.
I am using an example from w3schools in my test case.

Test Case: 2                Test Case Name "Click on 'Try it' button"
Test Steps
3. Verify that an alert box with text "Press a button!" appears.
4. Click on OK
5. Repeat step 1 to 4 and now click on cancel button.
First manually execute the above test case to understand what we are supposed to automate.

I automated the above test case and placed it  -->here<--. Please download it and follow the instruction below.
  • Open Firefox 
  • Open Selenium IDE
  • Open the automated test case you had recently downloaded in Selenium IDE from 'File -> Open' menu of Selenium IDE
  • Selenium IDE should like this,


  • Click on the run button of Selenium IDE. 
  • Check the result log. 




Notes on commands used in the above program
1. For open and click commands refer --> this page <--
2. For echo command refer --> this page <--
3. getConfirmation command
    Usage: To handle and get the message of most recent Java script alert box.
    Notes from Selenium IDE reference tab

4. chooseOkOnNextConfirmation: 
    Usage: Instruct Selenium IDE to click on OK on occurrence of a confirmation dialog. Note that by default Selenium IDE clicks on OK button so it is not mandatory to include this command.
    Notes from Selenium IDE reference tab:
5.  chooseCancelOnNextConfirmation: 
    Usage: Instruct Selenium IDE to click on Cancel button on occurrence of a confirmation dialog. Note that by default Selenium IDE clicks on OK button so it is mandatory to include this command.
    Notes from Selenium IDE reference tab:
    Note:
  1. I am storing the return value of 'getConfirmation' into the variable "confirmationText" for future reference i.e. printing it to the log using command 'echo'
  2. We can also use 'storeConfirmation' in place of 'getConfirmation' command. It is recommended to use 'storeConfirmation' method.

Finally, I would like to assign some work to the readers. If you notice clearly, for test step 3 inside Test Case 1 and Test Case 2, the instruction is to verify the text but I was printing the text to log, instead of verifying it. To verify the text we need to take the help of conditional statements like 'if-else' block. Selenium IDE does not directly support such conditional statements but we can always extend the features of Selenium IDE based on requirement. For more information on this refer --> this post <-- and try to complete test step 3 of Test Case 1 and 2.


Happy Testing
Shiva Krishna Imminni

2 comments:

  1. Thanks so much for this!! I have been going nuts trying to figure out how to deal with these alerts as I cannot see them when running Selenium and didn't know what to do. This helped me so much!

    ReplyDelete
  2. I really enjoy the blog.Much thanks again. Really Great selenium online course

    ReplyDelete

 

QuestionSelenium Copyright @Shiva Krishna