https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 --- Comment #1 from Laura Escamilla <Laura.escamilla@bywatersolutions.com> --- Created attachment 196711 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=196711&action=edit Bug 42235: Add accessible label to DataTables control column in OPAC messaging The OPAC messaging table includes a DataTables responsive control column with no header text. This results in an empty <th> element and an empty aria-label, which is flagged by accessibility tools. Add a translated "Expand" label to the control column header so it has meaningful accessible text. Test plan: 1. Log in to the OPAC 2. Go to "Your messaging settings" 3. Inspect the messaging table header 4. Confirm the control column header contains no text Apply the patch: 5. Reload the page 6. Confirm the control column header contains "Expand" 7. Confirm responsive row expansion still works 8. Run an accessibility checker and confirm the error is resolved 9. Sign off and have a wonderful day! -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #196711|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Text to go in the| |This fixes an accessibility release notes| |issue with the patron's | |OPAC messaging table (OPAC | |> [log in] > Your account > | |Messaging): "Table header | |text should not be empty". | | | |Previously when responsive | |table controls were shown | |for the table (a green "+" | |button is shown when the | |browser window is narrower | |and all the columns can't | |be displayed), there was no | |title for the column header | |with the controls. | | | |Now, the column header has | |the text "Expand" when the | |responsive controls are | |shown. CC| |david@davidnind.com --- Comment #3 from David Nind <david@davidnind.com> --- Testing notes (using KTD): 1. So that the responsive table control is shown (a green button with +), set SMSSendDriver to Email. The OPAC Messaging table now has an SMS column. When you narrow the browser screen width, the responsive table control is now visible. 2. Before the patch, inspecting the HTML source: ... <th class="dtr-control-col dtr-control dt-orderable-none" data-dt-column="5" rowspan="1" colspan="1" aria-label="" style=""> <span class="dt-column-title"></span> <span class="dt-column-order"></span> </th> ... 3. Before the patch, using axe DevTools, there are two issues for "Table header text should not be empty". (There are also oyther issues.) 4. After the patch, inspecting the HTML source: ... <th class="dtr-control-col dtr-control dt-orderable-none" data-dt-column="5" rowspan="1" colspan="1" aria-label="Expand" style=""> <span class="dt-column-title">Expand</span> <span class="dt-column-order"></span> </th> ... 5. Has "Expand" as the column title. 6. Before the Note: There are still other accessibility issues, including that the first column header for the messaging table is empty. -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 Lucas Gass (lukeg) <lucas@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- QA Contact|testopia@bugs.koha-communit |lucas@bywatersolutions.com |y.org | -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 Laura Escamilla <Laura.escamilla@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #197117|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 --- Comment #6 from Laura Escamilla <Laura.escamilla@bywatersolutions.com> --- Created attachment 201338 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=201338&action=edit Bug 42235: Add message type header to OPAC messaging table The OPAC messaging table includes an empty first column header. This column contains the message type, such as Item due, Advance notice, Hold filled, and Auto renewal. Because the header only contains a non-breaking space, it is flagged by accessibility tools as an empty <th> element. Add a translated "Message type" label to the first column header so it has meaningful accessible text. Test plan: 1. Log in to the OPAC 2. Go to "Your messaging settings" 3. Inspect the messaging table header 4. Confirm the first column header contains no meaningful text Apply the patch: 5. Reload the page 6. Confirm the first column header contains "Message type" 7. Confirm the messaging table still displays correctly 8. Run an accessibility checker and confirm the empty table header error is resolved 9. Sign off and have a wonderful day! :D -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Needs Signoff |Signed Off -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 --- Comment #8 from David Nind <david@davidnind.com> --- Created attachment 201402 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=201402&action=edit Bug 42235: Add accessible label to DataTables control column in OPAC messaging The OPAC messaging table includes a DataTables responsive control column with no header text. This results in an empty <th> element and an empty aria-label, which is flagged by accessibility tools. Add a translated "Expand" label to the control column header so it has meaningful accessible text. Test plan: 1. Log in to the OPAC 2. Go to "Your messaging settings" 3. Inspect the messaging table header 4. Confirm the control column header contains no text Apply the patch: 5. Reload the page 6. Confirm the control column header contains "Expand" 7. Confirm responsive row expansion still works 8. Run an accessibility checker and confirm the error is resolved 9. Sign off and have a wonderful day! Signed-off-by: David Nind <david@davidnind.com> -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42235 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Text to go in the|This fixes an accessibility |This fixes two release notes|issue with the patron's |accessibility issues with |OPAC messaging table (OPAC |the patron's OPAC messaging |> [log in] > Your account > |table (OPAC > [log in] > |Messaging): "Table header |Your account > Messaging): |text should not be empty". |"Table header text should | |not be empty". |Previously when responsive | |table controls were shown |Previously: |for the table (a green "+" |1. The first column header |button is shown when the |has no text. |browser window is narrower |2. When responsive table |and all the columns can't |controls were shown for the |be displayed), there was no |table, there was no title |title for the column header |in the last column header |with the controls. |with the controls (a green | |"+" button is shown when |Now, the column header has |the browser window is |the text "Expand" when the |narrower and all the |responsive controls are |columns can't be |shown. |displayed). | | | |Now: | |1. The first column header | |now has the text "Message | |type". | |2. The responsive table | |control column header has | |the text "Expand" when the | |responsive controls are | |shown. --- Comment #10 from David Nind <david@davidnind.com> --- Updated testing notes (using KTD): First patch - Responsible table control column ---------------------------------------------- 1. So that the responsive table controls are shown (a green button with +), set SMSSendDriver to Email. The OPAC Messaging table now has an SMS column. When you narrow the browser screen width, the responsive table controls are now shown. 2. Before the patch, inspecting the HTML source: ... <th class="dtr-control-col dtr-control dt-orderable-none" data-dt-column="5" rowspan="1" colspan="1" style=""> <div class="dt-column-header"> <span class="dt-column-title"></span> <span class="dt-column-order"></span> </div> </th> ... 3. Before the patch, using axe DevTools, there is one issue (when on a narrower browser window size with the responsive table control visible) for "Table header text should not be empty". 4. After the patch, inspecting the HTML source: ... <th class="dtr-control-col dtr-control dt-orderable-none" data-dt-column="5" rowspan="1" colspan="1" style=""> <div class="dt-column-header"> <span class="dt-column-title">Expand</span> <span class="dt-column-order"></span> </div> </th> ... 5. Has "Expand" as the column title. Second patch - First column header ---------------------------------- 6. Before the patch, inspecting the HTML source: ... <div class="dt-column-header"> <span class="dt-column-title"> </span> <span class="dt-column-order" role="button" aria-label=" : Activate to invert sorting" tabindex="0"></span> </div> ... 7. axe DevTools didn't identify any issues (showing that automated tools don't always pick up everything!). 8. After the patch: <div class="dt-column-header"> <span class="dt-column-title">Message type</span> <span class="dt-column-order" role="button" aria-label="Message type: Activate to invert sorting" tabindex="0"></span> </div> -- You are receiving this mail because: You are watching all bug changes.