Skip to content

Commit 16039fb

Browse files
authored
Add appropriate alt text to status icons on score page (#8543)
1 parent 4ae697c commit 16039fb

File tree

5 files changed

+55
-59
lines changed

5 files changed

+55
-59
lines changed

app/lib/frontend/templates/views/pkg/score_tab.dart

Lines changed: 13 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -125,8 +125,16 @@ d.Node _section(ReportSection section) {
125125
child: d.img(
126126
classes: ['pkg-report-icon'],
127127
image: d.Image(
128-
src: _statusIconUrls[section.status]!,
129-
alt: _statusIconAlts[section.status]!,
128+
src: switch (section.status) {
129+
ReportStatus.passed => staticUrls.reportOKIconGreen,
130+
ReportStatus.partial => staticUrls.reportMissingIconYellow,
131+
ReportStatus.failed => staticUrls.reportMissingIconRed,
132+
},
133+
alt: switch (section.status) {
134+
ReportStatus.passed => 'Passed report section',
135+
ReportStatus.partial => 'Partially passed report section',
136+
ReportStatus.failed => 'Failed report section',
137+
},
130138
width: 18,
131139
height: 18,
132140
),
@@ -238,36 +246,24 @@ d.Node _downloadsChart(WeeklyVersionDownloadCounts weeklyVersionDownloads) {
238246
]);
239247
}
240248

241-
final _statusIconUrls = {
242-
ReportStatus.passed:
243-
staticUrls.getAssetUrl('/static/img/report-ok-icon-green.svg'),
244-
ReportStatus.partial:
245-
staticUrls.getAssetUrl('/static/img/report-missing-icon-yellow.svg'),
246-
ReportStatus.failed:
247-
staticUrls.getAssetUrl('/static/img/report-missing-icon-red.svg'),
248-
};
249-
250-
final _statusIconAlts = {
251-
ReportStatus.passed: 'OK',
252-
ReportStatus.partial: 'partial',
253-
ReportStatus.failed: 'failed',
254-
};
255-
256249
String _updatedSummary(String summary) {
257250
return summary.split('\n').map((line) {
258251
if (!line.startsWith('### ')) return line;
259252
return line
260253
.replaceFirst(
261254
'[*]',
262255
'<img class="report-summary-icon" '
256+
'alt="Passed check" '
263257
'src="${staticUrls.reportOKIconGreen}" />')
264258
.replaceFirst(
265259
'[x]',
266260
'<img class="report-summary-icon" '
261+
'alt="Failed check" '
267262
'src="${staticUrls.reportMissingIconRed}" />')
268263
.replaceFirst(
269264
'[~]',
270265
'<img class="report-summary-icon" '
266+
'alt="Partially passed check" '
271267
'src="${staticUrls.reportMissingIconYellow}" />');
272268
}).join('\n');
273269
}

app/test/frontend/golden/pkg_score_page.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -241,7 +241,7 @@ <h3 class="detail-lead-title">Metadata</h3>
241241
<div class="pkg-report-section foldable">
242242
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-convention">
243243
<div class="pkg-report-header-icon">
244-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="failed" width="18" height="18"/>
244+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="Failed report section" width="18" height="18"/>
245245
</div>
246246
<div class="pkg-report-header-title">Fake conventions</div>
247247
<div class="pkg-report-header-score -is-red">
@@ -255,7 +255,7 @@ <h3 class="detail-lead-title">Metadata</h3>
255255
<div class="pkg-report-content">
256256
<div class="pkg-report-content-summary markdown-body">
257257
<h3>
258-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
258+
<img class="report-summary-icon" alt="Partially passed check" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
259259
18/30 points: Package layout
260260
</h3>
261261
<ul>
@@ -268,7 +268,7 @@ <h3>
268268
<div class="pkg-report-section foldable">
269269
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-documentation">
270270
<div class="pkg-report-header-icon">
271-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
271+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
272272
</div>
273273
<div class="pkg-report-header-title">Fake documentation</div>
274274
<div class="pkg-report-header-score">
@@ -282,7 +282,7 @@ <h3>
282282
<div class="pkg-report-content">
283283
<div class="pkg-report-content-summary markdown-body">
284284
<h3>
285-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
285+
<img class="report-summary-icon" alt="Partially passed check" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
286286
36/40 points: Example
287287
</h3>
288288
<ul>

app/test/frontend/golden/pkg_score_page_with_downloads_chart.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -241,7 +241,7 @@ <h3 class="detail-lead-title">Metadata</h3>
241241
<div class="pkg-report-section foldable">
242242
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-convention">
243243
<div class="pkg-report-header-icon">
244-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="failed" width="18" height="18"/>
244+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="Failed report section" width="18" height="18"/>
245245
</div>
246246
<div class="pkg-report-header-title">Fake conventions</div>
247247
<div class="pkg-report-header-score -is-red">
@@ -255,7 +255,7 @@ <h3 class="detail-lead-title">Metadata</h3>
255255
<div class="pkg-report-content">
256256
<div class="pkg-report-content-summary markdown-body">
257257
<h3>
258-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
258+
<img class="report-summary-icon" alt="Partially passed check" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
259259
18/30 points: Package layout
260260
</h3>
261261
<ul>
@@ -268,7 +268,7 @@ <h3>
268268
<div class="pkg-report-section foldable">
269269
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-documentation">
270270
<div class="pkg-report-header-icon">
271-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
271+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
272272
</div>
273273
<div class="pkg-report-header-title">Fake documentation</div>
274274
<div class="pkg-report-header-score">
@@ -282,7 +282,7 @@ <h3>
282282
<div class="pkg-report-content">
283283
<div class="pkg-report-content-summary markdown-body">
284284
<h3>
285-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
285+
<img class="report-summary-icon" alt="Partially passed check" src="/static/hash-%%etag%%/img/report-missing-icon-yellow.svg"/>
286286
36/40 points: Example
287287
</h3>
288288
<ul>

app/test/task/testdata/goldens/packages/oxygen/score.html

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -233,7 +233,7 @@ <h3 class="detail-lead-title">Metadata</h3>
233233
<div class="pkg-report-section foldable">
234234
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-convention">
235235
<div class="pkg-report-header-icon">
236-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="failed" width="18" height="18"/>
236+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg" alt="Failed report section" width="18" height="18"/>
237237
</div>
238238
<div class="pkg-report-header-title">Follow Dart file conventions</div>
239239
<div class="pkg-report-header-score -is-red">
@@ -247,7 +247,7 @@ <h3 class="detail-lead-title">Metadata</h3>
247247
<div class="pkg-report-content">
248248
<div class="pkg-report-content-summary markdown-body">
249249
<h3>
250-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg"/>
250+
<img class="report-summary-icon" alt="Failed check" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg"/>
251251
0/10 points: Provide a valid
252252
<code>pubspec.yaml</code>
253253
</h3>
@@ -298,17 +298,17 @@ <h3>
298298
</p>
299299
</details>
300300
<h3>
301-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
301+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
302302
5/5 points: Provide a valid
303303
<code>README.md</code>
304304
</h3>
305305
<h3>
306-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
306+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
307307
5/5 points: Provide a valid
308308
<code>CHANGELOG.md</code>
309309
</h3>
310310
<h3>
311-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg"/>
311+
<img class="report-summary-icon" alt="Failed check" src="/static/hash-%%etag%%/img/report-missing-icon-red.svg"/>
312312
0/10 points: Use an OSI-approved license
313313
</h3>
314314
<details>
@@ -328,7 +328,7 @@ <h3>
328328
<div class="pkg-report-section foldable">
329329
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-documentation">
330330
<div class="pkg-report-header-icon">
331-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
331+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
332332
</div>
333333
<div class="pkg-report-header-title">Provide documentation</div>
334334
<div class="pkg-report-header-score">
@@ -342,7 +342,7 @@ <h3>
342342
<div class="pkg-report-content">
343343
<div class="pkg-report-content-summary markdown-body">
344344
<h3>
345-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
345+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
346346
10/10 points: 20% or more of the public API has dartdoc comments
347347
</h3>
348348
<p>2 out of 8 API elements (25.0 %) have documentation comments.</p>
@@ -360,7 +360,7 @@ <h3>
360360
.
361361
</p>
362362
<h3>
363-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
363+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
364364
10/10 points: Package has an example and has no issues with screenshots
365365
</h3>
366366
</div>
@@ -370,7 +370,7 @@ <h3>
370370
<div class="pkg-report-section foldable">
371371
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-platform">
372372
<div class="pkg-report-header-icon">
373-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
373+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
374374
</div>
375375
<div class="pkg-report-header-title">Platform support</div>
376376
<div class="pkg-report-header-score">
@@ -384,7 +384,7 @@ <h3>
384384
<div class="pkg-report-content">
385385
<div class="pkg-report-content-summary markdown-body">
386386
<h3>
387-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
387+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
388388
20/20 points: Supports 6 of 6 possible platforms (
389389
<strong>iOS</strong>
390390
,
@@ -420,7 +420,7 @@ <h3>
420420
</li>
421421
</ul>
422422
<h3>
423-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
423+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
424424
0/0 points: WASM compatibility
425425
</h3>
426426
<p>
@@ -440,7 +440,7 @@ <h3>
440440
<div class="pkg-report-section foldable">
441441
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-analysis">
442442
<div class="pkg-report-header-icon">
443-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
443+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
444444
</div>
445445
<div class="pkg-report-header-title">Pass static analysis</div>
446446
<div class="pkg-report-header-score">
@@ -454,7 +454,7 @@ <h3>
454454
<div class="pkg-report-content">
455455
<div class="pkg-report-content-summary markdown-body">
456456
<h3>
457-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
457+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
458458
50/50 points: code has no errors, warnings, lints, or formatting issues
459459
</h3>
460460
</div>
@@ -464,7 +464,7 @@ <h3>
464464
<div class="pkg-report-section foldable">
465465
<div class="pkg-report-header foldable-button" data-ga-click-event="toggle-report-section-dependency">
466466
<div class="pkg-report-header-icon">
467-
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="OK" width="18" height="18"/>
467+
<img class="pkg-report-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg" alt="Passed report section" width="18" height="18"/>
468468
</div>
469469
<div class="pkg-report-header-title">Support up-to-date dependencies</div>
470470
<div class="pkg-report-header-score">
@@ -478,7 +478,7 @@ <h3>
478478
<div class="pkg-report-content">
479479
<div class="pkg-report-content-summary markdown-body">
480480
<h3>
481-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
481+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
482482
10/10 points: All of the package dependencies are supported in the latest version
483483
</h3>
484484
<p>No dependencies.</p>
@@ -488,11 +488,11 @@ <h3>
488488
.
489489
</p>
490490
<h3>
491-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
491+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
492492
10/10 points: Package supports latest stable Dart and Flutter SDKs
493493
</h3>
494494
<h3>
495-
<img class="report-summary-icon" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
495+
<img class="report-summary-icon" alt="Passed check" src="/static/hash-%%etag%%/img/report-ok-icon-green.svg"/>
496496
20/20 points: Compatible with dependency constraint lower bounds
497497
</h3>
498498
<p>

0 commit comments

Comments
 (0)