improve dropdown accessibility

This commit is contained in:
2026-03-12 10:08:09 -07:00
parent dc57309584
commit eccf4465eb

View File

@ -81,15 +81,15 @@ const lastDropdownItem = dropdownItems[dropdownItems.length - 1];
const openDropdown = function() {
dropdownContent.classList.add("show");
dropdownContent.setAttribute("aria-hidden", "false");
dropdownButton.setAttribute("aria-expanded", "true");
dropdownContent.ariaHidden = "false";
dropdownButton.ariaExpanded = "true";
}
const closeDropdown = function() {
if (dropdownButton.ariaExpanded === "true") {
dropdownContent.classList.remove("show");
dropdownContent.setAttribute("aria-hidden", "true");
dropdownButton.setAttribute("aria-expanded", "false");
dropdownContent.ariaHidden = "true";
dropdownButton.ariaExpanded = "false";
}
}
@ -106,7 +106,7 @@ dropdownButton.addEventListener("keydown", (event) => {
} else {
closeDropdown();
}
}
} else if (event.key === "Tab" && event.shiftKey) closeDropdown();
});
firstDropdownItem.addEventListener("keydown", (event) => {
@ -118,7 +118,7 @@ lastDropdownItem.addEventListener("keydown", (event) => {
});
document.addEventListener("keydown", (event) => {
if (event.key === "Escape") {
if (event.key === "Escape" && dropdownButton.ariaExpanded === "true") {
closeDropdown();
dropdownButton.focus();
}