testilo 10.3.0 → 11.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/README.md +188 -190
  2. package/batch.js +60 -0
  3. package/call.js +9 -4
  4. package/compare.js +2 -2
  5. package/merge.js +0 -6
  6. package/package.json +1 -1
  7. package/procs/compare/cp20sqrt/index.js +7 -10
  8. package/procs/compare/{cp15b → tcp24}/index.html +5 -5
  9. package/procs/compare/{cp12a → tcp24}/index.js +13 -20
  10. package/procs/score/{tic24.js → tic25.js} +40 -27
  11. package/procs/score/{tic23.js → tic26.js} +264 -229
  12. package/procs/score/tsp24.js +8 -2
  13. package/procs/score/tsp26.js +120 -0
  14. package/score.js +2 -8
  15. package/procs/compare/cp0/index.html +0 -46
  16. package/procs/compare/cp0/index.js +0 -70
  17. package/procs/compare/cp1/index.html +0 -46
  18. package/procs/compare/cp1/index.js +0 -71
  19. package/procs/compare/cp12a/index.html +0 -47
  20. package/procs/compare/cp12b/index.html +0 -47
  21. package/procs/compare/cp12b/index.js +0 -71
  22. package/procs/compare/cp14a/index.html +0 -47
  23. package/procs/compare/cp14a/index.js +0 -71
  24. package/procs/compare/cp15a/index.html +0 -47
  25. package/procs/compare/cp15a/index.js +0 -71
  26. package/procs/compare/cp15b/index.js +0 -74
  27. package/procs/compare/cp16a/index.html +0 -47
  28. package/procs/compare/cp16a/index.js +0 -74
  29. package/procs/compare/cp16b/index.html +0 -47
  30. package/procs/compare/cp16b/index.js +0 -74
  31. package/procs/digest/dp10a/index.html +0 -137
  32. package/procs/digest/dp10a/index.js +0 -402
  33. package/procs/digest/dp10b/index.html +0 -74
  34. package/procs/digest/dp10b/index.js +0 -130
  35. package/procs/digest/dp10c/index.html +0 -55
  36. package/procs/digest/dp10c/index.js +0 -129
  37. package/procs/digest/dp11a/index.html +0 -76
  38. package/procs/digest/dp11a/index.js +0 -127
  39. package/procs/digest/dp12a/index.html +0 -78
  40. package/procs/digest/dp12a/index.js +0 -126
  41. package/procs/digest/dp12b/index.html +0 -78
  42. package/procs/digest/dp12b/index.js +0 -126
  43. package/procs/digest/dp13a/index.html +0 -78
  44. package/procs/digest/dp13a/index.js +0 -126
  45. package/procs/digest/dp14a/index.html +0 -79
  46. package/procs/digest/dp14a/index.js +0 -126
  47. package/procs/digest/dp15a/index.html +0 -80
  48. package/procs/digest/dp15a/index.js +0 -126
  49. package/procs/digest/dp16a/index.html +0 -80
  50. package/procs/digest/dp16a/index.js +0 -126
  51. package/procs/digest/dp16b/index.html +0 -80
  52. package/procs/digest/dp16b/index.js +0 -126
  53. package/procs/digest/dp18a/index.html +0 -80
  54. package/procs/digest/dp18a/index.js +0 -129
  55. package/procs/digest/dp20c/index.html +0 -54
  56. package/procs/digest/dp20c/index.js +0 -117
  57. package/procs/digest/dp20d/index.html +0 -54
  58. package/procs/digest/dp20d/index.js +0 -121
  59. package/procs/digest/tdp09a/index.html +0 -126
  60. package/procs/digest/tdp09a/index.js +0 -381
  61. package/procs/digest/tdp22/index.html +0 -54
  62. package/procs/digest/tdp22/index.js +0 -120
  63. package/procs/score/tic21.js +0 -6868
  64. package/procs/score/tic22.js +0 -6911
  65. package/procs/score/tsp21.js +0 -720
  66. package/procs/score/tsp22.js +0 -720
  67. package/procs/score/tsp23.js +0 -720
  68. package/specs/batches/orgs.json +0 -43
  69. package/specs/scripts/ts21.json +0 -213
  70. package/specs/scripts/ts23.json +0 -219
  71. package/specs/scripts/ts24.json +0 -225
@@ -1,137 +0,0 @@
1
- <!DOCTYPE HTML>
2
- <html lang="en-US">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1">
6
- <meta name="author" content="__testerName__">
7
- <meta name="creator" content="__testerName__">
8
- <meta name="publisher" name="__testerName__">
9
- <meta name="description" content="report on results of __scoreProc__ procedure">
10
- <meta name="keywords" content="accessibility a11y web testing">
11
- <title>Accessibility test digest</title>
12
- <link rel="icon" href="favicon.png">
13
- <link rel="stylesheet" href="style.css">
14
- </head>
15
- <body>
16
- <main>
17
- <header>
18
- <h1>Accessibility test digest</h1>
19
- <h2>Synopsis</h2>
20
- <div id="synopsis">
21
- <p>Page: __org__</p>
22
- <p>URL: __url__</p>
23
- <p>Score: __totalScore__</p>
24
- <p>Tested by: Testaro, <code>tp10</code></p>
25
- <p>Scored by: Testilo, <code>sp10a</code></p>
26
- <p>Digested by: Testilo, <code>dp10a</code></p>
27
- </div>
28
- </header>
29
- <h2>Introduction</h2>
30
- <p>The <code>tp10</code> <a href="https://www.w3.org/WAI/fundamentals/accessibility-intro/">accessibility</a> testing procedure was executed by <a href="https://www.npmjs.com/package/testaro">Testaro</a> on the web page at <a href="__url__">__url__</a>, belonging to __org__, on __dateSlash__. The procedure performed 808 tests. Of these, 16 tests are custom tests defined by Testaro, and the others belong to packages of tests created by others. Testaro produced a report enumerating the test results. The report is appended, below, to this page.</p>
31
- <p>These tests&mdash;like all tests&mdash;are fallible. The failures described below merit investigation as <strong>potential</strong> opportunities for improved accessibility. But some reported faults may not actually harm accessibility, and some accessibility faults can escape detection by any of these tests.</p>
32
- <p>Given the report produced by Testaro, another procedure, <code>sp10a</code>, was executed by <a href="https://www.npmjs.com/package/testilo">Testilo</a>. The procedure assigned weights to the tests and computed a total score for the page, __totalScore__ (where 0 is the best possible score). Just as tests are fallible, any scoring procedure is subjective, and different reasonable procedures could assign different scores on the basis of the same report. Testilo used procedure <code>dp10a</code> to produce this digest, explaining how <code>sp10a</code> computed the score.</p>
33
- <h2>Summary</h2>
34
- <p>The packages&rsquo; and custom tests&rsquo; contributions to the score were:</p>
35
- <table class="allBorder secondCellRight">
36
- <caption>Score components</caption>
37
- <tbody class="headersLeft">
38
- __scoreRows__
39
- </tbody></table>
40
- <h2>Test packages</h2>
41
- <p>Most of the tests belong to the following five accessibility test packages created by various groups of specialists.</p>
42
- <h3><code>aatt</code></h3>
43
- __aattResult__
44
- <p><a href="https://github.com/paypal/AATT">AATT</a> is an open-source package sponsored by PayPal. The <code>aatt</code> test performs all 98 WCAG 2.1 AA tests in the HTML CodeSniffer ruleset.</p>
45
- <h3><code>alfa</code></h3>
46
- __alfaResult__
47
- <p><a href="https://github.com/Siteimprove/alfa">Alfa</a> is an open-source package sponsored by Siteimprove. The <code>alfa</code> test performs all 103 tests in the Alfa package.</p>
48
- <h3><code>axe</code></h3>
49
- __axeResult__
50
- <p><a href="https://github.com/dequelabs/axe-core">Axe</a> is an open-source package sponsored by accessibility consulting firm Deque. The <code>axe</code> test performs all 138 default tests in the Axe package.</p>
51
- <h3><code>ibm</code></h3>
52
- __ibmResult__
53
- <p><a href="https://github.com/IBMa/equal-access">Equal Access</a> is an open-source package sponsored by IBM Corporation. The <code>ibm</code> test performs all 163 default tests in the Equal Access package.</p>
54
- <h3><code>tenon</code></h3>
55
- __tenonResult__
56
- <p>The <a href="https://tenon.io/documentation/apiv2.php">Tenon Test API (version 2)</a> is a proprietary package owned by Level Access. The <code>tenon</code> test performs all 180 default tests in the Tenon package.</p>
57
- <h3><code>wave</code></h3>
58
- __waveResult__
59
- <p><a href="https://wave.webaim.org/">WAVE</a> is a proprietary package owned by webAIM, a program of the Institute for Disability Research, Policy, and Practice at Utah State University. The <code>wave</code> test performs all 110 default tests in the WAVE package.</p>
60
- <h2>Custom tests</h2>
61
- <p>The tests in the above packages are designed to detect some, not all, accessibility problems. The procedure includes the following 16 custom tests that supplement the tests of the packages.</p>
62
- <h3><code>bulk</code></h3>
63
- __bulkResult__
64
- <p>The <code>bulk</code> test counts the initially visible elements in a page. A page with a large count tends to be complex and busy, frustrating some users, especially if they have visual or motor disabilities, as they try to determine what the page is about, whether it is relevant, and how to find a specific thing in it.</p>
65
- <p>When the count exceeds 250, the procedure begins to assign a non-zero score.</p>
66
- <h3><code>embAc</code></h3>
67
- __embAcResult__
68
- <p>The <code>embAc</code> test detects improper embedding of interactive elements (links, buttons, inputs, and select lists) within links or buttons. Such embedding violates the HTML standard, complicates user interaction, and creates risks of error. It becomes non-obvious what a user will activate with a click.</p>
69
- <h3><code>focAll</code></h3>
70
- __focAllResult__
71
- <p>The <code>focAll</code> test detects discrepancies between focusable and Tab-focused element counts. Navigating with the Tab key normally moves the focus and does nothing else. If it also adds or fails to focus focusable elements, this complicates navigation and may make the page unusable for people who must use only a keyboard (not a mouse) or a keyboard-emulating assistive device to navigate.</p>
72
- <h3><code>focInd</code></h3>
73
- __focIndResult__
74
- <p>The <code>focInd</code> test detects focusable elements without standard focus indicators. An outline is the standard and most recognizable focus indicator; as you repeatedly press the Tab key, the outline moves through the page. Other focus indicators are more likely to be misunderstood. For example, underlines may be mistaken for selection indicators or links. An absent focus indicator prevents the user from knowing what a keyboard action will act on.</p>
75
- <h3><code>focOp</code></h3>
76
- __focOpResult__
77
- <p>The <code>focOp</code> test detects descrepancies between Tab-focusability and operability. The standard practice is to make focusable elements operable and vice versa. If focusable elements are not operable, users are likely to be surprised that nothing happens when they try to operate such elements. If operable elements are not focusable, users depending on keyboard navigation are prevented from operating those elements. The test considers an element operable if it has a non-inherited pointer cursor and is not a <code>LABEL</code> element, or has an operable tag name (<code>A</code>, <code>BUTTON</code>, <code>IFRAME</code>, <code>INPUT</code>, <code>SELECT</code>, or <code>TEXTAREA</code>), or has an <code>onclick</code> attribute. The test considers an element Tab-focusable if its <code>tabIndex</code> property has the value 0.</p>
78
- <h3><code>hover</code></h3>
79
- __hoverResult__
80
- <p>The <code>hover</code> test detects unexpected effects of hovering. The normal purpose of hovering is to show the user which element is currently being actually or effectively hovered over and would therefore be the target of a mouse click. When hovering does more than that, the additional effects can confuse or startle users, especially those without precise mouse control. The test detects whether hovering makes elements visible, changes the opacities of elements, affects the opacities of elements by changing the opacities of their ancestors, and fails to reach elements. Only visible elements that have <code>A</code>, <code>BUTTON</code>, and <code>LI</code> tag names or have <code>onmouseenter</code> or <code>onmouseover</code> attributes are considered as triggers of such effects when hovered over. The effects of hovering are inspected for the descendants of the grandparent of the trigger if the trigger has the tag name <code>A</code> or <code>BUTTON</code>, or otherwise the descendants of the trigger. The only elements counted as being made visible by hovering are those with tag names <code>A</code>, <code>BUTTON</code>, <code>INPUT</code>, and <code>SPAN</code>, and those with <code>role="menuitem"</code> attributes.</p>
81
- <h3><code>labClash</code></h3>
82
- __labClashResult__
83
- <p>The <code>labClash</code> test detects defects in the labeling of buttons, non-hidden inputs, select lists, and text areas. The defects include missing labels and redundant labels. Redundant labels are labels that are superseded by other labels. Explicit and implicit (wrapped) labels are additive, not conflicting.</p>
84
- <h3><code>linkUl</code></h3>
85
- __linkUlResult__
86
- <p>The <code>linkUl</code> test detects failures to underline inline links. Underlining and color are the traditional style properties that identify links. Collections of links in blocks can sometimes be recognized without underlines, but inline links are difficult or impossible to distinguish visually from surrounding text if not underlined. Underlining inline links only on hover provides an indicator valuable only to mouse users, and even they must traverse the text with a mouse merely to discover which passages are links.</p>
87
- <p>Warning: This test classifies links as inline or block. Some links classified as inline may not look like inline links to users.</p>
88
- <h3><code>log</code></h3>
89
- __logResult__
90
- <p>The <code>log</code> test detects problems with the behavior of the page or the server. Indicators of such problems are the number of messages logged by the browser, the aggregate size of those messages in characters, the number of rejections with abnormal HTTP statuses, the number of <q>prohibited</q> HTTP statuses, and the number of times the browser timed out trying to reach the page. Although log messages do not always indicate page defects, they mostly do.</p>
91
- <h3><code>menuNav</code></h3>
92
- __menuNavResult__
93
- <p>The <code>menuNav</code> test detects nonstandard keyboard navigation among menu items in menus that manage the focus of their menu items. Menus that use pseudofocus with the <code>aria-activedescendant</code> attribute are not tested. The test is based on <a href="https://www.w3.org/TR/wai-aria-practices-1.1/#menu">WAI-ARIA recommendations</a>.</p>
94
- <h3><code>motion</code></h3>
95
- __motionResult__
96
- <p>The <code>motion</code> test detects unrequested motion in a page. Accessibility standards minimally require motion to be brief, or else stoppable by the user. But stopping motion can be difficult or impossible, and, by the time a user manages to stop motion, the motion may have caused annoyance or harm. For superior accessibility, a page contains no motion until and unless the user authorizes it. The test compares five screen shots of the initially visible part of the page and assigns a score based on:</p>
97
- <ol>
98
- <li>bytes: an array of the sizes of the screen shots, in bytes</li>
99
- <li>localRatios: an array of the ratios of bytes of the larger to the smaller of adjacent pairs of screen shots</li>
100
- <li>meanLocalRatio: the mean of the ratios in the localRatios array</li>
101
- <li>maxLocalRatio: the greatest of the ratios in the localRatios array</li>
102
- <li>globalRatio: the ratio of bytes of the largest to the smallest screen shot</li>
103
- <li>pixelChanges: an array of counts of differing pixels between adjacent pairs of screen shots</li>
104
- <li>meanPixelChange: the mean of the counts in the pixelChanges array</li>
105
- <li>maxPixelChange: the greatest of the counts in the pixelChanges array</li>
106
- <li>changeFrequency: what fraction of the adjacent pairs of screen shots has pixel differences</li>
107
- </ol>
108
- <p>Warning: This test waits 2.4 seconds before making its first screen shot. If a page loads more slowly than that, the test may treat it as exhibiting motion.</p>
109
- <h3><code>radioSet</code></h3>
110
- __radioSetResult__
111
- <p>The <code>radioSet</code> test detects nonstandard groupings of radio buttons. It defines the standard to require that two or more radio buttons with the same name, and no other radio buttons, be grouped in a <code>fieldset</code> element with a valid <code>legend</code> element.</p>
112
- <h3><code>role</code></h3>
113
- __roleResult__
114
- <p>The <code>role</code> test detects nonstandard and confusing role assignments. It is inspired by the <a href="https://www.w3.org/TR/wai-aria/#roles_categorization">WAI-ARIA recommendations on roles</a> and their <a href="https://www.w3.org/TR/html-aria/">authoring rules</a>. Abstract roles and roles that are implicit in HTML elements fail the test. The <code>math</code> role has been removed, because of poor adoption and exclusion from HTML5. The <code>img</code> role <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/img_role">has accessibility uses</a>, so does not fail the test, although implicit in the HTML <code>img</code> element.</p>
115
- <h3><code>styleDiff</code></h3>
116
- __styleDiffResult__
117
- <p>The <code>styleDiff</code> test detects style inconsistencies among inline links, block links, buttons, and all 6 levels of headings. The principle of consistent identification requires using styles to help users classify content. For example, level-2 headings look the same, and they look different from level-1 headings. Ideally, then, for each of these element types, there would be exactly 1 style. The test considers the style properties <code>borderStyle</code>, <code>borderWidth</code>, <code>fontStyle</code>, <code>fontWeight</code>, <code>lineHeight</code>, <code>maxHeight</code>, <code>maxWidth</code>, <code>minHeight</code>, <code>minWidth</code>, <code>opacity</code>, <code>outlineOffset</code>, <code>outlineStyle</code>, <code>outlineWidth</code>, <code>textDecorationLine</code>, <code>textDecorationStyle</code>, and <code>textDecorationThickness</code>. For headings, it also considers the <code>fontSize</code> style property.</p>
118
- <h3><code>tabNav</code></h3>
119
- __tabNavResult__
120
- <p>The <code>tabNav</code> test detects <a href="https://www.w3.org/TR/wai-aria-practices-1.1/#tabpanel">nonstandard keyboard navigation</a> among tab elements in tab lists. Tab lists let users choose which of several content blocks to display. The Tab key moves the focus into and out of a tab list, but the arrow, Home, and End keys move the focus from tab to tab.</p>
121
- <h3><code>zIndex</code></h3>
122
- __zIndexResult__
123
- <p>The <code>zIndex</code> test detects elements with non-default z indexes. Pages present difficulty for some users when they require users to perceive a third dimension (depth) in the two-dimensional display. Layers, popups, and dialogs that cover other content make it difficult for some users to interpret the content and know what parts of the content can be acted on. Layering also complicates accessibility testing. Tests for visibility of focus, for example, may fail if a focused element is covered by another element.</p>
124
- <h2>Test prevention</h2>
125
- <p>Some pages prevent some of the tests in this procedure from being performed. This may occur, for example, when a page tries to block any non-human visitor. The procedure estimates high scores when pages prevent tests, because preventing accessibility testing is itself an accessibility deficiency. Specifically:</p>
126
- <ul>
127
- <li>Measuring success is a prerequisite for achieving success, so interfering with accessibility measurement interferes with accessibility.</li>
128
- <li>Users with disabilities often rely on assistive technologies to mediate between them and web applications. Applications that interfere with automated testing are at risk of interfering with some assistive technologies, too.</li>
129
- </ul>
130
- <h2>Report</h2>
131
- <pre>__report__</pre>
132
- <footer>
133
- <p class="date">Produced <time itemprop="datePublished" datetime="__dateISO__">__dateSlash__</time></p>
134
- </footer>
135
- </main>
136
- </body>
137
- </html>
@@ -1,402 +0,0 @@
1
- /*
2
- index: digester for scoring procedure sp10.
3
- Creator of parameters for substitution into index.html.
4
- Usage example: node digest 35k1r-railpass dp10a
5
- */
6
- exports.makeQuery = (report, query) => {
7
- // Makes strings HTML-safe.
8
- const htmlEscape = textOrNumber => textOrNumber
9
- .toString()
10
- .replace(/&/g, '&amp;')
11
- .replace(/</g, '&lt;');
12
- // Newlines with indentations.
13
- const joiner = '\n ';
14
- const innerJoiner = '\n ';
15
- // Create an HTML identification of the host report.
16
- const {script, host, score} = report;
17
- const reportJSON = JSON.stringify(report, null, 2);
18
- const reportJSONSafe = reportJSON
19
- .replace(/</g, '&lt;')
20
- .replace(/&/g, '&amp;');
21
- query.report = reportJSONSafe;
22
- // Creates a packaged-test success message.
23
- const packageSucceedText = package =>
24
- `<p>The page <strong>passed</strong> the <code>${package}</code> test.</p>`;
25
- // Creates a packaged-test failure message.
26
- const packageFailText = (score, package, failures) =>
27
- `<p>The page <strong>did not pass</strong> the <code>${package}</code> test and received a score of ${score} on <code>${package}</code>. The details are in the appended report, in the section starting with <code>"which": "${package}"</code>. There was at least one failure of:</p>${joiner}<ul>${innerJoiner}${failures}${joiner}</ul>`;
28
- // Creates a custom-test success message.
29
- const customSucceedText =
30
- test => `<p>The page <strong>passed</strong> the <code>${test}</code> test.</p>`;
31
- // Creates a custom-test failure message.
32
- const customFailText = (score, test) =>
33
- `<p>The page <strong>did not pass</strong> the <code>${test}</code> test and received a score of ${score} on <code>${test}</code>. The details are in the appended report, in the section starting with <code>"which": "${test}"</code>.</p>`;
34
- // Creates a test unperformability message.
35
- const testCrashText = (score, test) => `<p>The <code>${test}</code> test could not be performed. The page received an inferred score of ${score} on <code>${test}</code>.</p>`;
36
- // Creates the HTML items in a list of a custom test’s failures.
37
- const customFailures = failObj => Object
38
- .entries(failObj)
39
- .map(entry => `<li>${entry[0]}: ${entry[1]}</li>`)
40
- .join(innerJoiner);
41
- // Creates an HTML summary of the details of a custom test’s failures.
42
- const customFailMore = failures =>
43
- `<p>Summary of the details:</p>${joiner}<ul>${innerJoiner}${failures}${joiner}</ul>`;
44
- // Creates a combined HTML summary of a custom test’s failure result.
45
- const customResult = (score, test, failures) =>
46
- `${customFailText(score, test)}${joiner}${customFailMore(failures)}`;
47
- // Returns the act of a test.
48
- const actOf = testName => {
49
- const matches = report.acts.filter(act => act.type === 'test' && act.which === testName);
50
- if (matches.length) {
51
- return matches[0];
52
- }
53
- else {
54
- return null;
55
- }
56
- };
57
- // Add the job data to the query.
58
- query.dateISO = report.endTime.slice(0, 10);
59
- query.dateSlash = query.dateISO.replace(/-/g, '/');
60
- if (host) {
61
- query.org = host.what;
62
- query.url = host.which;
63
- }
64
- else {
65
- const firstURLCommand = script.commands.find(command => command.type === 'url');
66
- query.org = firstURLCommand.what;
67
- query.url = firstURLCommand.which;
68
- }
69
- const {inferences, scores} = score;
70
- query.totalScore = scores.total;
71
- // Create rows of an HTML table of net scores.
72
- const netScores = Object.assign({}, scores, inferences);
73
- const scoreSources = Object.keys(netScores);
74
- query.scoreRows = scoreSources
75
- .sort((a, b) => netScores[b] - netScores[a])
76
- .map(source => `<tr><th>${source}</th><td>${netScores[source]}</td></tr>`)
77
- .join(innerJoiner);
78
- // Get package-test result messages.
79
- // aatt
80
- if (scores.aatt) {
81
- const testAct = actOf('aatt');
82
- const aattWarnings = new Set(testAct.result.filter(item => item.type === 'warning')
83
- .map(item => `warning: ${item.msg}`));
84
- const aattErrors = new Set(testAct.result.filter(item => item.type === 'error')
85
- .map(item => `error: ${item.msg}`));
86
- const aattBoth = Array.from(aattWarnings).concat(Array.from(aattErrors));
87
- const aattIssues = aattBoth.map(item => `<li>${htmlEscape(item)}</li>`).join(innerJoiner);
88
- query.aattResult = packageFailText(scores.aatt, 'aatt', aattIssues);
89
- }
90
- else if (inferences.aatt) {
91
- query.aattResult = testCrashText(inferences.aatt, 'aatt');
92
- }
93
- else {
94
- query.aattResult = packageSucceedText('aatt');
95
- }
96
- // alfa
97
- if (scores.alfa) {
98
- const testAct = actOf('alfa');
99
- const alfaWarnings = new Set(testAct.result.filter(item => item.verdict === 'cantTell')
100
- .map(item => `warning: ${item.rule.ruleSummary}`));
101
- const alfaErrors = new Set(testAct.result.filter(item => item.verdict === 'failed')
102
- .map(item => `error: ${item.rule.ruleSummary}`));
103
- const alfaBoth = Array.from(alfaWarnings).concat(Array.from(alfaErrors));
104
- const alfaIssues = alfaBoth.map(item => `<li>${htmlEscape(item)}</li>`).join(innerJoiner);
105
- query.alfaResult = packageFailText(scores.alfa, 'alfa', alfaIssues);
106
- }
107
- else if (inferences.alfa) {
108
- query.alfaResult = testCrashText(inferences.alfa, 'alfa');
109
- }
110
- else {
111
- query.alfaResult = packageSucceedText('alfa');
112
- }
113
- // axe
114
- if (scores.axe) {
115
- const testAct = actOf('axe');
116
- const axeFailures = testAct.result.items.map(
117
- item => `<li>${item.rule}: ${htmlEscape(item.description)}</li>`
118
- ).join(innerJoiner);
119
- query.axeResult = packageFailText(scores.axe, 'axe', axeFailures);
120
- }
121
- else if (inferences.axe) {
122
- query.axeResult = testCrashText(inferences.axe, 'axe');
123
- }
124
- else {
125
- query.axeResult = packageSucceedText('axe');
126
- }
127
- // ibm
128
- if (scores.ibm) {
129
- const testAct = actOf('ibm');
130
- const {result} = testAct;
131
- const contentItems = result.content.items;
132
- const urlItems = result.url.items;
133
- const items = [];
134
- if (contentItems) {
135
- items.push(...contentItems);
136
- }
137
- if (urlItems) {
138
- items.push(...urlItems);
139
- }
140
- const ibmFailures = Array.from(new Set(items.map(
141
- item => `<li>${item.ruleId}: ${htmlEscape(item.message)}</li>`
142
- )).values()).join(innerJoiner);
143
- query.ibmResult = packageFailText(scores.ibm, 'ibm', ibmFailures);
144
- }
145
- else if (inferences.ibm) {
146
- query.ibmResult = testCrashText(inferences.ibm, 'ibm');
147
- }
148
- else {
149
- query.ibmResult = packageSucceedText('ibm');
150
- }
151
- // tenon
152
- if (scores.tenon) {
153
- const testAct = actOf('tenon');
154
- const tenonResult = testAct.result.data.resultSet;
155
- const tenonSet = new Set(tenonResult.map(result => result.errorTitle));
156
- const tenonItems = Array.from(tenonSet).map(item => `<li>${item}</li>`);
157
- const tenonFailures = tenonItems.join(innerJoiner);
158
- query.tenonResult = packageFailText(scores.tenon, 'tenon', tenonFailures);
159
- }
160
- else if (inferences.tenon) {
161
- query.tenonResult = testCrashText(inferences.tenon, 'tenon');
162
- }
163
- else {
164
- query.tenonResult = packageSucceedText('tenon');
165
- }
166
- // wave
167
- if (scores.wave) {
168
- const testAct = actOf('wave');
169
- const waveResult = testAct.result.categories;
170
- const waveItems = [];
171
- ['error', 'contrast', 'alert'].forEach(category => {
172
- waveItems.push(
173
- ... Object
174
- .entries(waveResult[category].items)
175
- .map(entry => `<li>${category}/${entry[0]}: ${entry[1].description}</li>`)
176
- );
177
- });
178
- const waveFailures = waveItems.join(innerJoiner);
179
- query.waveResult = packageFailText(scores.wave, 'wave', waveFailures);
180
- }
181
- else if (inferences.wave) {
182
- query.waveResult = testCrashText(inferences.wave, 'wave');
183
- }
184
- else {
185
- query.waveResult = packageSucceedText('wave');
186
- }
187
- // Get custom-test result messages.
188
- if (scores.bulk) {
189
- const testAct = actOf('bulk');
190
- query.bulkResult = `The page <strong>did not pass</strong> the <code>bulk</code> test. The count of visible elements in the page was ${testAct.result.visibleElements}, resulting in a score of ${scores.bulk} on <code>bulk</code>.`;
191
- }
192
- else if (inferences.bulk) {
193
- query.bulkResult = testCrashText(inferences.bulk, 'bulk');
194
- }
195
- else {
196
- query.bulkResult = customSucceedText('bulk');
197
- }
198
- if (scores.embAc) {
199
- const testAct = actOf('embAc');
200
- const failures = customFailures(testAct.result.totals);
201
- query.embAcResult = customResult(scores.embAc, 'embAc', failures);
202
- }
203
- else if (inferences.embAc) {
204
- query.embAcResult = testCrashText(inferences.ebmAc, 'ebmAc');
205
- }
206
- else {
207
- query.embAcResult = customSucceedText('embAc');
208
- }
209
- if (scores.focAll) {
210
- const testAct = actOf('focAll');
211
- const failures = customFailures(testAct.result);
212
- query.focAllResult = customResult(scores.focAll, 'focAll', failures);
213
- }
214
- else if (inferences.focAll) {
215
- query.focAllResult = testCrashText(inferences.focAll, 'focAll');
216
- }
217
- else {
218
- query.focAllResult = customSucceedText('focAll');
219
- }
220
- if (scores.focInd) {
221
- const testAct = actOf('focInd');
222
- const failSource = testAct.result.totals.types;
223
- const failObj = {
224
- indicatorMissing: failSource.indicatorMissing.total,
225
- nonOutlinePresent: failSource.nonOutlinePresent.total
226
- };
227
- const failures = customFailures(failObj);
228
- query.focIndResult = customResult(scores.focInd, 'focInd', failures);
229
- }
230
- else if (inferences.focInd) {
231
- query.focIndResult = testCrashText(inferences.focInd, 'focInd');
232
- }
233
- else {
234
- query.focIndResult = customSucceedText('focInd');
235
- }
236
- if (scores.focOp) {
237
- const testAct = actOf('focOp');
238
- const failSource = testAct.result.totals.types;
239
- const failObj = {
240
- onlyFocusable: failSource.onlyFocusable.total,
241
- onlyOperable: failSource.onlyOperable.total
242
- };
243
- const failures = customFailures(failObj);
244
- query.focOpResult = customResult(scores.focOp, 'focOp', failures);
245
- }
246
- else if (inferences.focOp) {
247
- query.focOpResult = testCrashText(inferences.focOp, 'focOp');
248
- }
249
- else {
250
- query.focOpResult = customSucceedText('focOp');
251
- }
252
- if (scores.hover) {
253
- const testAct = actOf('hover');
254
- const failures = customFailures(testAct.result.totals);
255
- query.hoverResult = customResult(scores.hover, 'hover', failures);
256
- }
257
- else if (inferences.hover) {
258
- query.hoverResult = testCrashText(inferences.hover, 'hover');
259
- }
260
- else {
261
- query.hoverResult = customSucceedText('hover');
262
- }
263
- if (scores.labClash) {
264
- const testAct = actOf('labClash');
265
- const {totals} = testAct.result;
266
- delete totals.wellLabeled;
267
- const failures = customFailures(totals);
268
- query.labClashResult = customResult(scores.labClash, 'labClash', failures);
269
- }
270
- else if (inferences.labClash) {
271
- query.labClashResult = testCrashText(inferences.labClash, 'labClash');
272
- }
273
- else {
274
- query.labClashResult = customSucceedText('labClash');
275
- }
276
- if (scores.linkUl) {
277
- const testAct = actOf('linkUl');
278
- const failures = customFailures(testAct.result.totals.inline);
279
- query.linkUlResult = customResult(scores.linkUl, 'linkUl', failures);
280
- }
281
- else if (inferences.linkUl) {
282
- query.linkUlResult = testCrashText(inferences.linkUl, 'linkUl');
283
- }
284
- else {
285
- query.linkUlResult = customSucceedText('linkUl');
286
- }
287
- if (scores.log) {
288
- const {logCount, logSize, visitRejectionCount, prohibitedCount, visitTimeoutCount} = report;
289
- const logData = {logCount, logSize, visitRejectionCount, prohibitedCount, visitTimeoutCount};
290
- const failures = customFailures(logData);
291
- query.logResult = customResult(scores.log, 'log', failures);
292
- }
293
- else if (inferences.log) {
294
- query.logResult = testCrashText(inferences.log, 'log');
295
- }
296
- else {
297
- query.logResult = customSucceedText('log');
298
- }
299
- if (scores.menuNav) {
300
- const testAct = actOf('menuNav');
301
- const failSource = testAct.result.totals;
302
- const failObj = {
303
- navigations: failSource.navigations.all.incorrect,
304
- menuItems: failSource.menuItems.incorrect,
305
- menus: failSource.menus.incorrect
306
- };
307
- const failures = customFailures(failObj);
308
- query.menuNavResult = customResult(scores.menuNav, 'menuNav', failures);
309
- }
310
- else if (inferences.menuNav) {
311
- query.menuNavResult = testCrashText(inferences.menuNav, 'menuNav');
312
- }
313
- else {
314
- query.menuNavResult = customSucceedText('menuNav');
315
- }
316
- if (scores.motion) {
317
- const testAct = actOf('motion');
318
- const {result} = testAct;
319
- result.bytes = result.bytes.join(', ');
320
- result.localRatios = result.localRatios.join(', ');
321
- result.pixelChanges = result.pixelChanges.join(', ');
322
- const failures = customFailures(result);
323
- query.motionResult = customResult(scores.motion, 'motion', failures);
324
- }
325
- else if (inferences.motion) {
326
- query.motionResult = testCrashText(inferences.motion, 'motion');
327
- }
328
- else {
329
- query.motionResult = customSucceedText('motion');
330
- }
331
- if (scores.radioSet) {
332
- const testAct = actOf('radioSet');
333
- const failures = customFailures(testAct.result.totals);
334
- query.radioSetResult = customResult(scores.radioSet, 'radioSet', failures);
335
- }
336
- else if (inferences.radioSet) {
337
- query.radioSetResult = testCrashText(inferences.radioSet, 'radioSet');
338
- }
339
- else {
340
- query.radioSetResult = customSucceedText('radioSet');
341
- }
342
- if (scores.role) {
343
- const testAct = actOf('role');
344
- const {result} = testAct;
345
- delete result.tagNames;
346
- const failures = customFailures(result);
347
- query.roleResult = customResult(scores.role, 'role', failures);
348
- }
349
- else if (inferences.role) {
350
- query.roleResult = testCrashText(inferences.role, 'role');
351
- }
352
- else {
353
- query.roleResult = customSucceedText('role');
354
- }
355
- if (scores.styleDiff) {
356
- const testAct = actOf('styleDiff');
357
- const {totals} = testAct.result;
358
- const styleCounts = {};
359
- Object.keys(totals).forEach(key => {
360
- const data = totals[key];
361
- const count = data.subtotals ? data.subtotals.length : 1;
362
- styleCounts[key] = `${count} ${count === 1 ? 'style' : 'different styles'}`;
363
- });
364
- const failures = customFailures(styleCounts);
365
- query.styleDiffResult = customResult(scores.styleDiff, 'styleDiff', failures);
366
- }
367
- else if (inferences.styleDiff) {
368
- query.styleDiffResult = testCrashText(inferences.styleDiff, 'styleDiff');
369
- }
370
- else {
371
- query.roleResult = customSucceedText('role');
372
- }
373
- if (scores.tabNav) {
374
- const testAct = actOf('tabNav');
375
- const failSource = testAct.result.totals;
376
- const failObj = {
377
- navigations: failSource.navigations.all.incorrect,
378
- tabElements: failSource.tabElements.incorrect,
379
- tabLists: failSource.tabLists.incorrect
380
- };
381
- const failures = customFailures(failObj);
382
- query.tabNavResult = customResult(scores.tabNav, 'tabNav', failures);
383
- }
384
- else if (inferences.tabNav) {
385
- query.tabNavResult = testCrashText(inferences.tabNav, 'tabNav');
386
- }
387
- else {
388
- query.tabNavResult = customSucceedText('tabNav');
389
- }
390
- if (scores.zIndex) {
391
- const testAct = actOf('zIndex');
392
- const {tagNames} = testAct.result.totals;
393
- const failures = customFailures(tagNames);
394
- query.zIndexResult = customResult(scores.zIndex, 'zIndex', failures);
395
- }
396
- else if (inferences.zIndex) {
397
- query.zIndexResult = testCrashText(inferences.zIndex, 'zIndex');
398
- }
399
- else {
400
- query.zIndexResult = customSucceedText('zIndex');
401
- }
402
- };
@@ -1,74 +0,0 @@
1
- <!DOCTYPE HTML>
2
- <html lang="en-US">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1">
6
- <meta name="author" content="Testilo">
7
- <meta name="creator" content="Testilo">
8
- <meta name="publisher" name="Testilo">
9
- <meta name="description" content="report of accessibility testing of a web page">
10
- <meta name="keywords" content="accessibility a11y web testing">
11
- <title>Accessibility test digest</title>
12
- <link rel="icon" href="favicon.png">
13
- <link rel="stylesheet" href="style.css">
14
- </head>
15
- <body>
16
- <main>
17
- <header>
18
- <h1>Accessibility test digest</h1>
19
- <h2>Synopsis</h2>
20
- <div id="synopsis">
21
- <p>Page: __org__</p>
22
- <p>URL: __url__</p>
23
- <p>Score: __totalScore__</p>
24
- <p>Tested by: Testaro, procedure <code>tp10</code></p>
25
- <p>Scored by: Testilo, procedure <code>sp10b</code></p>
26
- <p>Digested by: Testilo, procedure <code>dp10b</code></p>
27
- </div>
28
- </header>
29
- <h2>Introduction</h2>
30
- <p>The <a href="https://www.npmjs.com/package/testaro">Testaro</a> application used its <code>tp10</code> testing procedure to test the <a href="https://www.w3.org/WAI/fundamentals/accessibility-intro/"><dfn>accessibility</dfn></a> (barrier-free design and coding) of the __org__ web page at <a href="__url__">__url__</a> on __dateSlash__. The procedure performed 808 tests. Of these, 16 are custom tests defined by Testaro, and the others belong to six other packages of tests:</p>
31
- <ul>
32
- <li><a href="https://www.npmjs.com/package/aatt">AATT</a> by PayPal running <a href="https://marketplace.squiz.net/extensions/html-codesniffer">HTMLCodeSniffer</a> by Squiz</li>
33
- <li><a href="https://github.com/Siteimprove/alfa">Alfa</a> by Siteimprove</li>
34
- <li><a href="https://www.npmjs.com/package/axe-core">Axe-core</a> by Deque</li>
35
- <li><a href="https://github.com/IBMa/equal-access">Equal Access</a> by IBM</li>
36
- <li><a href="https://tenon.io/documentation/apiv2.php">Tenon</a> by Level Access</li>
37
- <li><a href="https://wave.webaim.org/api/">WAVE</a> by WebAIM</li>
38
- </ul>
39
- <p>Testaro produced a report enumerating the test results.</p>
40
- <p><a href="https://www.npmjs.com/package/testilo">Testilo</a> used its <code>sp10b</code> scoring procedure to compute partial and total scores for the page. The total score is __totalScore__ (where 0 is the best possible score). The scored report is appended below.</p>
41
- <p>Finally, Testilo used procedure <code>dp10b</code> to produce this digest, explaining how <code>sp10b</code> computed the scores.</p>
42
- <h2>Score summary</h2>
43
- <table class="allBorder secondCellRight">
44
- <caption>Score components</caption>
45
- <tbody class="headersLeft">
46
- __scoreRows__
47
- </tbody>
48
- </table>
49
- <h2>Issue summary</h2>
50
- <h3>Special issues</h3>
51
- __specialSummary__
52
- <h3>Classified issues</h3>
53
- <p>The classified issues reported by tests are summarized below.</p>
54
- __groupSummary__
55
- <h2>Discussion</h2>
56
- <p>Although there are widely accepted <a href="https://www.w3.org/WAI/standards-guidelines/">accessibility standards</a>, there is still no unanimity about how to define, test, and quantify accessibility. The failures reported in this digest merit investigation as <strong>potential</strong> opportunities for improved accessibility. But you may conclude that some of the failures do not actually harm accessibility, and some substantial accessibility faults can escape detection by any of these tests. Likewise, you may disagree with weightings and formulas of scoring procedure <code>sp10b</code>, or question whether it is appropriate even to assign accessibility scores to a web page. This digest describes only one interpretation of the page&rsquo;s accessibility. You can modify and extend Testaro and Testilo to fit other understandings.</p>
57
- <p>Scoring procedure <code>sp10b</code> bases scores on:</p>
58
- <ul>
59
- <li>how many categories of issues were reported</li>
60
- <li>how many issues were reported per category</li>
61
- <li>the largest count of issues of a category reported by a single test</li>
62
- <li>how many tests reported the issues</li>
63
- <li>how important each issue is deemed to be</li>
64
- </ul>
65
- <p>Most issues are simply counted, but some are complex and get a <q>count</q> that is really the result of a formula. The exact rules for scoring are in the <a href="https://github.com/jrpool/testilo/blob/main/procs/score/sp10b.js"><code>sp10b.js</code> file</a> that performs the scoring.</p>
66
- <p>Weights used in the calculations are contained in the appended report in the <code>score</code> block. The <code>groupWeights</code> block within it contains the weights applied to the classified issues, and the <code>countWeights</code> block within it contains the amounts those weights are multiplied by or added to. For example, if <code>roleBad</code> issues are reported, the <code>roleBad</code> score is the <code>absolute</code> amount (2), plus the largest count of those issues reported by any test multiplied by the <code>largest</code> amount (1), plus the total count of those issues reported by all other tests multiplied by the <code>smaller</code> amount (0.4), all multiplied by the <code>roleBad</code> weight (3).</p>
67
- <h2>Report</h2>
68
- <pre>__report__</pre>
69
- <footer>
70
- <p class="date">Produced <time itemprop="datePublished" datetime="__dateISO__">__dateSlash__</time></p>
71
- </footer>
72
- </main>
73
- </body>
74
- </html>