From b40c3f374321307a4007922e89ef62a9e879eed7 Mon Sep 17 00:00:00 2001 From: Nicholas Ray Date: Mon, 29 Jun 2020 13:23:48 -0600 Subject: [PATCH] Update CheckboxHack interface for future placement of `aria-expanded` on label button Currently, the `aria-expanded` attribute is placed on the checkbox element. However, since Ife287fc8c6e0d2aee5facf42d5d4308dea918ee3, the checkbox is excluded from the accessibility tree, and this attribute should be placed on the label button instead. This commit prepares for future changes [1] to the checkbox hack interface in a backwards compatible way: * Passes button to `updateAriaExpanded` function * Passes button to `bindUpdateAriaExpandedOnInput` function [1] Ia2755e189babbd70945b66a1a812fc3ece40b577 Change-Id: Icc6ba994d57ea1f8050aa408aebc8c81f03d8783 --- resources/CheckboxHack.d.ts | 4 ++-- resources/skins.vector.js/skin.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/resources/CheckboxHack.d.ts b/resources/CheckboxHack.d.ts index d2fa76e..23f774b 100644 --- a/resources/CheckboxHack.d.ts +++ b/resources/CheckboxHack.d.ts @@ -1,6 +1,6 @@ interface CheckboxHack { - updateAriaExpanded(checkbox: HTMLInputElement): void; - bindUpdateAriaExpandedOnInput(checkbox: HTMLInputElement): CheckboxHackListeners; + updateAriaExpanded(checkbox: HTMLInputElement, button: HTMLElement): void; + bindUpdateAriaExpandedOnInput(checkbox: HTMLInputElement, button: HTMLElement): CheckboxHackListeners; bindToggleOnClick(checkbox: HTMLInputElement, button: HTMLElement): CheckboxHackListeners; bindDismissOnClickOutside(window: Window, checkbox: HTMLInputElement, button: HTMLElement, target: Node): CheckboxHackListeners; bindDismissOnFocusLoss(window: Window, checkbox: HTMLInputElement, button: HTMLElement, target: Node): CheckboxHackListeners; diff --git a/resources/skins.vector.js/skin.js b/resources/skins.vector.js/skin.js index 0da980a..b19ff34 100644 --- a/resources/skins.vector.js/skin.js +++ b/resources/skins.vector.js/skin.js @@ -46,9 +46,9 @@ function initSidebar( document ) { var button = document.getElementById( 'mw-sidebar-button' ); if ( checkbox instanceof HTMLInputElement && button ) { checkboxHack.bindToggleOnClick( checkbox, button ); - checkboxHack.bindUpdateAriaExpandedOnInput( checkbox ); + checkboxHack.bindUpdateAriaExpandedOnInput( checkbox, button ); - checkboxHack.updateAriaExpanded( checkbox ); + checkboxHack.updateAriaExpanded( checkbox, button ); } }