Acceptance Testing XIII - A New Page Object

Creating a new page object containing the CSS and XPath locators we'll need to navigate through the MODX manager.


In the previous article, we created the data files containing the raw data for our users and resources. In this one, we'll create a new page object containing the CSS and XPath locators we'll need to navigate through the MODX manager.


MODX logo

This article assumes that you've installed and configured Composer, Codeception, PhpUnit, MODX, Java, WebDriver, and ChromeDriver as described in earlier articles, and that you've created the acceptance test support files from those articles.


New PageObject

We could have placed all the CSS and XPath locators used in our test in the test itself. In fact, that's how I originally wrote the test before moving the locators into a page object.

There are a couple of good reasons for putting them in PageObject. First, it puts them all in one place where they'll be easy to find if MODX is upgraded and the locators need to change. Second, using the PageObject improves the readability of the the test code and makes it a lot easier to follow. After all,

$resourceGroupAccessTab

Is a lot easier to understand than

"//span[contains(text(),'Resource Group Access')]"

Noticed that the long version above gives no clue that it's referring to a tab.


Creating the PageObject

We'll start by creating our page object, then we'll fill in the content.

In the _build directory, enter this command:

codecept generate:pageobject acceptance ResourceTestPage

After the command runs, you should see a file called ResourceTestPage.php in the _build/tests/_support/Page/Acceptance/ directory.

Use this code for the ResourceTestPage file (also available at GitHub here):

<?php
namespace Page\Acceptance;

/**
 * Declare UI map for this page here. CSS or XPath allowed.
 * Examples:
 * public static $usernameField = '#username';
 * public static $formSubmitButton = "#mainForm input[type=submit]";
 *
 * IMPORTANT - Be sure not to put a carriage return
 * in a quoted section inside an identifier.
 */

class ResourceTestPage
{
    /* Resources tab */
    public static $resourcesTab = "//li[@id='modx-leftbar-tabpanel__modx-resource-tree']";

    public static $systemMenu = '#limenu-admin';

    public static $acl_option = '#acls';

    public static $privateUsersGroup =
        "//span[starts-with(text(),'PrivateUsers')]";

    public static $updateUserGroupOption =
        // "//button[contains(text(), 'Update User Group')]";
    "//span[starts-with(text(),'Update User Group')]";

    public static $permissionsTab =
        "//span[starts-with(@class,'x-tab-strip-text')
         and text()='Permissions']";

    public static $resourceGroupAccessTab =
        "//span[contains(text(),'Resource Group Access')]";

    public static $addResourceGroupButton =
        "//button[contains(text(),'Add Resource Group')]";

    public static $resourceGroupInput =
        "//input[starts-with(@id,'modx-crgact')
        and contains(@id, 'resource-group')]";

    public static $privateResourcesOption =
        "//div[text()='PrivateResources']";

    public static $contextInput =
        "//input[starts-with(@id,'modx-crgact')
        and contains(@id, '-context')]";

    public static $mgrOption =
        "//span[text()='(mgr)']";

    public static $authorityInput =
        "//input[starts-with(@id,'modx-crgact')
        and contains(@id, 'authority')]";

    public static $testUserOption =
        "//div[text()='TestUser - 15'
        and contains(@class,'x-combo-list-item')]";

    public static $policyInput =
        "//*[starts-with(@id,'x-form-el-modx-crg')
        and contains(@id,'policy')]";

    public static $resourceOption =
        "//div[text()='Resource']";

    public static $addResourcePanelSaveButton =
        "//span[starts-with(@id,'ext-comp')]/em/button[text()='Save']";

    /**
     * Basic route example for your current URL
     * You can append any additional parameter to URL
     * and use it in tests like: Page\Edit::route('/123-post');
     */
    public static function route($param)
    {
        return static::$URL.$param;
    }

    /**
     * @var \AcceptanceTester;
     */
    protected $acceptanceTester;

    public function __construct(\AcceptanceTester $I)
    {
        $this->acceptanceTester = $I;
    }
}


Coming Up

In the next article, we'll take a closer look at the CSS and XPath locators in the ResourceTestPage class above.



For more information on how to use MODX to create a web site, see my web site Bob's Guides, or better yet, buy my book: MODX: The Official Guide.

Looking for high-quality, MODX-friendly hosting? As of May 2016, Bob's Guides is hosted at A2 hosting. (More information in the box below.)



Comments (0)


Please login to comment.

  (Login)