mirror of
https://github.com/miniflux/v2.git
synced 2025-09-15 18:57:04 +00:00
fix macOS VoiceOver didn't announce details and summary expand
This commit is contained in:
parent
c9cbe8afd5
commit
5c97771e61
4 changed files with 35 additions and 10 deletions
|
@ -54,6 +54,27 @@ function checkMenuToggleModeByLayout() {
|
|||
}
|
||||
}
|
||||
|
||||
function fixVoiceOverDetailsSummaryBug() {
|
||||
const detailsElements = document.querySelectorAll("details")
|
||||
detailsElements.forEach((details) => {
|
||||
const summaryElement = details.querySelector("summary")
|
||||
summaryElement.setAttribute("role", "button")
|
||||
setSummaryAriaExpandedByDetails(details, summaryElement)
|
||||
|
||||
details.addEventListener("toggle", () => {
|
||||
setSummaryAriaExpandedByDetails(details, summaryElement)
|
||||
})
|
||||
})
|
||||
|
||||
function setSummaryAriaExpandedByDetails(details, summary) {
|
||||
if (details.open) {
|
||||
summary.setAttribute("aria-expanded", "true")
|
||||
} else {
|
||||
summary.setAttribute("aria-expanded", "false")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Show and hide the main menu on mobile devices.
|
||||
function toggleMainMenu(event) {
|
||||
if (event.type === "keydown" && !(event.key === "Enter" || event.key === " ")) {
|
||||
|
|
2
internal/ui/static/js/bootstrap.js
vendored
2
internal/ui/static/js/bootstrap.js
vendored
|
@ -114,6 +114,8 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||
checkMenuToggleModeByLayout()
|
||||
window.addEventListener("resize", checkMenuToggleModeByLayout, { passive: true })
|
||||
|
||||
fixVoiceOverDetailsSummaryBug()
|
||||
|
||||
const logoElement = document.querySelector(".logo")
|
||||
logoElement.addEventListener("click", (event) => toggleMainMenu(event));
|
||||
logoElement.addEventListener("keydown", (event) => toggleMainMenu(event));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue