You are here: Mozilla Accessibility QA testcases > Testing web content with JAWS screen reader

Accessibility QA Test Case: web content with JAWS screen reader in Firefox

Firefox Web Content on Microsoft Windows: Navigation of Web content using Freedom Scientific JAWS.

Description

This test case describes the approach and methods used to test keyboard navigation and keyboard functions in a web page displayed in the Windows version of Firefox, using the JAWS screen reader. Be sure to follow the test case setup instructions before proceeding with this test case.

The following types of functions will be tested. You can select the provided link for each to go directly to the section.

This test case is based on the IBM Web accessibility checklist, checkpoints 1, 2, 3, 5, 7, 9, and 10.

Scope of test

The goal is to test is to verify that the Firefox Web browser and the JAWS screen reader work together. The focus of this test is Web content that is displayed in the Web browser. This Web page file contains a number of common Web page elements. JAWS should read appropriate information for all elements in this page, as described in this test case.

This test might uncover Firefox bugs or JAWS bugs. Firefox bugs should be reported to the Mozilla.org bug tracking system. JAWS bugs should be reported to Freedom Scientific.

It is impossible include every combination of web page elements here, but the techniques described here can be used when testing other Web pages. This test case does not include applets, plug-ins, or multimedia content. Testers are encouraged to find live Web sites containing those elements, and test them using JAWS also.

The techniques discussed in in this test case are specifically for JAWS and Firefox running on the Microsoft Windows operating system. Learning to use a screen reader such as JAWS takes time and practice. This test case attempts to help a novice use many JAWS features relating to Web page navigation. Read the JAWS Help pages and online manual for more information on how to use JAWS.

Tools required

This test case requires the use of the JAWS screen reader. Information about JAWS can be found on the Freedom Scientific Web site.

Test Case Setup

All of these files must be available for this test case. You may save them all in a file folder on your PC, or, if you have a Web server, they may all be stored in a single directory on the Web server.

  1. win-webcontent-jaws.html (This is the file you are reading right now.)
  2. groovy-longdesc.html
  3. groovyimg.jpg
  4. imgmap2.jpg

Test Case Instructions

  1. Start JAWS.
  2. Open this file with Firefox.
  3. With JAWS running, scroll down through this file within the Firefox browser and follow the instructions written in each section. Do not use the mouse during the execution of this test case.
  4. In the instructions, keystroke sequences are listed in bold type. For example: H means to press the "H" key on the keyboard, or Ctrl + H means to press and hold the Ctrl key, then press and release the H key, then release the Ctrl key.
JAWS Virtual PC Cursor mode

Note about JAWS Virtual PC Cursor Mode:

Because Web pages are essentially "read-only", JAWS uses its Virtual PC Cursor mode when reading Web pages. This mode allows you to navigate the page in a way similar to navigating a word processor document, using the Arrow keys to move forward and backward, up and down.

If you are not familiar with JAWS cursor modes, see the JAWS online documentation for more information.

Tip: You can press Insert + Z to toggle virtual cursor mode on and off. If you have somehow turned virtual cursor mode off, press Insert + Z to turn it back on.

Please note:

End of "Note about JAWS Virtual PC Cursor mode"

JAWS Configuration Manager HTML Options

Note about JAWS Configuration Manager HTML options:

JAWS provides a number of options that govern how much or how little information JAWS will speak in certain situations. To view the HTML options in the Configuration Manager:

These are the options to be used when running this test case. All of these options are default settings, so you should not need to set them manually. Even so, you should verify that these options are set before running this test.

You can select additional verbosity options to increase the amount of information spoken by JAWS, if you wish.

End of "Note about JAWS Configuration Manager HTML options"

Basic Text Navigation

JAWS provides a number of keystrokes to navigate Web pages. This section describes many of those keystrokes, to be tested with Firefox. Perform all of these keystrokes to verify that they work with the Firefox browser.

JAWS Web page text navigation keystrokes

Verify that each of the following JAWS navigation functions works with as described while reading this test case.









End of Basic Text Navigation test section.

Testing Link, Image, and Image Map Navigation

Verbosity settings for links and images (press Ins + V to view):

JAWS provides keystrokes to navigate from one link to another in the Web page. Perform the following keystrokes and verify that JAWS performs the indicated action.

Following the list of keystrokes to be tested, below, you will find some sample link elements to be used in this test, including a text link, an image link, and an image map containing several links. (There are many other links in this file that can be tested using the JAWS link navigation keys also.)

JAWS Web page link and graphic navigation keystrokes
Link elements for use in Link testing

Verify that all of the JAWS keystrokes listed above work properly with all of the following links.

  1. Select this text link to jump to the "Link, Image, and Image Map Navigation" section header.
  2. The graphic image below is an image link that links to the Link Navigation section header. It also has alternative text (alt) defined. Groovy Image Link Button
  3. This is an image map that links to various sections of this file. Each area of the image has alternative text which is the same as the text on the image. image map containing links to various sections of this document.
  4. The graphic image below has a long description (longdesc) attribute defined. Groovy Image Link Button with long description

Text Links JavaScripts Forms Frames Tables Misc

End of link navigation test section.

Testing Simple JavaScripts

Verbosity settings for JavaScripts (press Ins + V to view). Note, there are no specific options for JavaScripts, but the Object settings may affect the way Window-Eyes reads certain elements.

This section contains some simple JavaScripts.. Please feel free to find other more complex JavaScript examples on other Web pages on the net, and test the ability to use those JavaScripts in Firefox using JAWS.

Javascript: Onkeypress alert

The JavaScript in this section is activated by placing keyboard focus on the sentence that says "Activate this JavaScript to cause onKeyPress alert", and pressing the Enter key. When activated, the JavaScript will display an alert pop-up message.

The goal of this section is to verify the following things:

  1. Navigate to the script, below, using these methods. (Go through these steps twice, once for each method of navigation!):
    1. Use normal JAWS text navigation techniques to read this section.
      • Verify that JAWS makes it clear that a JavaScript has been encountered when it reaches the script text.
    2. Press the Tab or Shift + Tab key to move focus to the script text.
      • Verify that JAWS includes the script in its tab ring. (The JavaScript text is surrounded by an anchor tag with the "tabindex" attribute, which instructs the Web browser to add it to the tab ring.)
  2. With keyboard focus on the script

Here is the script: > Focus here and press Enter to activate this JavaScript to cause onKeyPress alert. <


Javascript: Jump to selected destination

In this example, the pulldown list contains links to various sections of this file. The Go button activates the Javascript to jump to the selected destination.

  1. Navigate to the script, below, using both of these methods. (Go through these steps twice, once for each method of navigation!):
    1. Use normal JAWS text navigation techniques to read this section.
      • When the pulldown list is read, verify that JAWS makes it clear that it is a pulldown list.
      • When the Go button is read, verify that JAWS says the words "Go" and "Button" to make it clear that it is a button, and that the button text says "Go".
    2. Press the Arrow keys or Tab or Shift + Tab key to move focus to the pulldown list.
      • Verify that JAWS includes the pulldown list in its tab ring.
      • Verify that JAWS includes the Go button in its tab ring.
  2. With keyboard focus on the pulldown list:
  3. Press Tab to move focus to the Go button.

Quickmenu Form


Javascript: Popup current time

The following button will cause a popup window to display the time. It interacts with a continuously running JavaScript that starts when this page is first loaded.

  1. Make sure you are in Browse mode (press Ctrl + Shift + A to set).
  2. Use the normal JAWS navigation keys to move to the button below (use Arrow keys)
  3. Press Enter to activate the button.
  4. Press Enter again to select the "OK" button to close the pop-up.


End of JavaScript test section

Testing HTML Form fields and controls

Verbosity settings for Forms (press Ins + V to view).

JAWS provides keystrokes to navigate between form elements. Use the following instructions to verify the JAWS form navigation features are compatible with Firefox.

JAWS Web page form navigation keystrokes

Use the following form navigation keystrokes to navigate the forms on this page. There are three forms in this file: one in the JavaScript section, one in this section (directly after this list, below), and the third form is in the section titled "Testing Additional JAWS features". When testing the JAWS keys that navigate within a single form, use the form in the section below titled "Sample form for HTML form testing".

Remember the following tips about JAWS Virtual PC Cursor mode:

Perform all of the keystrokes listed below to navigate between controls within a form.

Sample Form for use in HTLM Form testing

The following form contains a variety of HTML form options. Instructions are included for navigating the form fields and controls.

  1. Use the basic JAWS navigation keys (Arrow keys) to listen to the table.

Beginning of Form. Use this form for Forms testing!

This form contains a number of typical HTML form input elements. Verify that the JAWS forms keystrokes listed above work properly.

User Information
Favorite dessert

Favorite flavor

You should not be able to see it or tab to it. The hidden field contains a sentence that starts with the words "Important information...". Verify that JAWS does NOT read that sentence. (You can view the source for this file to view the entire hidden field value.)

(Note that this form is not operational. If you select the "Send" button, below, the form will attempt to contact a non-existent Web server, and you will get a "server not found" error.

End of Form

End of Form test section.

Testing HTML Frames

The following keys are provided by JAWS for frame navigation.

Rather than implementing frames inside of this file, this test will be done on a file containing example frames on the w3schools Web site. You are encouraged to find other examples of Web pages using Frames on the internet to test with JAWS also.

  1. Link to the Frames example at w3schools web site.
  2. Use the above keystrokes to navigate the frames on that sample page.

End of Frames test section.

Testing Table Navigation

Verbosity settings for Tables (press Ins + V to view):

Element: Tables

Here is a list of JAWS keystrokes provided for table navigation. Verify the function of these keystrokes using the sample tables below.

General Instructions for testing tables

Use the keystrokes listed above to navigate the following tables.

  1. Verify that all keystrokes work as described.
  2. Verify that the table headers are announced as you change rows or columns.
  3. Verify that the table summary is announced when the table is encountered by JAWS.
Table 1: Simple table using column and row headers

In this table, each cell in the first row is a column header, and the first cell of each row is a row header. The table uses the "scope=" attribute to instruct the screen reader that the row and column headers are available. The table summary attribute is as follows: "This table contains 3 columns, first a country name, then the name of the capital city, then the name of the largest city."

Capital city and Largest city of select countries
Country Capital Largest City
Australia Canberra Sydney
Brazil Brasilia São Paulo
India New Delhi Mumbai
Morocco Rabat Casablanca
United States of America Washington, D.C. New York City
Table 2: Complex table with multiple column headers

In this table, each data column is associated with one row header and two column headers. The table uses the "headings=" attribute to instruct the screen reader that multiple column headers are available for each data cell. The table summary attribute is as follows: "This complex table contains 4 columns, first a name, then home phone number, cell phone number, and fax number."

Home, Cell, and Fax phone numbers
Name Phone number
Home Cell Fax
Jack 123-456-7890 123-134-1567 123-234-2456
Jill 321-654-0987 321-431-7651 321-432-6542

End of Table test section.

Testing DHTML controls

The Mozilla.org Web site contains a number of examples of accessible DHTML elements. Rather than reproduce them here, follow the links provided below to load those example pages.

Detailed instructions for testing these controls with JAWS have not yet been written. For now, just verify the following things while viewing the DHTML pages with JAWS running:

  1. Verify that you can use the JAWS text and link navigation techniques to read and access all of the fields and controls on the DHTML example pages.
  2. Verify you can activate all of the controls that allow user interaction with JAWS running..
Links to DHTML example pages

End of DHTML test section.

Testing Additional JAWS Features

There are many other keyboard functions provided by JAWS. Here is a list of keys that should be tested. View the JAWS documentation to see more information about "Using the Internet with JAWS".

You may use the following text input area to test the paste function, after copying text into the system clipboard. Remember that you must enter Forms mode before you can enter text into the field! (Press Enter to enter Forms mode.)

Clipboard test form:

End of Additional JAWS feature test section.

Testing Firefox Caret Browsing mode

Firefox provides a feature called Caret Browsing, where a user can navigate a Web page in a way similar to navigating a document in a word processor. Visually, you see an insertion caret (cursor) on the page, and you can use the Arrow keys to move up, down, left, and right, one line or character at a time.

Caret Browsing mode is not really needed when using a screen reader such as JAWS, since the screen reader provides similar functions. However, because a user can potentially enter caret browsing mode even when a screen reader is in use, some testing of that scenario should be done. Failures in this area will not result in VPAT issues.

Follow these instructions to verify the basic functions of Caret Browsing.

  1. Press F7 to start Caret Browsing mode. Select the "Yes" button in the resulting popup (if it displays) to complete the switch to Caret Browsing mode.
  2. Use JAWS text navigation techniques to read the page while in caret browsing mode. For example:
  3. Verify Links, images, and image maps can be properly navigated with JAWS while in caret browsing mode. For example:
  4. Verify you can run JavaScripts with JAWS running while in caret browsing mode.
  5. Verify HTML Form fields and controls can be properly navigated with JAWS while in caret browsing mode.
  6. Verify HTML Frames can be properly navigated with JAWS while in caret browsing mode.
  7. Verify Tables can be properly navigated with JAWS while in caret browsing mode.
  8. Verify Additional JAWS functions work properly while in caret browsing mode. For example:

End of Caret Browsing test section.

End of Test Case