This Wiki page is edited by participants of the HTML Accessibility Task Force. It does not necessarily represent consensus and it may have incorrect information or information that is not supported by other Task Force participants, WAI, or W3C. It may also have some very useful information.

Creating HTML5 Tests

From HTML accessibility task force Wiki
Jump to: navigation, search

Notes from How to write a reftest

For each test, you need to create two files:

  • Test File - The feature you are testing
  • Reference File - An exact visual match of the Test file, without the feature you're testing

The test should work both manually and with automation (self-describing) and be cross-browser/platform

Test File

  • The feature you are testing

NOTE: For the most part, anything in ALL CAPS needs to be replaced. Also, pay attention to comments.

<!DOCTYPE html>
<html>
  <head>
    <title>NAME OF TEST: Brief Description</title> <!-- Name and brief description of test -->
    <link rel="author" title="YOUR NAME" href="mailto:youremail@address.com"> <!-- Your name and email address -->
    <link rel="help" href="http://www.w3.org/TR/PATHTOSPEC"> <!-- URI's of spec text you are testing (can be mulitple) -->
    <link rel="match" href="reference/PATH.html"> <!-- Path to the reference file -->
    <meta name="assert" content="ASSERTION"> <!-- Assertion being tested -->
  </head>
  <body>
    <p>Simple statement of how the page renders when the test passes</p>
    <p>TEST</p>
  </body>
</html>

Reference File

  • Exact visual match of the Test file, without the feature you're testing

NOTE: For the most part, anything in ALL CAPS needs to be replaced. Also, pay attention to comments.

<!DOCTYPE html>
<html>
  <head>
    <title>NAME OF TEST: Brief Description</title> <!-- Name and brief description of test -->
    <link rel="author" title="YOUR NAME" href="mailto:youremail@address.com"> <!-- Your name and email address -->
  </head>
  <body>
    <p>Simple statement of how the page renders when the test passes</p>
    <p>TEST</p>
  </body>
</html>