The Automated Tester - Selenium Tutorial

In this tutorial you are going to learn how to use JavaScript blocks in your scripts as well as how to move data within your script using variables.

1. Lets start by creating a script to work through the area below, however instead of using a verifyValue command to check what has been placed in the text box I would like you to use the storeValue command. This command takes data out of a text box and places it in a variable for you to use. Your command should look something like storeValue | total | total. This means that it will take what is available in the text box with the ID total and store it in the variable total.
   
   
2. Enter numbers into each of the text boxes and then click on one of the buttons
   Value 1
   Value 2
   Total
         =   
   
            
   
   
3. Since we have the information that we would like in a variable, we need to compare it against what we think the answer is going to be. For this we need to use the verifyEval or assertEval commands. Your next step in the script should look a lot like the following: verifyEval | javascript{1+1} | ${total} .  I have created an example script here for you.
   
   
4. I have used the xEval command in my last script. These commands are used to evaluate the JavaScript block that you have put into the Selenium command. You do not have to just use the xEval commands(assertEval, storeEval, verifyEval, waitForEval). If you wanted to type in something dynamic on to the page you just have to use the type command. E.g type | element_id | javascript{1+1}
   
   
5. For the next step in this tutorial I would like you to create a script to type todays date in the text box, then click the button. Once you have clicked the button a label will change to tell you if you are correct or not. Type the date in the format of dd/mm/yyyy otherwise your script will fail. Note: Only the last line of the block will be written.
   
   
   
   An Example of the script can be found here.
   
   

6. Lets now move on to calling functions that are on the page. This is done by referencing the Selenium JavaScript API. In the last section you were asked to create a script that would type in today's date. In this tutorial I would like you to create a script that will call the JavaScript function that I created to check your input.

   To do this you will need to create a reference to the selenium javascript API and work within the current window. From there you need to call the function that I created. The name of the function is checkDate and has an input of a date value in the format dd/mm/yyyy. Your command should look a lot like getEval | javascript{ this.browserbot.getCurrentWindow().checkDate('dd/mm/yyyy').

   I have created a working version of the script here for you to check your script against.

   I am sure that you are now wondering why you would ever want to ever call javascript functions that are on the page. The answer is that sometimes Selenium can't always interact with items on the screen. The latest example I have of this is working the Telerik RadEditor. When it is in its rich text mode Selenium can't actually do anything on the text area but can reference the Editor's API and manipulate the "text area" by calling its getHTML and setHTML functions.

Thank you for using this tutorial and i hope that you found it useful!