Bugzilla – Attachment 179385 Details for
Bug 39209
Cookie consent banner should be 'focused' on load
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 39209: Set cookie consent bar as first focus
Bug-39209-Set-cookie-consent-bar-as-first-focus.patch (text/plain), 2.84 KB, created by
Jonathan Druart
on 2025-03-17 10:57:39 UTC
(
hide
)
Description:
Bug 39209: Set cookie consent bar as first focus
Filename:
MIME Type:
Creator:
Jonathan Druart
Created:
2025-03-17 10:57:39 UTC
Size:
2.84 KB
patch
obsolete
>From c867c67972fdc6d076c29c72ba62b5bcfc08901f Mon Sep 17 00:00:00 2001 >From: Martin Renvoize <martin.renvoize@ptfs-europe.com> >Date: Thu, 27 Feb 2025 15:40:18 +0000 >Subject: [PATCH] Bug 39209: Set cookie consent bar as first focus > >This patch updates the cookie consent javascript, when the feature is >enabled, to ensure that the cookie consent bar gets focused when it >displays. > >Test plan >1) Enable the CookieConsent preference >2) Open any OPAC page >3) Hit 'tab' and note the display of 'Skip to main content' >4) Confirm that the cookie consent bar is displayed and continued 'tabs' > eventually navigate to it >5) Apply this patch >6) Navigate to any OPAC page >7) Hit 'tab' and note that the 'Cookie consent' bar is focused, your > keyboard navigation starts with the cookie consent buttons >8) Accept the essential cookies >9) Hit tab and note the focus is back to normal and shows the 'Skip to > main content' button on first keyboard navigation. > >Signed-off-by: Owen Leonard <oleonard@myacpl.org> > >Amended-by: Jonathan Druart >Run tidy.pl >--- > .../opac-tmpl/bootstrap/js/cookieconsent.js | 24 +++++++++++++++++++ > 1 file changed, 24 insertions(+) > >diff --git a/koha-tmpl/opac-tmpl/bootstrap/js/cookieconsent.js b/koha-tmpl/opac-tmpl/bootstrap/js/cookieconsent.js >index e77146d7d5d..3d7d6074758 100644 >--- a/koha-tmpl/opac-tmpl/bootstrap/js/cookieconsent.js >+++ b/koha-tmpl/opac-tmpl/bootstrap/js/cookieconsent.js >@@ -71,12 +71,36 @@ > const consentBar = $("#cookieConsentBar"); > consentBar.attr("aria-hidden", "false"); > consentBar.css("display", "flex"); >+ >+ // Set focus to the first focusable element within the consent bar >+ const firstFocusableElement = consentBar >+ .find("a, button, input, select, textarea") >+ .filter(":visible") >+ .first(); >+ if (firstFocusableElement.length) { >+ firstFocusableElement.focus(); >+ } else { >+ // If no focusable elements exist, add tabindex to the bar itself to make it focusable >+ consentBar.attr("tabindex", "-1").focus(); >+ } > } > > function hideConsentBar() { > const consentBar = $("#cookieConsentBar"); > consentBar.attr("aria-hidden", "true"); > consentBar.hide(); >+ >+ // Remove focus from any currently focused element >+ if (document.activeElement) { >+ document.activeElement.blur(); >+ } >+ >+ // Set focus to the body, which effectively removes visible focus indicators >+ // This allows the first Tab press to highlight the "Skip to main content" link >+ document.body.focus(); >+ document.querySelector("body").setAttribute("tabindex", "-1"); >+ document.querySelector("body").focus(); >+ document.querySelector("body").removeAttribute("tabindex"); > } > > // Hides the appropriate consent container, depending on what >-- >2.34.1
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 39209
:
178786
|
178894
|
179385
|
180385