From 86052617fddfe84c4ecb842658425e0de07edfae Mon Sep 17 00:00:00 2001 From: Jonathan Carle Date: Mon, 25 Mar 2024 13:47:51 +0100 Subject: [PATCH 1/2] fix #932 not required switch prop --- .../role-has-required-aria-props.test.ts | 10 ++++++++ src/rules/role-has-required-aria-props.ts | 25 ++++++++++++++++++- 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/src/rules/__tests__/role-has-required-aria-props.test.ts b/src/rules/__tests__/role-has-required-aria-props.test.ts index bec5936c..401fc1cc 100644 --- a/src/rules/__tests__/role-has-required-aria-props.test.ts +++ b/src/rules/__tests__/role-has-required-aria-props.test.ts @@ -3,11 +3,21 @@ import makeRuleTester from "./makeRuleTester"; makeRuleTester("role-has-required-aria-props", rule, { valid: [ + "", "", "", "" ], invalid: [ + { + code: "", + errors: [ + { + messageId: "default", + data: { role: "switch", attributes: "aria-checked" } + } + ] + }, { code: "", errors: [ diff --git a/src/rules/role-has-required-aria-props.ts b/src/rules/role-has-required-aria-props.ts index 9ff619be..9734348f 100644 --- a/src/rules/role-has-required-aria-props.ts +++ b/src/rules/role-has-required-aria-props.ts @@ -18,6 +18,24 @@ function isAriaRoleDefinitionKey(role: any): role is ARIARoleDefinitionKey { return roles.has(role); } +function filterRequiredPropsExceptions( + node: AST.VElement, + role: ARIARoleDefinitionKey, + elementType: string, + requiredProps: string[] +) { + // Based on the pattern recommendation in https://www.w3.org/WAI/ARIA/apg/patterns/switch/#wai-ariaroles,states,andproperties + // "aria-checked" should not be required. + if ( + role.toLowerCase() === "switch" && + elementType === "input" && + getElementAttributeValue(node, "type") === "checkbox" + ) { + return requiredProps.filter((p) => p !== "aria-checked"); + } + return requiredProps; +} + const rule: Rule.RuleModule = { meta: { type: "problem", @@ -48,7 +66,12 @@ const rule: Rule.RuleModule = { .forEach((role) => { if (isAriaRoleDefinitionKey(role)) { const roleDefinition = roles.get(role) as any; - const requiredProps = Object.keys(roleDefinition.requiredProps); + const requiredProps = filterRequiredPropsExceptions( + node, + role, + elementType, + Object.keys(roleDefinition.requiredProps) + ); if (requiredProps && !hasAttributes(node, requiredProps)) { context.report({ From 69bb3a4e3374740eebaaf21d72e67bdcfeca0c7d Mon Sep 17 00:00:00 2001 From: Jonathan Carle Date: Mon, 25 Mar 2024 13:50:21 +0100 Subject: [PATCH 2/2] extended comment --- src/rules/role-has-required-aria-props.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/rules/role-has-required-aria-props.ts b/src/rules/role-has-required-aria-props.ts index 9734348f..d7526fba 100644 --- a/src/rules/role-has-required-aria-props.ts +++ b/src/rules/role-has-required-aria-props.ts @@ -25,7 +25,7 @@ function filterRequiredPropsExceptions( requiredProps: string[] ) { // Based on the pattern recommendation in https://www.w3.org/WAI/ARIA/apg/patterns/switch/#wai-ariaroles,states,andproperties - // "aria-checked" should not be required. + // "aria-checked" should not be required when elementType is `input` and has the type attribute `checkbox`. if ( role.toLowerCase() === "switch" && elementType === "input" &&