Adding Pages
Adding at least one page to a test case is required in order to create a new test case. A Page represents the individual page or unique page-specific content within a test case that you want to test for accessibility. It can be a full webpage or a part of a page (for example, a modal). Any common components defined within a test case that exist on a specified page will not be tested as a part of the testing for that page. Currently, the minimum requirement is 1 page, and although there is technically no maximum number of pages allowed, we recommend not adding more than 30 to ensure efficiency.
This table lists each field in the Add Page dialog box in the left column, with a usage description of each in the right column.
New Test Case: Pages (Step 3 of 3) screen > Add Page dialog box - Field Usage Descriptions
Field | Usage Description |
---|---|
Name | Required. This would typically be the page title or the name of a specific area of the page that is short text to uniquely identify what is being targeted for accessibility conformance. The maximum number of characters that you can enter in this field is 150. |
URL | Required. Type the Uniform Resource Locator as a fully-qualified domain name of the page, site, or application to be tested for accessibility. |
Scope | Select the Whole page radio button option to target the entire page, or the Page area option to specify only a portion of a page. When the Page area option is selected, the Selector field appears below the Scope field, which allows you to enter the appropriate CSS Selector. This can be a simple selector such as a class or ID, or a selector path. If you are using CSS IDs, ensure you start the ID with a #. For a CSS class name, start with a period or full stop(.). Examples: #myidname or .myclassname. For more information, see CSS Selector Process. |
Elements present on page | Check all that apply. Uncheck the checked box to deselect it, as desired. The Forms checkbox is selected by default. This allows you to target or ignore specific types of elements and their associated accessibility rules and checkpoints to limit what is being tested. |
Instructions | Type any detailed textual instructions that are important for the tester to understand prior to testing the page (for example, specific information required for accessing and/or exposing the page elements to be tested). Note: Select and drag the bottom right corner of the text box to expand it outward when a larger field space is necessary. |
Before You Begin: This procedure assumes you are adding a page to a new test case you are in the process of creating, however, it also applies to adding a new page to an existing test case by editing it. If you want to add a page to a new test case, you must first initiate the process for creating a new test case. For more information, see Creating a New Test Case. To add a page to an existing test case, select Edit test case from the Actions column on the Test Cases page. For more information, see Editing a Test Case. The Edit Test Case form (dialog box) is identical to New Test Case, but for the fact that it already has populated fields and at least one page already added.
Working with existing pages:
If you have bulk imported common components and pages using a CSV file upload method in the Details page, you may find existing pages on the right side of the page. To know how to edit pages, read the topic Editing Pages. To reorder the pages, read the topic Reordering Pages. To delete the page, read the topic Deleting a Page.
To add a page to a test case:
-
On the New Test Case page, activate the Add page button to the right of the Pages field label.
The Add Page dialog box pops up in a new window while the New Test Case page remains in the background.
-
Type the name of the page to be tested in the Name field.
-
Type (or paste) the page address (Uniform Resource Locator) in the URL field. Note: This field must be a valid URL with the appropriate protocol prefix.
-
In the Scope field, select either the Whole page or Page area radio button option as desired.
Page Area Note: When the Page area option is selected, the Selector field appears below the Scope field, which allows you to enter a CSS selector path which defines the element containing the page area. For more information, see CSS Selector Process.
-
Populate the optional Elements and Instructions fields, if desired.
- In the Elements field, check the desired elements) you want to test (Forms, Video, Audio, CAPTCHA, and/or Flashing content). By default, the Forms box is selected. Uncheck the checked box to deselect it if desired. These represent elements that could exist on the page that have one or more associated checkpoints.
- Deselecting Means Not Applicable: The Elements field on the Add Page dialog box provides several checkboxes that collectively represent elements that are less common on most pages. When you are leaving any of these unchecked, it is telling axe Auditor to ignore running the related rules that apply to these elements on the page under test, and to automatically assign the associated checkpoint tests a 'Not Applicable' result. Although your selections are made here initially, they later appear when a Test Run is started and automated testing is initiated on the Prepare Page for Automated Testing screen, where it will be possible for "on the fly" changes to be made to these selections.
- In the Instructions field, type any instructional note text relevant to the page, component or content to be tested. This is the appropriate field in which to record login details necessary to access the page to be tested. The instructions you enter here are displayed in the Step 2 field on the Prepare a Page for Automated and Manual Testing screen as a reminder to ensure the page is accessed appropriately prior to initiation of testing.
Add Another Page Note: Check the Add another page checkbox to automatically display a new,blank Add Page form window upon save.
- Activate the Add Page button.
After adding, the Add Page dialog box closes and the New Test Case: Pages (Step 3 of 3) screen displays a 'page created successfully' message at the top right, and each page you add appears as an item in the Pages Defined section of the Pages panel with a Page Name link that allows you to edit the page on the Edit Page dialog box, and a red X icon that allows you to delete the page.
Reordering Note: At this point you may realize you'd like the added pages to appear in a different order. This is possible using the "dragon" icon - a "grab" or "move" button with down and up arrows appearing to the right of each added page row in the Pages Defined section table. For more information, see Reordering Pages.
Next Step:
After you've created a Test Case, a logical next step is to create a Test Run, which can be initiated from the Test Cases screen.