Actions

Difference between revisions of "Writing System Tests for Joomla! - Part 1"

From Joomla! Documentation

(Tips & Tricks)
(merge how to from System Testing article & break into two articles)
Line 1: Line 1:
 
== Introduction ==
 
== Introduction ==
  
As documented at [[Running_Automated_Tests_for_Version_1.6]], Joomla! 1.6 now includes a library of system tests. This document details the steps necessary to create system tests using Selenium IDE. You will also need to run Firefox and install the Selenium IDE add-on to Firefox. Instructions for this can be found in the [[System Testing]] article.  
+
As documented at [[Running_Automated_Tests_for_Version_1.6]], Joomla! 1.6 now includes a library of system tests. This document details the steps necessary to create system tests using Selenium IDE. This article is split into two parts. The first part covers recording tests using the Selenium IDE. The second part covers more advanced topics, including converting recorded tests into PHP system tests that can be run automatically.
 +
 
 +
For background information about System Testing, please see the [[System Testing]] article.  
  
 
NOTE: This article assumes that you have read the aforementioned articles and have PHPUnit and Selenium set up and working properly.
 
NOTE: This article assumes that you have read the aforementioned articles and have PHPUnit and Selenium set up and working properly.
  
== Overview ==
+
== Recording System Tests with Selenium IDE ==
Writing a system test essentially entails converting a Selenium IDE test to a format that we can easily integrate into the Joomla! test suite.
+
Selenium IDE makes it fairly easy to write system tests. It is a Firefox extension that operates as an Integrated Development Environment for creating system tests. In essence, it records your clicks as you navigate in your browser and encodes them into a series of commands that can control the browser. Tests recorded with Selenium IDE can be converted to tests within the Joomla repository and integrated into the test suite.
See [[System Testing]] for a good primer on system tests.
+
  
== Tips & Tricks ==
+
=== Getting Selenium IDE ===
* It is recommended to update your local copy of Joomla! to the latest build before writing or using any tests.
+
At of May 27, 2010, the latest version of Selenium IDE is 1.0.7. You can get it at http://seleniumhq.org/download/. Click on the download link and install like you would any Firefox plugin.
* Some of the tests written for Joomla! version 1.6 use the included sample data. You need to install the sample data to run these tests.
+
* Some system tests are loosely dependent on the default templates. The systems tests written for version 1.6 use the Beez2 (front end) and Bluestork (back end) templates. (see [[Writing_System_Tests_for_Version_1.6#Methods_for_Identifying_Elements]])
+
* It is recommended that tests "undo" any changes made to the site. For example, if you create a new User Group for a test, or series of tests, be sure to delete the group before concluding your test or series of tests. This can be done as part of the test. Other tests may encounter issues if artifacts of other tests are present.
+
* The test are written in PHP and we are using Selenium RC to execute them later. You will need to select the PHP Selenium RC Format in Selenium IDE. Go to Options -> Format -> PHP Selenium RC
+
* More information about writing test can be found at [http://www.phpunit.de/manual/current/en/writing-tests-for-phpunit.html http://www.phpunit.de/manual/current/en/writing-tests-for-phpunit.html]
+
  
== Creating a Basic System Test ==
+
==== Preparing your Environment ====
By leveraging the [[Selenium_Test_Case_Methods]] present in Joomla! 1.6, we can create a simple automated system test with just a few lines of code.  
+
To get started, create a clean install of Joomla! with the standard sample data or update your local copy to the latest build and perform a re-installation.
  
For example, to test logging into and then out of the back end, we could use the following code:
+
=== Creating a Basic Test ===
<pre><?php
+
# To start, open Firefox and browse to the home page of your Joomla! install.  For example, I setup my install on my localhost, and so the URL is http://127.0.0.1/selsampledata.
require_once 'SeleniumJoomlaTestCase.php';
+
# Click on Tools -> Selenium IDE. You will notice that on the right of the window that appears near the top, that there is a red circle that is highlighted. This is the start/stop recording button. When you start Selenium IDE, recording starts right away.
 +
#* For our first test, we are going to load the home page and check to make sure that all the items in the Main Menu are present.
 +
#* The commands that we use to check that items are present are called assertions. Basically, you perform your actions and make assertions about the results.
 +
#* In our case, we are going to use the command assertText. This command will read the text of a specified element and ensure it matches a particular value.
 +
# Ensure that the Base URL displayed in the Selenium IDE window is the home page of your Joomla! install.
 +
# Switch to the browser window that has your Joomla install open.
 +
# Right click on each menu item and select 'Assert Text'.
 +
# Switch to your Selenium IDE window and click the Red Button to stop recording.
  
class ControlPanelExample extends SeleniumJoomlaTestCase
+
You should see two tabs in your Selenium IDE window - one labeled Table, and one labeled Source. At this point you don't really need to look at the Source window.
{
+
function testExample()
+
{
+
$this->setUp();
+
$this->doAdminLogin();
+
$this->doAdminLogout();
+
}
+
}
+
?></pre>
+
  
* <code>require_once 'SeleniumJoomlaTestCase.php';?</code> allows use to utilize the methods that belong to the Selenium Joomla Test Case class
+
[[Image:Selenium-screen.png]]
* <code>class ControlPanelExample extends SeleniumJoomlaTestCase</code> extends a class into our SeleniumJoomlaTestCase to implement the client/server protocol to talk to Selenium RC as well as specialized assertion methods for web testing.
+
* Each test is written as a function.
+
* <code>$this->setUp();</code> envokes our configuration from <code>tests/system/servers/configdef.php</code> see [[Running_Automated_Tests_for_Version_1.6#Create_a_Selenium_Configuration_File]]
+
* <code>$this->doAdminLogin();</code> is a Selenium Joomla Test Case method that logs into the back end.
+
* <code>$this->doAdminLogoutn();</code> is a Selenium Joomla Test Case method that logs out of the back end.
+
  
  
== Creating an Intermediate System Test ==
+
Our first test is done.
In this test, we are going to execute the test described at [[Intermediate_Selenium_Example]] and integrate it into the system tests suite in 1.6.
+
  
1. Open Joomla! 1.6 in FireFox and navigate to the home page.
+
To run your test, you use the icons on the bar between the Base URL address bar and the Table and Source tabs. The two important buttons are the buttons with the Green Triangle with Three Solid rectangles and the one with the Green Triangle and One Solid Rectangle. The first one will execute the entire test suite and the second one will run the currently selected test case. Since we currently have only one test case, both of these currently do the same thing.
  
2. Open Selenium IDE by going to the Tools menu and select Selenium IDE. Selenium will start recording automatically and the red record button will appear highlighted (see image below).
+
To run your test, press one of these buttons.
  
3. Verify that the Base URL displayed in Selenium, next to the record button, is that of your test site.
+
As you watch the Selenium IDE, you will see a yellow bar move down your list of steps. Once a step is completed, a successfully executed action (i.e. a button was successfully located and clicked) should show up in light green and a successful assertion should show up in darker green. Failed actions show up in light red and failed assertions show up in darker red.
  
4. Perform the test by following the instructions described above (Note: there are some slight variations between the test described above and the one we performed. This is due to variation of 1.6 during the development process).
+
Click on the Window Expander on the left to unhide the Test Case browser.
  
5. When you have completed your test, click the the red record button (see image below) to stop recording.  
+
If your test completed successfully, you should see Runs: 1, Failures: 0 at the bottom of the Test Case browser.
  
 +
Once recorded, you can export your test to a file for later use. In this example, we choose HTML so that we can easily share it with others. This is the recommended format to use for saving a Selenium Test.
  
[[Image:Selenium-screen.png]]
+
[[Image:Selenium-export.png]]
 +
 
 +
== Converting Selenium IDE Tests ==
 +
Tests recorded with Selenium IDE can be converted for inclusion in the /tests/system folder as well as integration in to the test suite.
 +
 
 +
We'll continue our example from above and convert the Selenium IDE test to a PHP file for inclusion in the /tests/system folder.
  
 +
Since the test was exported in the HTML format, we can easily open it and re-play it in Selenium IDE.
  
6. Once recording has stopped, create a new PHP file in Eclipse (or your favorite code editor) and copy / paste the code from Selenium IDE to there. The contents of the example test is:
+
Assuming that the test behaves as expected, we will convert it to PHP by selecting Options -> Format -> PHP - Selenium RC.
 +
 
 +
[[Image:Selenium-change-format.png]]
 +
 
 +
The test can now be be exported as PHP by selecting File -> Export Test Case As -> PHP - Selenium RC.
 +
 
 +
[[Image:Selenium-export-php.png]]
 +
 
 +
The converted Selenium IDE test now looks like:
 
<pre><?php
 
<pre><?php
  
Line 70: Line 73:
 
   {
 
   {
 
     $this->setBrowser("*chrome");
 
     $this->setBrowser("*chrome");
     $this->setBrowserUrl("http://change-this-to-the-site-you-are-testing/");
+
     $this->setBrowserUrl("http://127.0.0.1/selsampledata/");
 
   }
 
   }
  
 
   function testMyTestCase()
 
   function testMyTestCase()
 
   {
 
   {
     $this->open("/workspace/joomla-1-6-source/administrator/index.php?option=com_login");
+
     $this->open("/workspace/joomla-1-6-source/");
    $this->type("mod-login-username", "admin");
+
     $this->click("link=Using Joomla!");
     $this->click("link=Log in");
+
 
     $this->waitForPageToLoad("30000");
 
     $this->waitForPageToLoad("30000");
     $this->click("link=User Manager");
+
    $this->assertEquals("Getting started", $this->getText("link=Getting started"));
 +
    $this->assertTrue($this->isElementPresent("link=Extensions"));
 +
     $this->click("link=The Joomla! Community");
 
     $this->waitForPageToLoad("30000");
 
     $this->waitForPageToLoad("30000");
     $this->click("//li[@id='toolbar-new']/a/span");
+
     $this->assertEquals("The Joomla! Project", $this->getText("link=The Joomla! Project"));
    $this->waitForPageToLoad("30000");
+
     $this->click("//div[@id='breadcrumbs']/p/span/a");
    $this->type("jform_name", "My Test User");
+
    $this->type("jform_username", "TestUser");
+
    $this->type("jform_password", "password");
+
    $this->type("jform_password2", "password");
+
    $this->type("jform_email", "test@example.com");
+
    $this->click("1group_2");
+
    $this->click("link=Save & Close");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("Item successfully saved."));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->type("search", "TestUser");
+
     $this->click("//button[@type='submit']");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("TestUser"));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Log out");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("link=Go to site home page.");
+
    $this->waitForPageToLoad("30000");
+
    $this->type("modlgn_username", "TestUser");
+
    $this->type("modlgn_passwd", "password");
+
    $this->click("Submit");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("My Test User"));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Logout");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("//button[@type='submit']");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("link=Site Administrator");
+
    $this->waitForPageToLoad("30000");
+
    $this->type("mod-login-username", "admin");
+
    $this->click("link=Log in");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("//img[@alt='User Manager']");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("cb0");
+
    $this->click("link=Delete");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("1 item(s) successfully deleted."));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Log out");
+
 
     $this->waitForPageToLoad("30000");
 
     $this->waitForPageToLoad("30000");
 
   }
 
   }
Line 142: Line 92:
 
?></pre>
 
?></pre>
  
As noted in [[Intermediate_Selenium_Example]] Selenium does not record passwords that are entered. Additionally, we want to utilize [[Selenium_Test_Case_Methods]] to prevent coding path or login information in the test.
+
It is nearly ready to be added to <code>/tests/system</code>, but needs a few modifications before doing so.
  
 
+
* We need to add a comment block to the top
1. The first step in integrating this test into <code>tests/suite</code> is to call <code>SeleniumJoomlaTestCase.php</code> so that we can utilize the Selenium Test Case Methods. To do this, we will replace the first portion of our code:
+
<pre>
<pre><?php
+
<?php
require_once 'PHPUnit/Extensions/SeleniumTestCase.php';
+
/**
 +
* @version    $Id: exmaple0001Test.php
 +
* @package Joomla.SystemTest
 +
* @copyright Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 +
* @license GNU General Public License version 2 or later; see LICENSE.txt
 +
* Tests creating a test
 +
*/
 
</pre>
 
</pre>
 
+
* We need to change <code>require_once 'PHPUnit/Extensions/SeleniumTestCase.php';</code> to <code>require_once 'SeleniumJoomlaTestCase.php';</code>
with the following code
+
<pre>
 
+
<pre><?php
+
require_once 'SeleniumJoomlaTestCase.php';</pre>
+
 
+
* We can now start utilizing the Selenium Joomla Test Case Methods.
+
 
+
 
+
2. We will now extend a class into our SeleniumJoomlaTestCase to implement the client/server protocol to talk to Selenium RC as well as specialized assertion methods for web testing.
+
 
+
This is done by replacing:
+
<pre>class Example extends PHPUnit_Extensions_SeleniumTestCase
+
{</pre>
+
 
+
with
+
 
+
<pre>class User0002Test extends SeleniumJoomlaTestCase
+
{</pre>
+
 
+
* The top portion of our test now looks like:
+
<pre><?php
+
 
require_once 'SeleniumJoomlaTestCase.php';
 
require_once 'SeleniumJoomlaTestCase.php';
 
+
</pre>
class User0002Test extends SeleniumJoomlaTestCase
+
* Change the class Selenium IDE uses to a new class, that extends SeleniumJoomlaTestCase, using the naming convention, written in CamelCase, of <code>subject + test number in the series (4 digits) + "Test"</code>.
{
+
** For example, our test that we are calling example would be:<code> Example + 0001 + Test</code> resulting in <code>Example0001Test</code>
 
+
<pre>class Example0001Test extends SeleniumJoomlaTestCase</pre>
  function testMyTestCase()
+
* Remove the function setUp()
  {</pre>
+
 
+
* At this point, running the test would successfully launch a two browsers instances, one for Selenium Remote Control and one for test itself, but it would fail due to the lack of the password being recorded. Additionally, we want to be sure that none of the path information is hard coded in the test.
+
 
+
3. To improve our code, and achieve what we noted above, we would delete the function below:
+
 
+
 
<pre>function setUp()
 
<pre>function setUp()
 
   {
 
   {
 
     $this->setBrowser("*chrome");
 
     $this->setBrowser("*chrome");
     $this->setBrowserUrl("http://change-this-to-the-site-you-are-testing/");
+
     $this->setBrowserUrl("http://127.0.0.1/selsampledata/");
   }</pre>
+
   }
and add the following to our testMyTestCase function
+
</pre>
<pre> $this->setUp();</pre>
+
created by Selenium IDE and add <pre>$this->setUp();</pre> to our test function.
Additionaly, we can replace the following line of code:
+
<pre>$this->open("/workspace/joomla-1-6-source/administrator/index.php?option=com_login");</pre>
+
with
+
<pre>$this->gotoAdmin();</pre>
+
As you can see, this will prevent us from hard coding the path into the test.
+
  
We can now replace
 
<pre>$this->type("mod-login-username", "admin");
 
    $this->click("link=Log in");
 
    $this->waitForPageToLoad("30000");</pre>
 
with
 
<pre>$this->doAdminLogin();</pre>
 
  
At this point, running our test would succeed up until the point where we need to log into the administrative interface the second time. We'll fix that by replacing:
 
<pre>    $this->type("mod-login-username", "admin");
 
    $this->click("link=Log in");
 
    $this->waitForPageToLoad("30000");</pre>
 
  
with
+
The converted test now looks like:
 +
<pre><?php
 +
/**
 +
* @version    $Id: exmaple0001Test.php
 +
* @package Joomla.SystemTest
 +
* @copyright Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 +
* @license GNU General Public License version 2 or later; see LICENSE.txt
 +
* Tests creating a test
 +
*/
  
<pre>$this->doAdminLogin();</pre>
+
require_once 'SeleniumJoomlaTestCase.php';
  
Running our test should now successfully create, verify the creation of, and delete our new test user.
+
class Example0001Test extends SeleniumJoomlaTestCase
 +
{
 +
function testCreatDeleteGroup()
 +
{
 +
  $this->setUp();
 +
        $this->open("/workspace/joomla-1-6-source/");
 +
        $this->click("link=Using Joomla!");
 +
        $this->waitForPageToLoad("30000");
 +
        $this->assertEquals("Getting started", $this->getText("link=Getting started"));
 +
        $this->assertTrue($this->isElementPresent("link=Extensions"));
 +
        $this->click("link=The Joomla! Community");
 +
        $this->waitForPageToLoad("30000");
 +
        $this->assertEquals("The Joomla! Project", $this->getText("link=The Joomla! Project"));
 +
        $this->click("//div[@id='breadcrumbs']/p/span/a");
 +
        $this->waitForPageToLoad("30000");
 +
        }
 +
}
 +
?></pre>
  
* To rely to the user what is happening, we want to add echo statements  to our code.
+
Your test can now be saved to the <code>/tests/system</code> folder within Joomla and run as a member of the test suite. See [[Running_Automated_Tests_for_Version_1.6]]
  
Our final test looks like:
+
== Creating a Basic System Test ==
<pre><?php
+
By leveraging the [[Selenium_Test_Case_Methods]], we can streamline automated system test with just a few lines of code.
  
 +
For example, to test logging into and then out of the back end, we could use the following code:
 +
<pre><?php
 
require_once 'SeleniumJoomlaTestCase.php';
 
require_once 'SeleniumJoomlaTestCase.php';
  
class User0002Test extends SeleniumJoomlaTestCase
+
class ControlPanelExample extends SeleniumJoomlaTestCase
 
{
 
{
  function testMyTestCase()
+
function testExample()
  {
+
{
    echo("Starting testMyTestCase\n");
+
$this->setUp();
    $this->setUp();
+
$this->doAdminLogin();
    $this->gotoAdmin();
+
$this->doAdminLogout();
    $this->doAdminLogin();
+
    $this->click("link=User Manager");
+
    $this->waitForPageToLoad("30000");
+
    echo("Add new user.\n");
+
    $this->click("//li[@id='toolbar-new']/a/span");
+
    $this->waitForPageToLoad("30000");
+
    $this->type("jform_name", "My Test User");
+
    $this->type("jform_username", "TestUser");
+
    $this->type("jform_password", "password");
+
    $this->type("jform_password2", "password");
+
    $this->type("jform_email", "test@example.com");
+
    $this->click("1group_2");
+
    $this->click("link=Save & Close");
+
    $this->waitForPageToLoad("30000");
+
    echo("Verify existence of new user.\n");
+
    try {
+
        $this->assertTrue($this->isTextPresent("Item successfully saved."));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->type("search", "TestUser");
+
    $this->click("//button[@type='submit']");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("TestUser"));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Log out");
+
    $this->waitForPageToLoad("30000");
+
    echo("Go to home page.\n");   
+
    $this->click("link=Go to site home page.");
+
    $this->waitForPageToLoad("30000");
+
    echo("Log in as TestUser.\n");   
+
    $this->type("modlgn_username", "TestUser");
+
    $this->type("modlgn_passwd", "password");
+
    $this->click("Submit");
+
    $this->waitForPageToLoad("30000");
+
    echo("Verify existence of new user.\n");   
+
    try {
+
        $this->assertTrue($this->isTextPresent("My Test User"));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Logout");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("//button[@type='submit']");
+
    $this->waitForPageToLoad("30000");   
+
    $this->click("link=Site Administrator");
+
    $this->waitForPageToLoad("30000");
+
$this->doAdminLogin();
+
    $this->click("//img[@alt='User Manager']");
+
    $this->waitForPageToLoad("30000");
+
    $this->click("cb0");
+
    echo("Delete new user.\n");   
+
    $this->click("link=Delete");
+
    $this->waitForPageToLoad("30000");
+
    try {
+
        $this->assertTrue($this->isTextPresent("1 item(s) successfully deleted."));
+
    } catch (PHPUnit_Framework_AssertionFailedError $e) {
+
        array_push($this->verificationErrors, $e->toString());
+
    }
+
    $this->click("link=Log out");
+
    $this->waitForPageToLoad("30000");
+
  }
+
 
}
 
}
?>
+
}
</pre>
+
?></pre>
  
== Methods for Identifying Elements ==
+
* <code>require_once 'SeleniumJoomlaTestCase.php';?</code> allows use to utilize the methods that belong to the Selenium Joomla Test Case class
 +
* <code>class ControlPanelExample extends SeleniumJoomlaTestCase</code> extends a class into our SeleniumJoomlaTestCase to implement the client/server protocol to talk to Selenium RC as well as specialized assertion methods for web testing.
 +
* Each test is written as a function.
 +
* <code>$this->setUp();</code> envokes our configuration from <code>tests/system/servers/configdef.php</code> see [[Running_Automated_Tests_for_Version_1.6#Create_a_Selenium_Configuration_File]]
 +
* <code>$this->doAdminLogin();</code> is a Selenium Joomla Test Case method that logs into the back end.
 +
* <code>$this->doAdminLogoutn();</code> is a Selenium Joomla Test Case method that logs out of the back end.
  
== See Also ==
+
== More Advanced Topics ==
* [[System_Testing]]
+
To learn about more advanced topics related to system testing, please see the article [[Writing System Tests for Joomla! Part 2]].
* [[Running_Automated_Tests_for_Version_1.6]]
+
* [[System_Tests_Available_in_Version_1.6]]
+
  
 
[[Category:Bug Squad]][[Category:Development]][[Category:Testing]][[Category:Automated Testing]]
 
[[Category:Bug Squad]][[Category:Development]][[Category:Testing]][[Category:Automated Testing]]

Revision as of 17:27, 7 June 2010

Contents

Introduction

As documented at Running_Automated_Tests_for_Version_1.6, Joomla! 1.6 now includes a library of system tests. This document details the steps necessary to create system tests using Selenium IDE. This article is split into two parts. The first part covers recording tests using the Selenium IDE. The second part covers more advanced topics, including converting recorded tests into PHP system tests that can be run automatically.

For background information about System Testing, please see the System Testing article.

NOTE: This article assumes that you have read the aforementioned articles and have PHPUnit and Selenium set up and working properly.

Recording System Tests with Selenium IDE

Selenium IDE makes it fairly easy to write system tests. It is a Firefox extension that operates as an Integrated Development Environment for creating system tests. In essence, it records your clicks as you navigate in your browser and encodes them into a series of commands that can control the browser. Tests recorded with Selenium IDE can be converted to tests within the Joomla repository and integrated into the test suite.

Getting Selenium IDE

At of May 27, 2010, the latest version of Selenium IDE is 1.0.7. You can get it at http://seleniumhq.org/download/. Click on the download link and install like you would any Firefox plugin.

Preparing your Environment

To get started, create a clean install of Joomla! with the standard sample data or update your local copy to the latest build and perform a re-installation.

Creating a Basic Test

  1. To start, open Firefox and browse to the home page of your Joomla! install. For example, I setup my install on my localhost, and so the URL is http://127.0.0.1/selsampledata.
  2. Click on Tools -> Selenium IDE. You will notice that on the right of the window that appears near the top, that there is a red circle that is highlighted. This is the start/stop recording button. When you start Selenium IDE, recording starts right away.
    • For our first test, we are going to load the home page and check to make sure that all the items in the Main Menu are present.
    • The commands that we use to check that items are present are called assertions. Basically, you perform your actions and make assertions about the results.
    • In our case, we are going to use the command assertText. This command will read the text of a specified element and ensure it matches a particular value.
  3. Ensure that the Base URL displayed in the Selenium IDE window is the home page of your Joomla! install.
  4. Switch to the browser window that has your Joomla install open.
  5. Right click on each menu item and select 'Assert Text'.
  6. Switch to your Selenium IDE window and click the Red Button to stop recording.

You should see two tabs in your Selenium IDE window - one labeled Table, and one labeled Source. At this point you don't really need to look at the Source window.

Selenium-screen.png


Our first test is done.

To run your test, you use the icons on the bar between the Base URL address bar and the Table and Source tabs. The two important buttons are the buttons with the Green Triangle with Three Solid rectangles and the one with the Green Triangle and One Solid Rectangle. The first one will execute the entire test suite and the second one will run the currently selected test case. Since we currently have only one test case, both of these currently do the same thing.

To run your test, press one of these buttons.

As you watch the Selenium IDE, you will see a yellow bar move down your list of steps. Once a step is completed, a successfully executed action (i.e. a button was successfully located and clicked) should show up in light green and a successful assertion should show up in darker green. Failed actions show up in light red and failed assertions show up in darker red.

Click on the Window Expander on the left to unhide the Test Case browser.

If your test completed successfully, you should see Runs: 1, Failures: 0 at the bottom of the Test Case browser.

Once recorded, you can export your test to a file for later use. In this example, we choose HTML so that we can easily share it with others. This is the recommended format to use for saving a Selenium Test.

Selenium-export.png

Converting Selenium IDE Tests

Tests recorded with Selenium IDE can be converted for inclusion in the /tests/system folder as well as integration in to the test suite.

We'll continue our example from above and convert the Selenium IDE test to a PHP file for inclusion in the /tests/system folder.

Since the test was exported in the HTML format, we can easily open it and re-play it in Selenium IDE.

Assuming that the test behaves as expected, we will convert it to PHP by selecting Options -> Format -> PHP - Selenium RC.

Selenium-change-format.png

The test can now be be exported as PHP by selecting File -> Export Test Case As -> PHP - Selenium RC.

Selenium-export-php.png

The converted Selenium IDE test now looks like:

<?php

require_once 'PHPUnit/Extensions/SeleniumTestCase.php';

class Example extends PHPUnit_Extensions_SeleniumTestCase
{
  function setUp()
  {
    $this->setBrowser("*chrome");
    $this->setBrowserUrl("http://127.0.0.1/selsampledata/");
  }

  function testMyTestCase()
  {
    $this->open("/workspace/joomla-1-6-source/");
    $this->click("link=Using Joomla!");
    $this->waitForPageToLoad("30000");
    $this->assertEquals("Getting started", $this->getText("link=Getting started"));
    $this->assertTrue($this->isElementPresent("link=Extensions"));
    $this->click("link=The Joomla! Community");
    $this->waitForPageToLoad("30000");
    $this->assertEquals("The Joomla! Project", $this->getText("link=The Joomla! Project"));
    $this->click("//div[@id='breadcrumbs']/p/span/a");
    $this->waitForPageToLoad("30000");
  }
}
?>

It is nearly ready to be added to /tests/system, but needs a few modifications before doing so.

  • We need to add a comment block to the top
<?php
/**
 * @version     $Id: exmaple0001Test.php
 * @package Joomla.SystemTest
 * @copyright Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 * @license GNU General Public License version 2 or later; see LICENSE.txt
 * Tests creating a test
 */
  • We need to change require_once 'PHPUnit/Extensions/SeleniumTestCase.php'; to require_once 'SeleniumJoomlaTestCase.php';
require_once 'SeleniumJoomlaTestCase.php';
  • Change the class Selenium IDE uses to a new class, that extends SeleniumJoomlaTestCase, using the naming convention, written in CamelCase, of subject + test number in the series (4 digits) + "Test".
    • For example, our test that we are calling example would be: Example + 0001 + Test resulting in Example0001Test
class Example0001Test extends SeleniumJoomlaTestCase
  • Remove the function setUp()
function setUp()
  {
    $this->setBrowser("*chrome");
    $this->setBrowserUrl("http://127.0.0.1/selsampledata/");
  }

created by Selenium IDE and add

$this->setUp();

to our test function.


The converted test now looks like:

<?php
/**
 * @version     $Id: exmaple0001Test.php
 * @package Joomla.SystemTest
 * @copyright Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 * @license GNU General Public License version 2 or later; see LICENSE.txt
 * Tests creating a test
 */

require_once 'SeleniumJoomlaTestCase.php';

class Example0001Test extends SeleniumJoomlaTestCase
{
function testCreatDeleteGroup()
{
  $this->setUp();
        $this->open("/workspace/joomla-1-6-source/");
        $this->click("link=Using Joomla!");
        $this->waitForPageToLoad("30000");
        $this->assertEquals("Getting started", $this->getText("link=Getting started"));
        $this->assertTrue($this->isElementPresent("link=Extensions"));
        $this->click("link=The Joomla! Community");
        $this->waitForPageToLoad("30000");
        $this->assertEquals("The Joomla! Project", $this->getText("link=The Joomla! Project"));
        $this->click("//div[@id='breadcrumbs']/p/span/a");
        $this->waitForPageToLoad("30000");
        }
}
?>

Your test can now be saved to the /tests/system folder within Joomla and run as a member of the test suite. See Running_Automated_Tests_for_Version_1.6

Creating a Basic System Test

By leveraging the Selenium_Test_Case_Methods, we can streamline automated system test with just a few lines of code.

For example, to test logging into and then out of the back end, we could use the following code:

<?php
require_once 'SeleniumJoomlaTestCase.php';

class ControlPanelExample extends SeleniumJoomlaTestCase
{
function testExample()
{
$this->setUp();
$this->doAdminLogin();
$this->doAdminLogout();
}
}
?>
  • require_once 'SeleniumJoomlaTestCase.php';? allows use to utilize the methods that belong to the Selenium Joomla Test Case class
  • class ControlPanelExample extends SeleniumJoomlaTestCase extends a class into our SeleniumJoomlaTestCase to implement the client/server protocol to talk to Selenium RC as well as specialized assertion methods for web testing.
  • Each test is written as a function.
  • $this->setUp(); envokes our configuration from tests/system/servers/configdef.php see Running_Automated_Tests_for_Version_1.6#Create_a_Selenium_Configuration_File
  • $this->doAdminLogin(); is a Selenium Joomla Test Case method that logs into the back end.
  • $this->doAdminLogoutn(); is a Selenium Joomla Test Case method that logs out of the back end.

More Advanced Topics

To learn about more advanced topics related to system testing, please see the article Writing System Tests for Joomla! Part 2.