Bug 42231: Fix accessibility issues in OPAC summary table

The OPAC summary page contains several accessibility issues including an unlabeled renew checkbox, unlabeled textarea in the add note modal, and empty headings rendered before JavaScript population.

Test plan:
1. Have a user with checkouts
2. Log into the OPAC and go to "Summary"
3. Notice the renew checkbox does not have a corresponding label
4. Apply the patch
5. Repeat steps 1-2
6. Confirm the renew checkbox now has a corresponding label

Additional accessibility fixes:
7. Open the "Report a problem" modal
8. Confirm the note textarea has a corresponding label
9. Confirm addNoteTitle and suspendHoldTitle are not exposed as empty headings
10. Run an accessibility checker and confirm the related errors are resolved
11. Sign off and have a great day! :D

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Paul Derscheid <paul.derscheid@lmscloud.de>
Signed-off-by: Pedro Amorim <pedro.amorim@openfifth.co.uk>
This commit is contained in:
Laura_Escamilla 2026-04-02 20:01:43 +00:00 committed by Pedro Amorim
parent a7646d86d3
commit bfa3956cd3
No known key found for this signature in database
GPG Key ID: 06B75BA7F3894D55
1 changed files with 7 additions and 3 deletions

View File

@ -443,7 +443,10 @@
[% IF ISSUE.renewed %]<span class="badge text-bg-success">Renewed!</span><br />[% END %]
[% IF ( ISSUE.status ) %]
[% IF ( canrenew ) %]
<input type="checkbox" name="issue" value="[% ISSUE.issue_id | uri %]" />
<label>
<span class="visually-hidden">Select item to renew</span>
<input type="checkbox" name="issue" value="[% ISSUE.issue_id | uri %]" />
</label>
<a class="submit-form-link" href="#" data-method="post" data-action="/cgi-bin/koha/opac-renew.pl" data-issue="[% ISSUE.issue_id | html %]" data-op="cud-renew">Renew</a>
[% END %]
[% IF ISSUE.renewalfee > 0 %]
@ -587,8 +590,9 @@
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" id="addNoteBody">
<h2 id="addNoteTitle"></h2>
<h2 id="addNoteTitle" hidden>Item title</h2>
<input type="hidden" id="addNoteIssueId" name="issue_id" value="" />
<label for="addNote" class="visually-hidden">Note</label>
<textarea name="note" id="addNote" rows="4"></textarea>
<div class="hint">Your note will be shown to the librarian when the item is checked in.</div>
</div>
@ -1037,7 +1041,7 @@
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<h2 id="suspendHoldTitle"></h2>
<h2 id="suspendHoldTitle" hidden>Hold details</h2>
<input type="hidden" name="reserve_id" id="suspendHoldReserveId" value="" />
<label for="suspend_untilDate">Suspend until:</label>
<input type="text" name="suspend_until" id="suspend_untilDate" size="10" />