Writing System Tests for Joomla! - Part 1

As reported at Running Automated Tests for Version 1.6, Joomla! version 1.6 now includes a library of function tests. This document details the steps necessary to create functional tests using Selenium. You will also need to run Firefox and install the Selenium IDE add-on to Firefox. Instructions for this can be found in the Functional Testing article.

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

Creating a basic functional test

A few items to note:

• It's recommended to update your local copy of 1.6 to the latest build before writing any tests.
• 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 Slenium 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

In this test, we are going to test some of the menu items on the home page.

1. Open 1.6 in FireFox and navigate to the home page.

2. Open Selenium IDE by going to the Tools menu and select Selenium IDE. Selenium will start recording automatically and the record button will appear highligted.

3. Verify that the Base URL displayed in Selenium is that of your test site.

4. Perform the basic test by selecting the menu items to test with your mouse.

5. When you have completed your test, click the the red record button (see image below) to stop recording.

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:

<?php

require_once 'PHPUnit/Extensions/SeleniumTestCase.php';

class Example extends PHPUnit_Extensions_SeleniumTestCase
{
  function setUp()
  {
    $this->setBrowser("*chrome");
    $this->setBrowserUrl("http://change-this-to-the-site-you-are-testing/");
  }

  function testMyTestCase()
  {
    $this->open("/workspace/joomla-1-6-source/index.php/using-joomla/extensions/components/search-component/search.html");
    $this->click("//div[@id='leftcolumn']/div[1]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
    $this->click("//div[@id='leftcolumn']/div[2]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
  }
}
?>

• Since we have already set up test to work with Joomla!, and some supporting files, you can overwrite the top portion of your test with that of an existing test. For example, replace the following portion of your test:

<?php

require_once 'PHPUnit/Extensions/SeleniumTestCase.php';

class Example extends PHPUnit_Extensions_SeleniumTestCase
{
  function setUp()
  {
    $this->setBrowser("*chrome");
    $this->setBrowserUrl("http://change-this-to-the-site-you-are-testing/");
  }

With the following code:

<?php
/**
 * @version		$Id: SampleTest0001.php 
 * @package		Joomla.FunctionalTest
 * @copyright	Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 * @license		GNU General Public License version 2 or later; see LICENSE.txt
 * basic sample test
 */
require_once 'SeleniumJoomlaTestCase.php';

/**
 * @group ControlPanel
 */
class SampleTest0001 extends SeleniumJoomlaTestCase
{

and then rename

 function testMyTestCase()

with an appropriate name, that matches the class we just named,such as

  function SampleTest0001()

The final test will now look like:

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

require_once 'SeleniumJoomlaTestCase.php';

/**
 * @group ControlPanel
 */
class SampleTest0001 extends SeleniumJoomlaTestCase
{

  function SampleTest0001()
  {
    $this->open("/workspace/joomla-1-6-source/index.php/using-joomla/extensions/components/search-component/search.html");
    $this->click("//div[@id='leftcolumn']/div[1]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
    $this->click("//div[@id='leftcolumn']/div[2]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
  }
}
?>

We next want to add a few echo statements to output what we are testing for. So, we our code will now look like:

<pre><?php
/**
 * @version		$Id: SampleTest0001.php 
 * @package		Joomla.FunctionalTest
 * @copyright	Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 * @license		GNU General Public License version 2 or later; see LICENSE.txt
 * basic sample test
 */

require_once 'SeleniumJoomlaTestCase.php';

/**
 * @group ControlPanel
 */
class SampleTest0001 extends SeleniumJoomlaTestCase
{

  function SampleTest0001()
  {
    echo "Testing search menu item.\n";
    $this->open("/workspace/joomla-1-6-source/index.php/using-joomla/extensions/components/search-component/search.html");
    $this->click("//div[@id='leftcolumn']/div[1]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
    $this->click("//div[@id='leftcolumn']/div[2]/div/div/div/ul/li[1]/a");
    $this->waitForPageToLoad("30000");
  }
}
?>