From e29007d67934dbbf628d3255002170bcc0ffb4e7 Mon Sep 17 00:00:00 2001
From: Shamim Rezaie <shamim@moodle.com>
Date: Sat, 18 Jun 2022 18:52:31 +1000
Subject: [PATCH] MDL-68550 output: Improve accessibility of the paging bar

The use of aria-current is based on the example at
https://design-system.w3.org/components/pagination.html
---
 lib/templates/paging_bar.mustache   | 22 +++++++++++++---------
 lib/tests/tablelib_test.php         |  2 +-
 theme/boost/lang/en/deprecated.txt  |  1 +
 theme/boost/lang/en/theme_boost.php |  2 +-
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/lib/templates/paging_bar.mustache b/lib/templates/paging_bar.mustache
index 622285e7c10..845cef6b6cf 100644
--- a/lib/templates/paging_bar.mustache
+++ b/lib/templates/paging_bar.mustache
@@ -54,7 +54,7 @@
         <ul class="mt-1 pagination " data-page-size="{{pagesize}}">
             {{#previous}}
                 <li class="page-item" data-page-number="{{page}}">
-                    <a href="{{url}}" class="page-link" aria-label="{{# str }} previouspage, moodle {{/ str }}">
+                    <a href="{{url}}" class="page-link">
                         <span aria-hidden="true">&laquo;</span>
                         <span class="sr-only">{{#str}}previouspage, moodle{{/str}}</span>
                     </a>
@@ -62,7 +62,10 @@
             {{/previous}}
             {{#first}}
                 <li class="page-item" data-page-number="{{page}}">
-                    <a href="{{url}}" class="page-link">{{page}}</a>
+                    <a href="{{url}}" class="page-link">
+                        <span aria-hidden="true">{{page}}</span>
+                        <span class="sr-only">{{#str}}pagea, moodle, {{page}}{{/str}}</span>
+                    </a>
                 </li>
                 <li class="page-item disabled" data-page-number="{{page}}">
                     <span class="page-link">&hellip;</span>
@@ -70,11 +73,9 @@
             {{/first}}
             {{#pages}}
                 <li class="page-item {{#active}}active{{/active}}" data-page-number="{{page}}">
-                    <a href="{{#url}}{{.}}{{/url}}{{^url}}#{{/url}}" class="page-link">
-                        {{page}}
-                        {{#active}}
-                            <span class="sr-only">{{#str}}currentinparentheses, theme_boost{{/str}}</span>
-                        {{/active}}
+                    <a href="{{#url}}{{.}}{{/url}}{{^url}}#{{/url}}" class="page-link" {{#active}}aria-current="page"{{/active}}>
+                        <span aria-hidden="true">{{page}}</span>
+                        <span class="sr-only">{{#str}}pagea, moodle, {{page}}{{/str}}</span>
                     </a>
                 </li>
             {{/pages}}
@@ -83,12 +84,15 @@
                     <span class="page-link">&hellip;</span>
                 </li>
                 <li class="page-item" data-page-number="{{page}}">
-                    <a href="{{url}}" class="page-link">{{page}}</a>
+                    <a href="{{url}}" class="page-link">
+                        <span aria-hidden="true">{{page}}</span>
+                        <span class="sr-only">{{#str}}pagea, moodle, {{page}}{{/str}}</span>
+                    </a>
                 </li>
             {{/last}}
             {{#next}}
                 <li class="page-item" data-page-number="{{page}}">
-                    <a href="{{url}}" class="page-link" aria-label="{{# str }} nextpage, moodle {{/ str }}">
+                    <a href="{{url}}" class="page-link">
                         <span aria-hidden="true">&raquo;</span>
                         <span class="sr-only">{{#str}}nextpage, moodle{{/str}}</span>
                     </a>
diff --git a/lib/tests/tablelib_test.php b/lib/tests/tablelib_test.php
index d7494cd976f..d0710f99138 100644
--- a/lib/tests/tablelib_test.php
+++ b/lib/tests/tablelib_test.php
@@ -138,7 +138,7 @@ class tablelib_test extends \advanced_testcase {
         $headers = $this->generate_headers(2);
 
         // Search for pagination controls containing 'page-link"\saria-label="Next"'.
-        $this->expectOutputRegex('/page-link"\saria-label="Next page"/');
+        $this->expectOutputRegex('/Next page/');
 
         $this->run_table_test(
             $columns,
diff --git a/theme/boost/lang/en/deprecated.txt b/theme/boost/lang/en/deprecated.txt
index 04956efb9aa..37e07310d8a 100644
--- a/theme/boost/lang/en/deprecated.txt
+++ b/theme/boost/lang/en/deprecated.txt
@@ -1,3 +1,4 @@
 totop,theme_boost
 privacy:drawernavclosed,theme_boost
 privacy:drawernavopen,theme_boost
+currentinparentheses,theme_boost
\ No newline at end of file
diff --git a/theme/boost/lang/en/theme_boost.php b/theme/boost/lang/en/theme_boost.php
index 87d019153eb..0c9bcd19137 100644
--- a/theme/boost/lang/en/theme_boost.php
+++ b/theme/boost/lang/en/theme_boost.php
@@ -32,7 +32,6 @@ $string['brandcolor_desc'] = 'The accent colour.';
 $string['bootswatch'] = 'Bootswatch';
 $string['bootswatch_desc'] = 'A bootswatch is a set of Bootstrap variables and css to style Bootstrap';
 $string['choosereadme'] = 'Boost is a modern highly-customisable theme. This theme is intended to be used directly, or as a parent theme when creating new themes utilising Bootstrap 4.';
-$string['currentinparentheses'] = '(current)';
 $string['configtitle'] = 'Boost';
 $string['generalsettings'] = 'General settings';
 $string['loginbackgroundimage'] = 'Login page background image';
@@ -64,5 +63,6 @@ $string['privacy:drawerblockopen'] = 'The current preference for the block drawe
 $string['totop'] = 'Go to top';
 
 // Deprecated since Moodle 4.1.
+$string['currentinparentheses'] = '(current)';
 $string['privacy:drawernavclosed'] = 'The current preference for the navigation drawer is closed.';
 $string['privacy:drawernavopen'] = 'The current preference for the navigation drawer is open.';