Selenium IDE – plugin for FireFox – easy black box web application testing

9

In a previous article, Introduction to Blackbox testing of Web Applications using Selenium I have introduced Selenium, a framework for Web Application testing – any HTML/JavaScript Web Application, regardless of the underlying technology being it Java/J2EE, PHP, .NET, Perl, MOD_PLSQL or something else. In that article, we saw how test cases are created by creating lists of simple commands that either navigate, click, enter values in form items or make assertions about expected and experienced behavior. In this article we created TestCases by manually creating static HTML documents. While this is not terribly difficult or even cumbersome, due to the very readable structure of the commands, it still can be improved upon, as you will see in this article. Yesterday we had one of our Knowledge Center sessions, this one with Software Engineering as focus and Testing as special session topic. We first looked at Qute, a tool for Unit Testing PL/SQL code. Next, we took an in depth look at Selenium; it received a very positive reaction from the attendants. The enthousiasm was fueled even more when we introduced the Selenium IDE:

Recently, OpenQA – the organization behind Selenium – announced Selenium IDE. You can download this FireFox Plugin from http://www.openqa.org/selenium-ide/ . It is implemented as a Firefox extension, and allows you to record, edit, and debug tests. Selenium IDE includes the entire Selenium Core, allowing you to easily and quickly record and play back tests in the actual environment that they will run.....

Selenium IDE is not only recording tool: it is a complete IDE. You can choose to use it’s recording capability, or you may edit your scripts by hand. With autocomplete support and the ability to move commands around quickly, Selenium IDE is the ideal environment for creating Selenium tests no matter what style of tests you prefer. See http://wiki.openqa.org/download/attachments/400/Selenium+IDE.swf?version=1 for a Tutorial (movie) that perfectly illustrates what the IDE can do.

Note: where Selenium due to cross domain browser security constraints normally cannot be used to test web sites or web applications originating from other domains than the Selenium framework itself – that’s why Selenium must be installed under the document root of the web application you are testing – , this Firefox Plugin is not bound by such constraints. That means that it can be used to test any web application, including sites such as EBay, Amazon and Google. See at the end of the article.

Let’s go and play a little with the Selenium IDE.

  • Open a Firefox Browser, version 1.5 or higher
  • Go to  http://www.openqa.org/selenium-ide/ and click on download
  • Click on Firefox extension (requires Firefox 1.5 or 1.5.0.*) and the Selenium IDE will be downloaded as Firefox plugin. After download, you will have to restart Firefox to activate the plugin.
  • After restarting the Firefox browser, open the page you want to test. For example, our Html Data Form: document Site2.html
  • From the Tools menu in Firefox, select the Selenium IDE

  • The IDE is opened.

From the File Menu, select New Test. Make sure that the Record button (upper right hand corner) is selected.

  • Now go to the browser window with the web application that we want to test; in this case the Site2.html document. Perform the following actions:
  • Click in the voornaam item
  • Type a value of "Mijn Voornaam"
  • Select the option verifyValue voornaam from the right mouse button menu

o    Type the value 27 dec 1969 in the field Geboortedatum; tab out of the field
o    Acknowledge the alert

o    Change the value in Geboortedatum to 27-12-1969
o    Set the Geslacht Radiogroup to Vrouw
o    Select Chinees for the Diner voorkeur
o    Submit the form by click on the Submit button
o    Acknowledge the alert

 o    Set the value of Achternaam to Jellema and submit again

  • Toggle (alt tab) to the Selenium IDE; it will look something like:

All our actions have been recorded, as well as an automatically assertTitle for the document and the verifyValue that we explicitly added. Alas, the test is not yet complete. First of all, the verifyValue command lacks the value it should check for. Select this command and enter the value "mijn voornaam" in the value field. It seems that the record action – type voornaam – is fooled by the onBlur trigger that fired and has recorded mijn voornaam as value to type. Change this to Mijn Voornaam. 

  • Try to run the test, by clicking the little green triangular icon. It will fail:


This is caused by the fact that we did not include commands to capture the alerts that are shown. Let’s rectify those omissions.

  • Select the second Type geboortedatum command (the one shown in red). From the RMB menu, select Insert Command. Set the command to verifyAlert and the Target to "Valid format is*".

 Also select the command type achternaam. Insert a new command, just prior to this one. Set it to verifyAlert with a Target of "*zijn beide verplicht*"

  • Position the IDE on the top right hand corner of the browser window. Now run test again. The test should succeed now. You can follow all actions taking place in the browser window while the test is being performed.

 

  • If you want to reuse the test or employ as static html documents like the ones we have used before, you can save the test from the File Menu. Save the current test as TestSite2b.html to the selenium\tests directory – where the other TestCase documents are also located. Open the TestSuite.html document and add the TestSite2b.html TestCase. Now open the TestRunner.html document in the selenium directory and verify that the TestSite2B testcase has been added. Run the TestSite2B TestCase to verify that this test that we created with the Selenium IDE is equivalent to the testcases we have earlier created by hand.

 

Testing External Web Applications

Normally Selenium cannot be used to test web sites or web applications
originating from other domains than the Selenium framework itself. due to cross domain browser security constraints. That’s why Selenium must be installed under the document root of the
web application you are testing – , this Firefox Plugin is not bound by
such constraints. That means that it can be used to test any web
application, including sites such as EBay, Amazon and Google. In a simple example, I open www.google.com and start the Selenium IDE. Next I type in the search field "selenium ide", press search and inspect the results. I click on the link for the Selenium website (http://www.openqa.org/selenium-ide/) , select the demonstration and start playing the movie. All my steps are recorded properly and the test can easily be replayed. I can add additional verification steps. This test can be used to ensure for example that the Selenium IDE homepage is still on the first list of Google Search results for "Selenium Ide". Not extremely useful, but a nice demonstration of how easy the Selenium IDE can be used to test (and script) just any Web Application.

The recorded test looks like: 

 

We can replay the test, step by step:

 

And we can run the test in the Selenium TestRunner:

Resources

Download the Demo Application with Selenium tests (including key components of Selenium): SeleniumDemo.zip

Automate acceptance tests with Selenium- How to use the Selenium test tool for functional testing of a Ruby on Rails and Ajax application IBM DeveloperWorks Christian Hellsten 20 Dec 2005

Share.

About Author

Lucas Jellema, active in IT (and with Oracle) since 1994. Oracle ACE Director for Fusion Middleware. Consultant, trainer and instructor on diverse areas including Oracle Database (SQL & PLSQL), Service Oriented Architecture, BPM, ADF, Java in various shapes and forms and many other things. Author of the Oracle Press book: Oracle SOA Suite 11g Handbook. Frequent presenter on conferences such as JavaOne, Oracle OpenWorld, ODTUG Kaleidoscope, Devoxx and OBUG. Presenter for Oracle University Celebrity specials.

9 Comments

  1. I am learning selenium ide . Can you please tell me how to use java script in test script to test a web based application .

  2. Can you tell me how to store all the data in one form and reuse the same in another form

  3. I have 2 answers to previous responses:

    1. Selenium IDE has variables: They are set with “store…” commands such as storeExpression or storeValue, and retrieved with this syntax: ${varname}

    3. Javascript can be embedded in several commands, especially ones with the word “Eval” in them such as storeEval or waitForEval.

  4. Selenium IDE looks like a very cool test tool. I’m the maintainer of TestMaker (http://www.pushtotest.com). We are working on a new test script recorder – possibly Firefox plug-in based – and wondered what problems you may have encountered writing the plug-in? -Frank

  5. im a new user to selenium ide i would like to know how the different commands can be used and would like to have the detailed and simple documentation of selenium ide so that i can use the tool

    thanks

  6. I have recorded alert using IDE,but on execution of test alert box is not shown,could u reply me immediately how to get it

    thanx in advance,
    swetha

  7. I have tried this Selenium – IDE tool. I want to use JavaScript commands in Selenium tool.

    Please provide an examples or How to use or call the JavaScript in to the Selenium Tool.

    Expecting the reply…

    – Meyyappan.M

  8. Stephan,

    I do not believe it currently supports the notion of variables in this way. I have not seen any indication of it in either the demonstrations or the documentation. It looks however like a valuable addition, especially if you could have a test loop over a series of values in an external source (like
    a csv file) and perform the test for every combination of values listed in the file.

    Perhaps you can file an enhancement request with the Selenium development team.

    regards,

    Lucas

  9. A cool piece of software. Does Selenium allow to introduce variables into scripts?
    Like type {name} into a field, assert value {name} in response page. And load the
    variables at test-run time?
    :-) stw