Summary: | DataTables expand button has no label | ||
---|---|---|---|
Product: | Koha | Reporter: | Jake Deery <jake.deery> |
Component: | Accessibility | Assignee: | Laura Escamilla <Laura.escamilla> |
Status: | Signed Off --- | QA Contact: | Testopia <testopia> |
Severity: | enhancement | ||
Priority: | P5 - low | CC: | david, edith.speller, jonathan.druart, Laura.escamilla, martin.renvoize, matt.blenkinsop, oleonard |
Version: | Main | ||
Hardware: | All | ||
OS: | All | ||
GIT URL: | Change sponsored?: | --- | |
Patch complexity: | --- | Documentation contact: | |
Documentation submission: | Text to go in the release notes: | ||
Version(s) released in: | Circulation function: | ||
Attachments: |
Bug 38642: Added title and label to the expand row button
Bug 38642: [Alternate] DataTables expand button has no label Bug 38642: [Alternate] DataTables expand button has no label Bug 38642: [Alternate] DataTables expand button has no label |
Description
Jake Deery
2024-12-06 10:15:18 UTC
Created attachment 184685 [details] [review] Bug 38642: Added title and label to the expand row button To test: 1. Apply the patch * Restart all relevant services (e.g., Plack, Apache) to ensure changes take effect. 2. Navigate to a record’s detail page * Example URL: /cgi-bin/koha/opac-detail.pl?biblionumber=51&query_desc=kw%2Cwrdl%3A code 3. Inspect the holdings table * Locate the expand/collapse button (the first cell in each row, with class dtr-control). 4. Check the accessibility attributes * Right-click on the expand button > Inspect Element (in browser dev tools). * Confirm the following are present on the <td>: * title="Expand or collapse row details" * aria-label="Expand or collapse row details" * tabindex="0" 5. Sign off and have an incredible day! :D Created attachment 184752 [details] [review] Bug 38642: [Alternate] DataTables expand button has no label This patch modifies the OPAC's DataTables JS so that any table heading with a "dtr-control-col" will trigger the application of title and aria-label attributes on the responsive controls column. All OPAC tables with a responsive configuration have been modified with the class. To test, apply the patch and check all affected tables. - Narrow the width of the browser window until the responsive functionality is triggered. - Check that the expand/collapse button has title and aria-label attributes, "Expand or collapse row details" - Authority search results - Course reserves - List of courses - Course reserves - List of titles for a course - Bibliographic detail page: - Holdsings - Subscriptions - Search history - Bibliographic, past and present - Authorities, past and present - Most popular titles - Logged in user's active clubs - Logged in user's scheduled curbside pickups - Logged in user's recalls history - Logged in user's checkout history - Logged in user's messaging settings - Logged in user's submitted tags Sponsored-by: Athens County Public Libraries Sorry to be a busybody, I just thought we needed a solution which didn't require us to modify the DT configuration for all responsive DataTables. Owen, + .attr("aria-label", "Expand or collapse row details") + .attr("title", "Expand or collapse row details"); You need to use __("") to make the strings translatable. (In reply to Jonathan Druart from comment #4) > You need to use __("") to make the strings translatable. I know better than to make that mistake!! Created attachment 184793 [details] [review] Bug 38642: [Alternate] DataTables expand button has no label This patch modifies the OPAC's DataTables JS so that any table heading with a "dtr-control-col" will trigger the application of title and aria-label attributes on the responsive controls column. All OPAC tables with a responsive configuration have been modified with the class. To test, apply the patch and check all affected tables. - Narrow the width of the browser window until the responsive functionality is triggered. - Check that the expand/collapse button has title and aria-label attributes, "Expand or collapse row details" - Authority search results - Course reserves - List of courses - Course reserves - List of titles for a course - Bibliographic detail page: - Holdsings - Subscriptions - Search history - Bibliographic, past and present - Authorities, past and present - Most popular titles - Logged in user's active clubs - Logged in user's scheduled curbside pickups - Logged in user's recalls history - Logged in user's checkout history - Logged in user's messaging settings - Logged in user's submitted tags Sponsored-by: Athens County Public Libraries Created attachment 185310 [details] [review] Bug 38642: [Alternate] DataTables expand button has no label This patch modifies the OPAC's DataTables JS so that any table heading with a "dtr-control-col" will trigger the application of title and aria-label attributes on the responsive controls column. All OPAC tables with a responsive configuration have been modified with the class. To test, apply the patch and check all affected tables. - Narrow the width of the browser window until the responsive functionality is triggered. - Check that the expand/collapse button has title and aria-label attributes, "Expand or collapse row details" - Authority search results - Course reserves - List of courses - Course reserves - List of titles for a course - Bibliographic detail page: - Holdsings - Subscriptions - Search history - Bibliographic, past and present - Authorities, past and present - Most popular titles - Logged in user's active clubs - Logged in user's scheduled curbside pickups - Logged in user's recalls history - Logged in user's checkout history - Logged in user's messaging settings - Logged in user's submitted tags Sponsored-by: Athens County Public Libraries Signed-off-by: Jake Deery <jake.deery@openfifth.co.uk> I like reduced repetition..! Signed off :-) Jake. |