Skip to content

Commit 7af3c2f

Browse files
committed
fix(template-require-mandatory-role-attributes): lowercase role in input-pair whitelist
ARIA role tokens compare ASCII-case-insensitively, so `<input type="checkbox" role="SWITCH">` should qualify for the same aria-checked exemption as `role="switch"`. Lowercases the role at the whitelist-key boundary, matching the case-handling that already exists for the `type` attribute. Mirrors jsx-a11y (`getExplicitRole` lowercases role) and stays internally consistent with template-no-redundant-role. Tests cover SWITCH/Switch/MENUITEMCHECKBOX/Radio/menuitemRadio on the documented input-role pairings.
1 parent e8822db commit 7af3c2f

2 files changed

Lines changed: 19 additions & 2 deletions

File tree

lib/rules/template-require-mandatory-role-attributes.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,10 +56,11 @@ function getInputType(node) {
5656

5757
function isNativelyChecked(node, role) {
5858
const type = getInputType(node);
59-
if (!type) {
59+
if (!type || typeof role !== 'string') {
6060
return false;
6161
}
62-
return NATIVELY_CHECKED_INPUT_ROLE_PAIRS.has(`${type}:${role}`);
62+
// ARIA role tokens compare ASCII-case-insensitively.
63+
return NATIVELY_CHECKED_INPUT_ROLE_PAIRS.has(`${type}:${role.toLowerCase()}`);
6364
}
6465

6566
function getMissingRequiredAttributes(role, foundAriaAttributes, node) {

tests/lib/rules/template-require-mandatory-role-attributes.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,14 @@ ruleTester.run('template-require-mandatory-role-attributes', rule, {
3737

3838
// HTML `type` is ASCII case-insensitive; `Checkbox` must match `checkbox`.
3939
'<template><input type="Checkbox" role="switch" /></template>',
40+
41+
// ARIA role tokens are ASCII case-insensitive — mixed-case roles are
42+
// exempted on the same pairings.
43+
'<template><input type="checkbox" role="SWITCH" /></template>',
44+
'<template><input type="checkbox" role="Switch" /></template>',
45+
'<template><input type="CHECKBOX" role="MENUITEMCHECKBOX" /></template>',
46+
'<template><input type="radio" role="Radio" /></template>',
47+
'<template><input type="RADIO" role="menuitemRadio" /></template>',
4048
],
4149

4250
invalid: [
@@ -155,6 +163,14 @@ hbsRuleTester.run('template-require-mandatory-role-attributes', rule, {
155163

156164
// HTML `type` is ASCII case-insensitive; `Checkbox` must match `checkbox`.
157165
'<input type="Checkbox" role="switch" />',
166+
167+
// ARIA role tokens are ASCII case-insensitive — mixed-case roles are
168+
// exempted on the same pairings.
169+
'<input type="checkbox" role="SWITCH" />',
170+
'<input type="checkbox" role="Switch" />',
171+
'<input type="CHECKBOX" role="MENUITEMCHECKBOX" />',
172+
'<input type="radio" role="Radio" />',
173+
'<input type="RADIO" role="menuitemRadio" />',
158174
],
159175
invalid: [
160176
{

0 commit comments

Comments
 (0)