Skip to content

Commit

Permalink
Use role attribute only on interactive or allowlisted components.
Browse files Browse the repository at this point in the history
  • Loading branch information
isoos committed Dec 22, 2023
1 parent 21837fa commit 4469f7a
Show file tree
Hide file tree
Showing 39 changed files with 402 additions and 383 deletions.
9 changes: 7 additions & 2 deletions app/lib/frontend/templates/detail_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -95,8 +95,13 @@ class Tab {
if (isPrivate) '-private',
];

d.Node get titleNode =>
href == null ? d.text(title) : d.a(href: href, text: title);
d.Node get titleNode => href == null
? d.text(title)
: d.a(
href: href,
text: title,
attributes: {'role': 'button'},
);

bool get hasContent => contentNode != null;

Expand Down
1 change: 0 additions & 1 deletion app/lib/frontend/templates/views/shared/detail/tabs.dart
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ d.Node detailTabsNode({
children: tabs.map(
(t) => d.li(
classes: t.titleClasses,
attributes: {'role': 'button'},
child: t.titleNode,
),
),
Expand Down
14 changes: 7 additions & 7 deletions app/test/frontend/golden/my_activity_log_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -157,16 +157,16 @@ <h1 class="title">admin</h1>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-my-publishers-title -private" role="button">
<a href="/my-publishers">Publishers</a>
<li class="detail-tab tab-link detail-tab-my-publishers-title -private">
<a href="/my-publishers" role="button">Publishers</a>
</li>
<li class="detail-tab tab-link detail-tab-my-packages-title -private" role="button">
<a href="/my-packages">Packages</a>
<li class="detail-tab tab-link detail-tab-my-packages-title -private">
<a href="/my-packages" role="button">Packages</a>
</li>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private" role="button">
<a href="/my-liked-packages">Likes</a>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private">
<a href="/my-liked-packages" role="button">Likes</a>
</li>
<li class="detail-tab tab-button detail-tab-my-activity-log-title -active -private" role="button">Activity log</li>
<li class="detail-tab tab-button detail-tab-my-activity-log-title -active -private">Activity log</li>
</ul>
</div>
</div>
Expand Down
14 changes: 7 additions & 7 deletions app/test/frontend/golden/my_liked_packages.html
Original file line number Diff line number Diff line change
Expand Up @@ -158,15 +158,15 @@ <h1 class="title">user</h1>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-my-publishers-title -private" role="button">
<a href="/my-publishers">Publishers</a>
<li class="detail-tab tab-link detail-tab-my-publishers-title -private">
<a href="/my-publishers" role="button">Publishers</a>
</li>
<li class="detail-tab tab-link detail-tab-my-packages-title -private" role="button">
<a href="/my-packages">Packages</a>
<li class="detail-tab tab-link detail-tab-my-packages-title -private">
<a href="/my-packages" role="button">Packages</a>
</li>
<li class="detail-tab tab-button detail-tab-my-liked-packages-title -active -private" role="button">Likes</li>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private" role="button">
<a href="/my-activity-log">Activity log</a>
<li class="detail-tab tab-button detail-tab-my-liked-packages-title -active -private">Likes</li>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private">
<a href="/my-activity-log" role="button">Activity log</a>
</li>
</ul>
</div>
Expand Down
14 changes: 7 additions & 7 deletions app/test/frontend/golden/my_packages.html
Original file line number Diff line number Diff line change
Expand Up @@ -157,15 +157,15 @@ <h1 class="title">user</h1>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-my-publishers-title -private" role="button">
<a href="/my-publishers">Publishers</a>
<li class="detail-tab tab-link detail-tab-my-publishers-title -private">
<a href="/my-publishers" role="button">Publishers</a>
</li>
<li class="detail-tab tab-button detail-tab-my-packages-title -active -private" role="button">Packages</li>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private" role="button">
<a href="/my-liked-packages">Likes</a>
<li class="detail-tab tab-button detail-tab-my-packages-title -active -private">Packages</li>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private">
<a href="/my-liked-packages" role="button">Likes</a>
</li>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private" role="button">
<a href="/my-activity-log">Activity log</a>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private">
<a href="/my-activity-log" role="button">Activity log</a>
</li>
</ul>
</div>
Expand Down
14 changes: 7 additions & 7 deletions app/test/frontend/golden/my_publishers.html
Original file line number Diff line number Diff line change
Expand Up @@ -157,15 +157,15 @@ <h1 class="title">user</h1>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-button detail-tab-my-publishers-title -active -private" role="button">Publishers</li>
<li class="detail-tab tab-link detail-tab-my-packages-title -private" role="button">
<a href="/my-packages">Packages</a>
<li class="detail-tab tab-button detail-tab-my-publishers-title -active -private">Publishers</li>
<li class="detail-tab tab-link detail-tab-my-packages-title -private">
<a href="/my-packages" role="button">Packages</a>
</li>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private" role="button">
<a href="/my-liked-packages">Likes</a>
<li class="detail-tab tab-link detail-tab-my-liked-packages-title -private">
<a href="/my-liked-packages" role="button">Likes</a>
</li>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private" role="button">
<a href="/my-activity-log">Activity log</a>
<li class="detail-tab tab-link detail-tab-my-activity-log-title -private">
<a href="/my-activity-log" role="button">Activity log</a>
</li>
</ul>
</div>
Expand Down
30 changes: 15 additions & 15 deletions app/test/frontend/golden/pkg_activity_log_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -212,28 +212,28 @@ <h3 class="detail-lead-title">Metadata</h3>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-readme-title" role="button">
<a href="/packages/oxygen">Readme</a>
<li class="detail-tab tab-link detail-tab-readme-title">
<a href="/packages/oxygen" role="button">Readme</a>
</li>
<li class="detail-tab tab-link detail-tab-changelog-title" role="button">
<a href="/packages/oxygen/changelog">Changelog</a>
<li class="detail-tab tab-link detail-tab-changelog-title">
<a href="/packages/oxygen/changelog" role="button">Changelog</a>
</li>
<li class="detail-tab tab-link detail-tab-example-title" role="button">
<a href="/packages/oxygen/example">Example</a>
<li class="detail-tab tab-link detail-tab-example-title">
<a href="/packages/oxygen/example" role="button">Example</a>
</li>
<li class="detail-tab tab-link detail-tab-installing-title" role="button">
<a href="/packages/oxygen/install">Installing</a>
<li class="detail-tab tab-link detail-tab-installing-title">
<a href="/packages/oxygen/install" role="button">Installing</a>
</li>
<li class="detail-tab tab-link detail-tab-versions-title" role="button">
<a href="/packages/oxygen/versions">Versions</a>
<li class="detail-tab tab-link detail-tab-versions-title">
<a href="/packages/oxygen/versions" role="button">Versions</a>
</li>
<li class="detail-tab tab-link detail-tab-analysis-title" role="button">
<a href="/packages/oxygen/score">Scores</a>
<li class="detail-tab tab-link detail-tab-analysis-title">
<a href="/packages/oxygen/score" role="button">Scores</a>
</li>
<li class="detail-tab tab-link detail-tab-admin-title -private" role="button">
<a href="/packages/oxygen/admin">Admin</a>
<li class="detail-tab tab-link detail-tab-admin-title -private">
<a href="/packages/oxygen/admin" role="button">Admin</a>
</li>
<li class="detail-tab tab-button detail-tab-activity-log-title -active -private" role="button">Activity Log</li>
<li class="detail-tab tab-button detail-tab-activity-log-title -active -private">Activity Log</li>
</ul>
</div>
</div>
Expand Down
30 changes: 15 additions & 15 deletions app/test/frontend/golden/pkg_admin_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -212,27 +212,27 @@ <h3 class="detail-lead-title">Metadata</h3>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-readme-title" role="button">
<a href="/packages/oxygen">Readme</a>
<li class="detail-tab tab-link detail-tab-readme-title">
<a href="/packages/oxygen" role="button">Readme</a>
</li>
<li class="detail-tab tab-link detail-tab-changelog-title" role="button">
<a href="/packages/oxygen/changelog">Changelog</a>
<li class="detail-tab tab-link detail-tab-changelog-title">
<a href="/packages/oxygen/changelog" role="button">Changelog</a>
</li>
<li class="detail-tab tab-link detail-tab-example-title" role="button">
<a href="/packages/oxygen/example">Example</a>
<li class="detail-tab tab-link detail-tab-example-title">
<a href="/packages/oxygen/example" role="button">Example</a>
</li>
<li class="detail-tab tab-link detail-tab-installing-title" role="button">
<a href="/packages/oxygen/install">Installing</a>
<li class="detail-tab tab-link detail-tab-installing-title">
<a href="/packages/oxygen/install" role="button">Installing</a>
</li>
<li class="detail-tab tab-link detail-tab-versions-title" role="button">
<a href="/packages/oxygen/versions">Versions</a>
<li class="detail-tab tab-link detail-tab-versions-title">
<a href="/packages/oxygen/versions" role="button">Versions</a>
</li>
<li class="detail-tab tab-link detail-tab-analysis-title" role="button">
<a href="/packages/oxygen/score">Scores</a>
<li class="detail-tab tab-link detail-tab-analysis-title">
<a href="/packages/oxygen/score" role="button">Scores</a>
</li>
<li class="detail-tab tab-button detail-tab-admin-title -active -private" role="button">Admin</li>
<li class="detail-tab tab-link detail-tab-activity-log-title -private" role="button">
<a href="/packages/oxygen/activity-log">Activity log</a>
<li class="detail-tab tab-button detail-tab-admin-title -active -private">Admin</li>
<li class="detail-tab tab-link detail-tab-activity-log-title -private">
<a href="/packages/oxygen/activity-log" role="button">Activity log</a>
</li>
</ul>
</div>
Expand Down
22 changes: 11 additions & 11 deletions app/test/frontend/golden/pkg_changelog_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -186,21 +186,21 @@ <h3 class="detail-lead-title">Metadata</h3>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-readme-title" role="button">
<a href="/packages/oxygen">Readme</a>
<li class="detail-tab tab-link detail-tab-readme-title">
<a href="/packages/oxygen" role="button">Readme</a>
</li>
<li class="detail-tab tab-button detail-tab-changelog-title -active" role="button">Changelog</li>
<li class="detail-tab tab-link detail-tab-example-title" role="button">
<a href="/packages/oxygen/example">Example</a>
<li class="detail-tab tab-button detail-tab-changelog-title -active">Changelog</li>
<li class="detail-tab tab-link detail-tab-example-title">
<a href="/packages/oxygen/example" role="button">Example</a>
</li>
<li class="detail-tab tab-link detail-tab-installing-title" role="button">
<a href="/packages/oxygen/install">Installing</a>
<li class="detail-tab tab-link detail-tab-installing-title">
<a href="/packages/oxygen/install" role="button">Installing</a>
</li>
<li class="detail-tab tab-link detail-tab-versions-title" role="button">
<a href="/packages/oxygen/versions">Versions</a>
<li class="detail-tab tab-link detail-tab-versions-title">
<a href="/packages/oxygen/versions" role="button">Versions</a>
</li>
<li class="detail-tab tab-link detail-tab-analysis-title" role="button">
<a href="/packages/oxygen/score">Scores</a>
<li class="detail-tab tab-link detail-tab-analysis-title">
<a href="/packages/oxygen/score" role="button">Scores</a>
</li>
</ul>
</div>
Expand Down
22 changes: 11 additions & 11 deletions app/test/frontend/golden/pkg_example_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -186,21 +186,21 @@ <h3 class="detail-lead-title">Metadata</h3>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-readme-title" role="button">
<a href="/packages/oxygen">Readme</a>
<li class="detail-tab tab-link detail-tab-readme-title">
<a href="/packages/oxygen" role="button">Readme</a>
</li>
<li class="detail-tab tab-link detail-tab-changelog-title" role="button">
<a href="/packages/oxygen/changelog">Changelog</a>
<li class="detail-tab tab-link detail-tab-changelog-title">
<a href="/packages/oxygen/changelog" role="button">Changelog</a>
</li>
<li class="detail-tab tab-button detail-tab-example-title -active" role="button">Example</li>
<li class="detail-tab tab-link detail-tab-installing-title" role="button">
<a href="/packages/oxygen/install">Installing</a>
<li class="detail-tab tab-button detail-tab-example-title -active">Example</li>
<li class="detail-tab tab-link detail-tab-installing-title">
<a href="/packages/oxygen/install" role="button">Installing</a>
</li>
<li class="detail-tab tab-link detail-tab-versions-title" role="button">
<a href="/packages/oxygen/versions">Versions</a>
<li class="detail-tab tab-link detail-tab-versions-title">
<a href="/packages/oxygen/versions" role="button">Versions</a>
</li>
<li class="detail-tab tab-link detail-tab-analysis-title" role="button">
<a href="/packages/oxygen/score">Scores</a>
<li class="detail-tab tab-link detail-tab-analysis-title">
<a href="/packages/oxygen/score" role="button">Scores</a>
</li>
</ul>
</div>
Expand Down
22 changes: 11 additions & 11 deletions app/test/frontend/golden/pkg_install_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -186,21 +186,21 @@ <h3 class="detail-lead-title">Metadata</h3>
<div class="detail-tabs-wide-header">
<div class="detail-container">
<ul class="detail-tabs-header">
<li class="detail-tab tab-link detail-tab-readme-title" role="button">
<a href="/packages/oxygen">Readme</a>
<li class="detail-tab tab-link detail-tab-readme-title">
<a href="/packages/oxygen" role="button">Readme</a>
</li>
<li class="detail-tab tab-link detail-tab-changelog-title" role="button">
<a href="/packages/oxygen/changelog">Changelog</a>
<li class="detail-tab tab-link detail-tab-changelog-title">
<a href="/packages/oxygen/changelog" role="button">Changelog</a>
</li>
<li class="detail-tab tab-link detail-tab-example-title" role="button">
<a href="/packages/oxygen/example">Example</a>
<li class="detail-tab tab-link detail-tab-example-title">
<a href="/packages/oxygen/example" role="button">Example</a>
</li>
<li class="detail-tab tab-button detail-tab-installing-title -active" role="button">Installing</li>
<li class="detail-tab tab-link detail-tab-versions-title" role="button">
<a href="/packages/oxygen/versions">Versions</a>
<li class="detail-tab tab-button detail-tab-installing-title -active">Installing</li>
<li class="detail-tab tab-link detail-tab-versions-title">
<a href="/packages/oxygen/versions" role="button">Versions</a>
</li>
<li class="detail-tab tab-link detail-tab-analysis-title" role="button">
<a href="/packages/oxygen/score">Scores</a>
<li class="detail-tab tab-link detail-tab-analysis-title">
<a href="/packages/oxygen/score" role="button">Scores</a>
</li>
</ul>
</div>
Expand Down
Loading

0 comments on commit 4469f7a

Please sign in to comment.