Skip to content

Commit 7abf1b4

Browse files
fix: update pagination button aria-label (#1017)
* fix: update pagination button aria-label * fix:updated snapshots --------- Co-authored-by: ypatadia-eightfold <ypatadia@eightfold.ai>
1 parent ceba97f commit 7abf1b4

File tree

10 files changed

+73
-55
lines changed

10 files changed

+73
-55
lines changed

src/components/Carousel/Tests/__snapshots__/Slide.test.tsx.snap

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ exports[`Slide loads and displays Carousel component 1`] = `
3939
<button
4040
aria-current="true"
4141
aria-disabled="false"
42-
aria-label="page 1"
42+
aria-label="page 1 of 3"
4343
class="pagination-button active button button-neutral button-medium"
4444
>
4545
<span
@@ -53,7 +53,7 @@ exports[`Slide loads and displays Carousel component 1`] = `
5353
<button
5454
aria-current="false"
5555
aria-disabled="false"
56-
aria-label="page 2"
56+
aria-label="page 2 of 3"
5757
class="pagination-button button button-neutral button-medium"
5858
>
5959
<span
@@ -67,7 +67,7 @@ exports[`Slide loads and displays Carousel component 1`] = `
6767
<button
6868
aria-current="false"
6969
aria-disabled="false"
70-
aria-label="page 3"
70+
aria-label="page 3 of 3"
7171
class="pagination-button button button-neutral button-medium"
7272
>
7373
<span

src/components/Pagination/Pager.tsx

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,13 @@ export const Pager: FC<PagerProps> = React.forwardRef(
178178
themeContainerId={themeContainerId}
179179
variant={ButtonVariant.Neutral}
180180
ariaLabel={
181-
locale.lang.pageSizeText + ' ' + '1'.toLocaleString()
181+
locale.lang.pageSizeText +
182+
' ' +
183+
'1'.toLocaleString() +
184+
' ' +
185+
locale.lang.pagerText +
186+
' ' +
187+
pageCount.toLocaleString()
182188
}
183189
/>
184190
) : (
@@ -245,7 +251,13 @@ export const Pager: FC<PagerProps> = React.forwardRef(
245251
themeContainerId={themeContainerId}
246252
variant={ButtonVariant.Neutral}
247253
ariaLabel={
248-
locale.lang.pageSizeText + ' ' + pager.toLocaleString()
254+
locale.lang.pageSizeText +
255+
' ' +
256+
pager.toLocaleString() +
257+
' ' +
258+
locale.lang.pagerText +
259+
' ' +
260+
pageCount.toLocaleString()
249261
}
250262
/>
251263
</li>
@@ -304,7 +316,13 @@ export const Pager: FC<PagerProps> = React.forwardRef(
304316
themeContainerId={themeContainerId}
305317
variant={ButtonVariant.Neutral}
306318
ariaLabel={
307-
locale.lang.pageSizeText + ' ' + pageCount.toLocaleString()
319+
locale.lang.pageSizeText +
320+
' ' +
321+
pageCount.toLocaleString() +
322+
' ' +
323+
locale.lang.pagerText +
324+
' ' +
325+
pageCount.toLocaleString()
308326
}
309327
/>
310328
</li>

src/components/Pagination/__snapshots__/Pagination.test.tsx.snap

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ exports[`Pagination Pagination should render as dots 1`] = `
3737
<button
3838
aria-current="true"
3939
aria-disabled="false"
40-
aria-label="page 1"
40+
aria-label="page 1 of 5"
4141
class="pagination-button active button button-neutral button-medium"
4242
>
4343
<span
@@ -51,7 +51,7 @@ exports[`Pagination Pagination should render as dots 1`] = `
5151
<button
5252
aria-current="false"
5353
aria-disabled="false"
54-
aria-label="page 2"
54+
aria-label="page 2 of 5"
5555
class="pagination-button button button-neutral button-medium"
5656
>
5757
<span
@@ -65,7 +65,7 @@ exports[`Pagination Pagination should render as dots 1`] = `
6565
<button
6666
aria-current="false"
6767
aria-disabled="false"
68-
aria-label="page 3"
68+
aria-label="page 3 of 5"
6969
class="pagination-button button button-neutral button-medium"
7070
>
7171
<span
@@ -79,7 +79,7 @@ exports[`Pagination Pagination should render as dots 1`] = `
7979
<button
8080
aria-current="false"
8181
aria-disabled="false"
82-
aria-label="page 4"
82+
aria-label="page 4 of 5"
8383
class="pagination-button button button-neutral button-medium"
8484
>
8585
<span
@@ -93,7 +93,7 @@ exports[`Pagination Pagination should render as dots 1`] = `
9393
<button
9494
aria-current="false"
9595
aria-disabled="false"
96-
aria-label="page 5"
96+
aria-label="page 5 of 5"
9797
class="pagination-button button button-neutral button-medium"
9898
>
9999
<span
@@ -240,7 +240,7 @@ exports[`Pagination Pagination should render normally 1`] = `
240240
<button
241241
aria-current="true"
242242
aria-disabled="false"
243-
aria-label="page 1"
243+
aria-label="page 1 of 5"
244244
class="pagination-button active button button-neutral button-medium"
245245
>
246246
<span
@@ -254,7 +254,7 @@ exports[`Pagination Pagination should render normally 1`] = `
254254
<button
255255
aria-current="false"
256256
aria-disabled="false"
257-
aria-label="page 2"
257+
aria-label="page 2 of 5"
258258
class="pagination-button button button-neutral button-medium"
259259
>
260260
<span
@@ -268,7 +268,7 @@ exports[`Pagination Pagination should render normally 1`] = `
268268
<button
269269
aria-current="false"
270270
aria-disabled="false"
271-
aria-label="page 3"
271+
aria-label="page 3 of 5"
272272
class="pagination-button button button-neutral button-medium"
273273
>
274274
<span
@@ -282,7 +282,7 @@ exports[`Pagination Pagination should render normally 1`] = `
282282
<button
283283
aria-current="false"
284284
aria-disabled="false"
285-
aria-label="page 4"
285+
aria-label="page 4 of 5"
286286
class="pagination-button button button-neutral button-medium"
287287
>
288288
<span
@@ -296,7 +296,7 @@ exports[`Pagination Pagination should render normally 1`] = `
296296
<button
297297
aria-current="false"
298298
aria-disabled="false"
299-
aria-label="page 5"
299+
aria-label="page 5 of 5"
300300
class="pagination-button button button-neutral button-medium"
301301
>
302302
<span
@@ -416,7 +416,7 @@ exports[`Pagination Pagination should render with all elements 1`] = `
416416
<button
417417
aria-current="false"
418418
aria-disabled="false"
419-
aria-label="page 1"
419+
aria-label="page 1 of 4"
420420
class="pagination-button button button-neutral button-medium"
421421
>
422422
<span
@@ -430,7 +430,7 @@ exports[`Pagination Pagination should render with all elements 1`] = `
430430
<button
431431
aria-current="false"
432432
aria-disabled="false"
433-
aria-label="page 2"
433+
aria-label="page 2 of 4"
434434
class="pagination-button button button-neutral button-medium"
435435
>
436436
<span
@@ -444,7 +444,7 @@ exports[`Pagination Pagination should render with all elements 1`] = `
444444
<button
445445
aria-current="false"
446446
aria-disabled="false"
447-
aria-label="page 3"
447+
aria-label="page 3 of 4"
448448
class="pagination-button button button-neutral button-medium"
449449
>
450450
<span
@@ -458,7 +458,7 @@ exports[`Pagination Pagination should render with all elements 1`] = `
458458
<button
459459
aria-current="true"
460460
aria-disabled="false"
461-
aria-label="page 4"
461+
aria-label="page 4 of 4"
462462
class="pagination-button active button button-neutral button-medium"
463463
>
464464
<span
@@ -568,7 +568,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
568568
<button
569569
aria-current="false"
570570
aria-disabled="false"
571-
aria-label="page 1"
571+
aria-label="page 1 of 10"
572572
class="pagination-button button button-neutral button-medium"
573573
>
574574
<span
@@ -582,7 +582,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
582582
<button
583583
aria-current="false"
584584
aria-disabled="false"
585-
aria-label="page 2"
585+
aria-label="page 2 of 10"
586586
class="pagination-button button button-neutral button-medium"
587587
>
588588
<span
@@ -596,7 +596,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
596596
<button
597597
aria-current="false"
598598
aria-disabled="false"
599-
aria-label="page 3"
599+
aria-label="page 3 of 10"
600600
class="pagination-button button button-neutral button-medium"
601601
>
602602
<span
@@ -610,7 +610,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
610610
<button
611611
aria-current="false"
612612
aria-disabled="false"
613-
aria-label="page 4"
613+
aria-label="page 4 of 10"
614614
class="pagination-button button button-neutral button-medium"
615615
>
616616
<span
@@ -624,7 +624,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
624624
<button
625625
aria-current="true"
626626
aria-disabled="false"
627-
aria-label="page 5"
627+
aria-label="page 5 of 10"
628628
class="pagination-button active button button-neutral button-medium"
629629
>
630630
<span
@@ -638,7 +638,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
638638
<button
639639
aria-current="false"
640640
aria-disabled="false"
641-
aria-label="page 6"
641+
aria-label="page 6 of 10"
642642
class="pagination-button button button-neutral button-medium"
643643
>
644644
<span
@@ -652,7 +652,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
652652
<button
653653
aria-current="false"
654654
aria-disabled="false"
655-
aria-label="page 7"
655+
aria-label="page 7 of 10"
656656
class="pagination-button button button-neutral button-medium"
657657
>
658658
<span
@@ -666,7 +666,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
666666
<button
667667
aria-current="false"
668668
aria-disabled="false"
669-
aria-label="page 8"
669+
aria-label="page 8 of 10"
670670
class="pagination-button button button-neutral button-medium"
671671
>
672672
<span
@@ -680,7 +680,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
680680
<button
681681
aria-current="false"
682682
aria-disabled="false"
683-
aria-label="page 9"
683+
aria-label="page 9 of 10"
684684
class="pagination-button button button-neutral button-medium"
685685
>
686686
<span
@@ -694,7 +694,7 @@ exports[`Pagination Pagination should render with some elements 1`] = `
694694
<button
695695
aria-current="false"
696696
aria-disabled="false"
697-
aria-label="page 10"
697+
aria-label="page 10 of 10"
698698
class="pagination-button button button-neutral button-medium"
699699
>
700700
<span

src/components/PersistentBar/__snapshots__/PersistentBar.test.tsx.snap

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ exports[`PersistentBar PersistentBar is topBarPagination 1`] = `
8888
<button
8989
aria-current="true"
9090
aria-disabled="false"
91-
aria-label="page 1"
91+
aria-label="page 1 of 1"
9292
class="pagination-button active button button-neutral button-medium"
9393
>
9494
<span

src/components/Table/Tests/__snapshots__/Table.expand.test.tsx.snap

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3698,7 +3698,7 @@ LoadedCheerio {
36983698
"attribs": Object {
36993699
"aria-current": "true",
37003700
"aria-disabled": "false",
3701-
"aria-label": "page 1",
3701+
"aria-label": "page 1 of 1",
37023702
"class": "pagination-button active button button-neutral button-medium",
37033703
},
37043704
"children": Array [
@@ -3790,7 +3790,7 @@ LoadedCheerio {
37903790
"attribs": Object {
37913791
"aria-current": "true",
37923792
"aria-disabled": "false",
3793-
"aria-label": "page 1",
3793+
"aria-label": "page 1 of 1",
37943794
"class": "pagination-button active button button-neutral button-medium",
37953795
},
37963796
"children": Array [
@@ -3924,7 +3924,7 @@ LoadedCheerio {
39243924
"attribs": Object {
39253925
"aria-current": "true",
39263926
"aria-disabled": "false",
3927-
"aria-label": "page 1",
3927+
"aria-label": "page 1 of 1",
39283928
"class": "pagination-button active button button-neutral button-medium",
39293929
},
39303930
"children": Array [
@@ -4016,7 +4016,7 @@ LoadedCheerio {
40164016
"attribs": Object {
40174017
"aria-current": "true",
40184018
"aria-disabled": "false",
4019-
"aria-label": "page 1",
4019+
"aria-label": "page 1 of 1",
40204020
"class": "pagination-button active button button-neutral button-medium",
40214021
},
40224022
"children": Array [

src/components/Table/Tests/__snapshots__/Table.pagination.accepttrue.shot

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -926,7 +926,7 @@ LoadedCheerio {
926926
"attribs": Object {
927927
"aria-current": "true",
928928
"aria-disabled": "false",
929-
"aria-label": "page 1",
929+
"aria-label": "page 1 of 1",
930930
"class": "pagination-button active button button-neutral button-medium",
931931
},
932932
"children": Array [
@@ -1018,7 +1018,7 @@ LoadedCheerio {
10181018
"attribs": Object {
10191019
"aria-current": "true",
10201020
"aria-disabled": "false",
1021-
"aria-label": "page 1",
1021+
"aria-label": "page 1 of 1",
10221022
"class": "pagination-button active button button-neutral button-medium",
10231023
},
10241024
"children": Array [
@@ -1152,7 +1152,7 @@ LoadedCheerio {
11521152
"attribs": Object {
11531153
"aria-current": "true",
11541154
"aria-disabled": "false",
1155-
"aria-label": "page 1",
1155+
"aria-label": "page 1 of 1",
11561156
"class": "pagination-button active button button-neutral button-medium",
11571157
},
11581158
"children": Array [
@@ -1244,7 +1244,7 @@ LoadedCheerio {
12441244
"attribs": Object {
12451245
"aria-current": "true",
12461246
"aria-disabled": "false",
1247-
"aria-label": "page 1",
1247+
"aria-label": "page 1 of 1",
12481248
"class": "pagination-button active button button-neutral button-medium",
12491249
},
12501250
"children": Array [

0 commit comments

Comments
 (0)