Skip to content

Commit fda0600

Browse files
julien-deramondjulien-deramond
authored
Docs: add missing role='button' to <a> dropdowns (#42482)
1 parent e3372d4 commit fda0600

12 files changed

Lines changed: 33 additions & 33 deletions

File tree

‎js/tests/unit/tab.spec.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -957,7 +957,7 @@ describe('Tab', () => {
957957
' <li class="nav-item"><a class="nav-link" href="#home" data-bs-toggle="tab">Home</a></li>',
958958
' <li class="nav-item"><a class="nav-link" href="#profile" data-bs-toggle="tab">Profile</a></li>',
959959
' <li class="nav-item dropdown">',
960-
' <a class="nav-link dropdown-toggle active" data-bs-toggle="dropdown" href="#">Dropdown</a>',
960+
' <a class="nav-link dropdown-toggle active" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>',
961961
' <div class="dropdown-menu">',
962962
' <a class="dropdown-item active" href="#dropdown1" id="dropdown1-tab" data-bs-toggle="tab">@fat</a>',
963963
' <a class="dropdown-item" href="#dropdown2" id="dropdown2-tab" data-bs-toggle="tab">@mdo</a>',
@@ -979,7 +979,7 @@ describe('Tab', () => {
979979
'<ul class="nav nav-tabs" id="nav1">',
980980
' <li class="nav-item active"><a class="nav-link" href="#home" data-bs-toggle="tab">Home</a></li>',
981981
' <li class="nav-item dropdown">',
982-
' <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">Dropdown</a>',
982+
' <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>',
983983
' <div class="dropdown-menu">',
984984
' <a class="dropdown-item" href="#dropdown1" id="dropdown1-tab" data-bs-toggle="tab">@fat</a>',
985985
' </div>',
@@ -990,7 +990,7 @@ describe('Tab', () => {
990990
'<ul class="nav nav-tabs" id="nav2">',
991991
' <li class="nav-item active"><a class="nav-link" href="#home" data-bs-toggle="tab">Home</a></li>',
992992
' <li class="nav-item dropdown">',
993-
' <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">Dropdown</a>',
993+
' <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>',
994994
' <div class="dropdown-menu">',
995995
' <a class="dropdown-item" href="#dropdown1" id="dropdown1-tab" data-bs-toggle="tab">@fat</a>',
996996
' </div>',
@@ -1015,7 +1015,7 @@ describe('Tab', () => {
10151015
' <li class="nav-item"><a class="nav-link active" href="#home" data-bs-toggle="tab">Home</a></li>',
10161016
' <li class="nav-item"><a class="nav-link" href="#profile" data-bs-toggle="tab">Profile</a></li>',
10171017
' <li class="nav-item dropdown">',
1018-
' <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">Dropdown</a>',
1018+
' <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>',
10191019
' <ul class="dropdown-menu">',
10201020
' <li><a class="dropdown-item" href="#dropdown1" id="dropdown1-tab" data-bs-toggle="tab">@fat</a></li>',
10211021
' <li><a class="dropdown-item" href="#dropdown2" id="dropdown2-tab" data-bs-toggle="tab">@mdo</a></li>',

‎js/tests/visual/dropdown.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ <h1>Dropdown <small>Bootstrap Visual Test</small></h1>
2828
<a class="nav-link" href="#">Link</a>
2929
</li>
3030
<li class="nav-item dropdown">
31-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
31+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
3232
<ul class="dropdown-menu">
3333
<li><a class="dropdown-item" href="#">Action</a></li>
3434
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -50,7 +50,7 @@ <h1>Dropdown <small>Bootstrap Visual Test</small></h1>
5050
<a class="nav-link" href="#">Link</a>
5151
</li>
5252
<li class="nav-item dropdown">
53-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
53+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
5454
<ul class="dropdown-menu">
5555
<li><a class="dropdown-item" href="#">Action</a></li>
5656
<li><a class="dropdown-item" href="#">Another action</a></li>

‎js/tests/visual/scrollspy.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
<a class="nav-link" href="#mdo">@mdo</a>
2525
</li>
2626
<li class="nav-item dropdown">
27-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
27+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
2828
<ul class="dropdown-menu">
2929
<li><a class="dropdown-item" href="#one">One</a></li>
3030
<li><a class="dropdown-item" href="#two">Two</a></li>

‎site/src/assets/examples/cheatsheet-rtl/index.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1428,7 +1428,7 @@ import Placeholder from "@shortcodes/Placeholder.astro"
14281428
<a class="nav-link" href="#mdo"><bdi lang="en" dir="ltr">@mdo</bdi></a>
14291429
</li>
14301430
<li class="nav-item dropdown">
1431-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false">قائمة منسدلة</a>
1431+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">قائمة منسدلة</a>
14321432
<ul class="dropdown-menu">
14331433
<li><a class="dropdown-item" href="#one">واحد</a></li>
14341434
<li><a class="dropdown-item" href="#two">اثنان</a></li>

‎site/src/assets/examples/cheatsheet/index.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1404,7 +1404,7 @@ export const body_class = 'bg-body-tertiary'
14041404
<a class="nav-link" href="#scrollspyHeading2">Second</a>
14051405
</li>
14061406
<li class="nav-item dropdown">
1407-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false">Dropdown</a>
1407+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
14081408
<ul class="dropdown-menu">
14091409
<li><a class="dropdown-item" href="#scrollspyHeading3">Third</a></li>
14101410
<li><a class="dropdown-item" href="#scrollspyHeading4">Fourth</a></li>

‎site/src/assets/examples/headers/index.astro‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,7 @@ export const extra_css = ['headers.css']
136136
</form>
137137

138138
<div class="dropdown text-end">
139-
<a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
139+
<a class="d-block link-body-emphasis text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
140140
<img src="/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
141141
</a>
142142
<ul class="dropdown-menu text-small">
@@ -156,7 +156,7 @@ export const extra_css = ['headers.css']
156156
<header class="py-3 mb-3 border-bottom">
157157
<div class="container-fluid d-grid gap-3 align-items-center" style="grid-template-columns: 1fr 2fr;">
158158
<div class="dropdown">
159-
<a href="#" class="d-flex align-items-center col-lg-4 mb-2 mb-lg-0 link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" aria-label="Bootstrap menu">
159+
<a class="d-flex align-items-center col-lg-4 mb-2 mb-lg-0 link-body-emphasis text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false" aria-label="Bootstrap menu">
160160
<svg class="bi me-2" width="40" height="32" aria-hidden="true"><use xlink:href="#bootstrap"/></svg>
161161
</a>
162162
<ul class="dropdown-menu text-small shadow">
@@ -176,7 +176,7 @@ export const extra_css = ['headers.css']
176176
</form>
177177

178178
<div class="flex-shrink-0 dropdown">
179-
<a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
179+
<a class="d-block link-body-emphasis text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
180180
<img src="/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
181181
</a>
182182
<ul class="dropdown-menu text-small shadow">

‎site/src/assets/examples/navbar-bottom/index.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export const title = 'Bottom navbar example'
2929
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
3030
</li>
3131
<li class="nav-item dropup">
32-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropup</a>
32+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropup</a>
3333
<ul class="dropdown-menu">
3434
<li><a class="dropdown-item" href="#">Action</a></li>
3535
<li><a class="dropdown-item" href="#">Another action</a></li>

‎site/src/assets/examples/navbars/index.astro‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export const extra_css = ['navbars.css']
2525
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
2626
</li>
2727
<li class="nav-item dropdown">
28-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
28+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
2929
<ul class="dropdown-menu">
3030
<li><a class="dropdown-item" href="#">Action</a></li>
3131
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -82,7 +82,7 @@ export const extra_css = ['navbars.css']
8282
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
8383
</li>
8484
<li class="nav-item dropdown">
85-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
85+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
8686
<ul class="dropdown-menu">
8787
<li><a class="dropdown-item" href="#">Action</a></li>
8888
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -116,7 +116,7 @@ export const extra_css = ['navbars.css']
116116
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
117117
</li>
118118
<li class="nav-item dropdown">
119-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
119+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
120120
<ul class="dropdown-menu">
121121
<li><a class="dropdown-item" href="#">Action</a></li>
122122
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -150,7 +150,7 @@ export const extra_css = ['navbars.css']
150150
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
151151
</li>
152152
<li class="nav-item dropdown">
153-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
153+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
154154
<ul class="dropdown-menu">
155155
<li><a class="dropdown-item" href="#">Action</a></li>
156156
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -184,7 +184,7 @@ export const extra_css = ['navbars.css']
184184
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
185185
</li>
186186
<li class="nav-item dropdown">
187-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
187+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
188188
<ul class="dropdown-menu">
189189
<li><a class="dropdown-item" href="#">Action</a></li>
190190
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -218,7 +218,7 @@ export const extra_css = ['navbars.css']
218218
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
219219
</li>
220220
<li class="nav-item dropdown">
221-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
221+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
222222
<ul class="dropdown-menu">
223223
<li><a class="dropdown-item" href="#">Action</a></li>
224224
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -252,7 +252,7 @@ export const extra_css = ['navbars.css']
252252
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
253253
</li>
254254
<li class="nav-item dropdown">
255-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
255+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
256256
<ul class="dropdown-menu">
257257
<li><a class="dropdown-item" href="#">Action</a></li>
258258
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -286,7 +286,7 @@ export const extra_css = ['navbars.css']
286286
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
287287
</li>
288288
<li class="nav-item dropdown">
289-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
289+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
290290
<ul class="dropdown-menu">
291291
<li><a class="dropdown-item" href="#">Action</a></li>
292292
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -323,7 +323,7 @@ export const extra_css = ['navbars.css']
323323
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
324324
</li>
325325
<li class="nav-item dropdown">
326-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
326+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
327327
<ul class="dropdown-menu">
328328
<li><a class="dropdown-item" href="#">Action</a></li>
329329
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -355,7 +355,7 @@ export const extra_css = ['navbars.css']
355355
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
356356
</li>
357357
<li class="nav-item dropdown">
358-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
358+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
359359
<ul class="dropdown-menu">
360360
<li><a class="dropdown-item" href="#">Action</a></li>
361361
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -388,7 +388,7 @@ export const extra_css = ['navbars.css']
388388
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
389389
</li>
390390
<li class="nav-item dropdown">
391-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
391+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
392392
<ul class="dropdown-menu">
393393
<li><a class="dropdown-item" href="#">Action</a></li>
394394
<li><a class="dropdown-item" href="#">Another action</a></li>
@@ -419,7 +419,7 @@ export const extra_css = ['navbars.css']
419419
<a class="nav-link disabled" aria-disabled="true">Disabled</a>
420420
</li>
421421
<li class="nav-item dropdown">
422-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
422+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Dropdown</a>
423423
<ul class="dropdown-menu">
424424
<li><a class="dropdown-item" href="#">Action</a></li>
425425
<li><a class="dropdown-item" href="#">Another action</a></li>

‎site/src/assets/examples/offcanvas-navbar/index.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ import Placeholder from "@shortcodes/Placeholder.astro"
3131
<a class="nav-link" href="#">Switch account</a>
3232
</li>
3333
<li class="nav-item dropdown">
34-
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">Settings</a>
34+
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Settings</a>
3535
<ul class="dropdown-menu">
3636
<li><a class="dropdown-item" href="#">Action</a></li>
3737
<li><a class="dropdown-item" href="#">Another action</a></li>

‎site/src/assets/examples/sidebars/index.astro‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ export const extra_js = [{src: 'sidebars.js'}]
7171
</ul>
7272
<hr>
7373
<div class="dropdown">
74-
<a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
74+
<a class="d-flex align-items-center text-white text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
7575
<img src="/mdo.png" alt="" width="32" height="32" class="rounded-circle me-2">
7676
<strong>mdo</strong>
7777
</a>
@@ -127,7 +127,7 @@ export const extra_js = [{src: 'sidebars.js'}]
127127
</ul>
128128
<hr>
129129
<div class="dropdown">
130-
<a href="#" class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
130+
<a class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
131131
<img src="/mdo.png" alt="" width="32" height="32" class="rounded-circle me-2">
132132
<strong>mdo</strong>
133133
</a>
@@ -176,7 +176,7 @@ export const extra_js = [{src: 'sidebars.js'}]
176176
</li>
177177
</ul>
178178
<div class="dropdown border-top">
179-
<a href="#" class="d-flex align-items-center justify-content-center p-3 link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
179+
<a class="d-flex align-items-center justify-content-center p-3 link-body-emphasis text-decoration-none dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
180180
<img src="/mdo.png" alt="mdo" width="24" height="24" class="rounded-circle">
181181
</a>
182182
<ul class="dropdown-menu text-small shadow">

0 commit comments

Comments
 (0)