mediawiki-skins-MinervaNeue/includes/Skins/ToggleList/ToggleList.js
Jon Robson a62f1e06ff Update checkboxHack target node
CHECKBOX_HACK_TARGET_SELECTOR only applies to the first list
and there are three lists in the menu. Use the parent instead.

Additional changes:
* Transform to ES6 while working on this code.

Bug: T354315
Change-Id: I354e33af872e9a2f93d97793f5f33b735d42e804
2024-01-12 08:00:59 -08:00

35 lines
1 KiB
JavaScript

( function () {
const
checkboxHack = require( ( 'mediawiki.page.ready' ) ).checkboxHack,
CHECKBOX_HACK_CONTAINER_SELECTOR = '.toggle-list',
CHECKBOX_HACK_CHECKBOX_SELECTOR = '.toggle-list__checkbox',
CHECKBOX_HACK_BUTTON_SELECTOR = '.toggle-list__toggle',
CHECKBOX_HACK_TARGET_SELECTOR = '.toggle-list__list';
/**
* Automatically dismiss the list when clicking or focusing elsewhere and update the
* aria-expanded attribute based on list visibility.
*
* @param {Window} window
* @param {HTMLElement} component
*/
function bind( window, component ) {
const
checkbox = /** @type {HTMLInputElement} */ (
component.querySelector( CHECKBOX_HACK_CHECKBOX_SELECTOR )
),
button = component.querySelector( CHECKBOX_HACK_BUTTON_SELECTOR ),
target = component.querySelector( CHECKBOX_HACK_TARGET_SELECTOR ).parentNode;
if ( !( checkbox && button && target ) ) {
return;
}
checkboxHack.bind( window, checkbox, button, target );
}
module.exports = Object.freeze( {
selector: CHECKBOX_HACK_CONTAINER_SELECTOR,
bind
} );
}() );