From ba32b852e5c33fd9cfbb9eca31aae348dbce5630 Mon Sep 17 00:00:00 2001 From: Shamim Rezaie Date: Mon, 20 Jun 2022 12:05:27 +1000 Subject: [PATCH] MDL-68550 output: Improve accessibility of the initials bar - The current item should be focusable otherwise the focus will be lost as soon as a user clicks on an item in the initials bar - Modified behat tests to not mistakenly click on the 'All' link - The currently selected item is specified by aria-current - Useed aria-current=true rather than =page because the links of each item in the initials bar is missing the pagination information --- lib/templates/initials_bar.mustache | 21 +++++---------------- lib/tests/behat/alpha_chooser.feature | 16 ++++++++-------- 2 files changed, 13 insertions(+), 24 deletions(-) diff --git a/lib/templates/initials_bar.mustache b/lib/templates/initials_bar.mustache index ab87624b664..6b43f92b176 100644 --- a/lib/templates/initials_bar.mustache +++ b/lib/templates/initials_bar.mustache @@ -78,29 +78,18 @@
{{#group}} {{/group}}
- diff --git a/lib/tests/behat/alpha_chooser.feature b/lib/tests/behat/alpha_chooser.feature index 05437a39000..4de5a10c494 100644 --- a/lib/tests/behat/alpha_chooser.feature +++ b/lib/tests/behat/alpha_chooser.feature @@ -77,7 +77,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should see "Cstudent Cstudent" - And I click on "A" "link" in the ".initialbar.lastinitial" "css_element" + And I click on "A" "link" in the ".initialbar.lastinitial .page-item.A" "css_element" And ".initialbarall.page-item.active" "css_element" should exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" @@ -85,7 +85,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should not see "Cstudent Cstudent" - And I click on "B" "link" in the ".initialbar.firstinitial" "css_element" + And I click on "B" "link" in the ".initialbar.firstinitial .page-item.B" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should exist in the ".initialbar.firstinitial" "css_element" @@ -133,7 +133,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should see "Cstudent Cstudent" - And I click on "A" "link" in the ".initialbar.lastinitial" "css_element" + And I click on "A" "link" in the ".initialbar.lastinitial .page-item.A" "css_element" And ".initialbarall.page-item.active" "css_element" should exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" @@ -141,7 +141,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should not see "Cstudent Cstudent" - And I click on "B" "link" in the ".initialbar.firstinitial" "css_element" + And I click on "B" "link" in the ".initialbar.firstinitial .page-item.B" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should exist in the ".initialbar.firstinitial" "css_element" @@ -193,7 +193,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should see "Cstudent Cstudent" - And I click on "A" "link" in the ".initialbar.lastinitial" "css_element" + And I click on "A" "link" in the ".initialbar.lastinitial .page-item.A" "css_element" And ".initialbarall.page-item.active" "css_element" should exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" @@ -201,7 +201,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should not see "Cstudent Cstudent" - And I click on "B" "link" in the ".initialbar.firstinitial" "css_element" + And I click on "B" "link" in the ".initialbar.firstinitial .page-item.B" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should exist in the ".initialbar.firstinitial" "css_element" @@ -259,7 +259,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should see "Cstudent Cstudent" - And I click on "A" "link" in the ".initialbar.lastinitial" "css_element" + And I click on "A" "link" in the ".initialbar.lastinitial .page-item.A" "css_element" And ".initialbarall.page-item.active" "css_element" should exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" @@ -267,7 +267,7 @@ Feature: Initials bar And I should see "Astudent Astudent" And I should see "Bstudent Astudent" And I should not see "Cstudent Cstudent" - And I click on "B" "link" in the ".initialbar.firstinitial" "css_element" + And I click on "B" "link" in the ".initialbar.firstinitial .page-item.B" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.firstinitial" "css_element" And ".initialbarall.page-item.active" "css_element" should not exist in the ".initialbar.lastinitial" "css_element" And ".page-item.active.B" "css_element" should exist in the ".initialbar.firstinitial" "css_element"