testilo 3.9.10 → 3.9.11
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.
package/package.json
CHANGED
|
@@ -27,8 +27,18 @@
|
|
|
27
27
|
</div>
|
|
28
28
|
</header>
|
|
29
29
|
<h2>Introduction</h2>
|
|
30
|
-
<p>
|
|
31
|
-
<p
|
|
30
|
+
<p>This is a report on transactional <a href="https://www.w3.org/WAI/fundamentals/accessibility-intro/">accessibility</a>. Suppose a person is visiting a website and wants to engage in some transaction with it. Is the transaction easy, predictable, and safe? If so, the website is <dfn>transactionally accessible</dfn>. Some disabilities make it difficult to discover how to do things on a website. Everybody, but especially any person with such a disability, benefits from transactions being designed to conform to the most common and standard conventions.</p>
|
|
31
|
+
<p>This report deals with an issue-reporting transaction. Specifically, the transaction begins when a person notices an accessibility issue on a page or view of a website or web application and wants to report that issue to whoever is responsible for the website. The simple, standard, and thus predictable transaction is assumed to look like this:</p>
|
|
32
|
+
<ol>
|
|
33
|
+
<li>The person finds an accessibility link on the page.</li>
|
|
34
|
+
<li>The person clicks that link.</li>
|
|
35
|
+
<li>That link takes the person to an accessibility page.</li>
|
|
36
|
+
<li>On the accessibility page, there is a link for sending an email message about accessibility, and there is another link for making a telephone call about accessibility.</li>
|
|
37
|
+
</ol>
|
|
38
|
+
<p>Thus, instead of the person needing to figure out how this particular website accepts issue reports, the person is assumed already to know how websites normally accept issue reports. So, instead of exploring the site to find its method, the person uses the standard method.</p>
|
|
39
|
+
<h2>Procedures</h2>
|
|
40
|
+
<p>The <a href="https://www.npmjs.com/package/testaro">Testaro</a> application used its <code>tpA11yMessage</code> testing procedure to evaluate the accessibility of this transaction on the __org__ web page at <a href="__url__">__url__</a> on __dateSlash__. Testaro produced a report.</p>
|
|
41
|
+
<p>The <a href="https://www.npmjs.com/package/testilo">Testilo</a> application processed the report and used the <code>spA11yMessage</code> scoring procedure to compute a score for the transaction. The total score is __totalScore__ (where 0 is the worst and 16 is the best possible score). The scored report is appended below.</p>
|
|
32
42
|
<p>Finally, Testilo used procedure <code>dpA11yMessage</code> to produce this digest, briefly explaining how <code>spA11yMessage</code> computed the scores.</p>
|
|
33
43
|
<h2>Score summary</h2>
|
|
34
44
|
<table class="allBorder secondCellRight">
|
|
@@ -37,23 +47,15 @@
|
|
|
37
47
|
__scoreRows__
|
|
38
48
|
</tbody>
|
|
39
49
|
</table>
|
|
40
|
-
<h2>Score components</h2>
|
|
41
|
-
__scoreComponents__
|
|
42
50
|
<h2>Discussion</h2>
|
|
43
|
-
<p>The
|
|
44
|
-
<p>Here, in brief, is how <code>spA11yMessage</code> computes a score for a page.</p>
|
|
45
|
-
<p>Each score component begins as 0.</p>
|
|
51
|
+
<p>The components of the total score are:</p>
|
|
46
52
|
<ul>
|
|
47
|
-
<li
|
|
48
|
-
<li
|
|
49
|
-
<li
|
|
50
|
-
<li
|
|
51
|
-
<li
|
|
52
|
-
<li
|
|
53
|
-
<li>The <code>mailLink</code> score increases by 2 more if one of the email links has text content that includes <q>accessibility</q> (case-insensitively).</li>
|
|
54
|
-
<li>If none of the email links has text content including <q>accessibility</q> but <q>accessibility</q> appears in the text content of the parent of any of the email links, the <code>mailLink</code> score increases by 1 more.</li>
|
|
55
|
-
<li>The same computations as for the <code>mailLink</code> score are performed on links with telephone destinations (i.e. an <code>href</code> with a value starting with <code>tel:</code>), to determine the <code>telLink</code> score.</li>
|
|
56
|
-
<li>The total score is the sum of the above scores.</li>
|
|
53
|
+
<li><code>page</code>: Can the page be visited?</li>
|
|
54
|
+
<li><code>a11yLink</code>: Does the page have a functioning <q>accessibility</q> link?</li>
|
|
55
|
+
<li><code>title</code>: Is the page to which the link goes titled to show it is about accessibility?</li>
|
|
56
|
+
<li><code>heading</code>: Does that page (the accessibility page) have a top heading indicating the page is about accessibility?</li>
|
|
57
|
+
<li><code>mailLink</code>: Does the accessibility page have a link to send email about accessibility?.</li>
|
|
58
|
+
<li><code>telLink</code>: Does the accessibility page have a link to make a telephone call about accessibility?</li>
|
|
57
59
|
</ul>
|
|
58
60
|
<p>The precise rules of <code>spA11yMessage</code> are found in the <a href="https://github.com/jrpool/testilo/blob/main/procs/score/spA11yMessage.js">code itself</a>.</p>
|
|
59
61
|
<h2>Report</h2>
|
|
@@ -45,68 +45,11 @@ exports.makeQuery = (report, query) => {
|
|
|
45
45
|
return;
|
|
46
46
|
}
|
|
47
47
|
}
|
|
48
|
-
|
|
49
|
-
const
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
else {
|
|
54
|
-
console.log('ERROR: missing or invalid total score');
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
// Add the total to the query.
|
|
58
|
-
const scoreRows = [getScoreRow('total', summary(['total']))];
|
|
59
|
-
// Add the group rows of the score-summary table to the query.
|
|
60
|
-
groups.forEach(group => {
|
|
61
|
-
scoreRows.push(getScoreRow(`${group.groupName}`, group.score));
|
|
48
|
+
// Add the score data to the query.
|
|
49
|
+
const scoreRows = [];
|
|
50
|
+
Object.keys(score).forEach(scoreName => {
|
|
51
|
+
scoreRows.push(getScoreRow(scoreName, score[scoreName]));
|
|
62
52
|
});
|
|
53
|
+
query.totalScore = score.total;
|
|
63
54
|
query.scoreRows = scoreRows.join(innerJoiner);
|
|
64
|
-
// If the score has any special components:
|
|
65
|
-
const scoredSpecialIDs = specialComponentIDs.filter(item => summary[item]);
|
|
66
|
-
if (scoredSpecialIDs.length) {
|
|
67
|
-
// Add paragraphs about them for the issue summary to the query.
|
|
68
|
-
const specialPs = [];
|
|
69
|
-
scoredSpecialIDs.forEach(id => {
|
|
70
|
-
specialPs.push(`${getSpecialPStart(summary, id)} ${specialMessages[id]}`);
|
|
71
|
-
});
|
|
72
|
-
query.specialSummary = specialPs.join(joiner);
|
|
73
|
-
}
|
|
74
|
-
// Otherwise, i.e. if the score has no special components:
|
|
75
|
-
else {
|
|
76
|
-
// Add a paragraph stating this for the issue summary to the query.
|
|
77
|
-
query.specialSummary = '<p>No special issues contributed to the score.</p>'
|
|
78
|
-
}
|
|
79
|
-
// If the score has any classified issues as components:
|
|
80
|
-
if (groups.length) {
|
|
81
|
-
// Add paragraphs about them for the special summary to the query.
|
|
82
|
-
const groupSummaryItems = [];
|
|
83
|
-
groups.forEach(group => {
|
|
84
|
-
const {groupName, score} = group;
|
|
85
|
-
const groupP = `<p><span class="componentID">${groupName}</span>: Score ${score}. Issues reported by tests in this category:</p>`;
|
|
86
|
-
const groupListItems = [];
|
|
87
|
-
const groupData = groupDetails.groups[groupName];
|
|
88
|
-
const packageIDs = Object.keys(groupData);
|
|
89
|
-
packageIDs.forEach(packageID => {
|
|
90
|
-
const testIDs = Object.keys(groupData[packageID]);
|
|
91
|
-
testIDs.forEach(testID => {
|
|
92
|
-
const testData = groupData[packageID][testID];
|
|
93
|
-
const {score, what} = testData;
|
|
94
|
-
const listItem = `<li>Package <code>${packageID}</code>, test <code>${testID}</code>, score ${score} (${what})</li>`;
|
|
95
|
-
groupListItems.push(listItem);
|
|
96
|
-
});
|
|
97
|
-
});
|
|
98
|
-
const groupList = [
|
|
99
|
-
'<ul>',
|
|
100
|
-
groupListItems.join('\n '),
|
|
101
|
-
'</ul>'
|
|
102
|
-
].join(joiner);
|
|
103
|
-
groupSummaryItems.push(groupP, groupList);
|
|
104
|
-
});
|
|
105
|
-
query.groupSummary = groupSummaryItems.join(joiner);
|
|
106
|
-
}
|
|
107
|
-
// Otherwise, i.e. if the score has no classified issues as components:
|
|
108
|
-
else {
|
|
109
|
-
// Add a paragraph stating this for the group summary to the query.
|
|
110
|
-
query.groupSummary = '<p>No classified issues contributed to the score.</p>'
|
|
111
|
-
}
|
|
112
55
|
};
|