diff --git a/lib/rules/template-require-presentational-children.js b/lib/rules/template-require-presentational-children.js index 172c18ba76..45676a9194 100644 --- a/lib/rules/template-require-presentational-children.js +++ b/lib/rules/template-require-presentational-children.js @@ -1,21 +1,11 @@ -// Roles that require all descendants to be presentational -// https://w3c.github.io/aria-practices/#children_presentational -const ROLES_REQUIRING_PRESENTATIONAL_CHILDREN = new Set([ - 'button', - 'checkbox', - 'img', - 'meter', - 'menuitemcheckbox', - 'menuitemradio', - 'option', - 'progressbar', - 'radio', - 'scrollbar', - 'separator', - 'slider', - 'switch', - 'tab', -]); +const { roles } = require('aria-query'); + +// Roles where descendants are presentational per the ARIA "Children +// Presentational" rule. Derived from aria-query (role.childrenPresentational). +// https://www.w3.org/TR/wai-aria-1.2/#childrenArePresentational +const ROLES_REQUIRING_PRESENTATIONAL_CHILDREN = new Set( + [...roles.keys()].filter((role) => roles.get(role).childrenPresentational) +); // Tags that do not have semantic meaning const NON_SEMANTIC_TAGS = new Set([ diff --git a/tests/lib/rules/template-require-presentational-children.js b/tests/lib/rules/template-require-presentational-children.js index e6504e5785..1a15cf021b 100644 --- a/tests/lib/rules/template-require-presentational-children.js +++ b/tests/lib/rules/template-require-presentational-children.js @@ -35,6 +35,12 @@ ruleTester.run('template-require-presentational-children', rule, { Title here `, + // SKIPPED_TAGS: is always skipped, even when its role has + // childrenPresentational (e.g. graphics-symbol via Graphics-ARIA). + ``, `

pg

', + output: null, + errors: [ + { + message: + '
has a role of doc-pagebreak, it cannot have semantic descendants like

', + }, + ], + }, + // graphics-symbol: Graphics-ARIA role with childrenPresentational; flags on non-svg host. + { + code: '', + output: null, + errors: [ + { + message: + '
has a role of graphics-symbol, it cannot have semantic descendants like ', + }, + ], + }, ], }); @@ -109,6 +137,12 @@ hbsRuleTester.run('template-require-presentational-children', rule, { Title here `, + // SKIPPED_TAGS: is always skipped, even when its role has + // childrenPresentational (e.g. graphics-symbol via Graphics-ARIA). + ` + + + `, ` <:default>Button text @@ -150,5 +184,27 @@ hbsRuleTester.run('template-require-presentational-children', rule, { }, ], }, + // doc-pagebreak: DPUB-ARIA role with childrenPresentational. + { + code: '

pg

', + output: null, + errors: [ + { + message: + '
has a role of doc-pagebreak, it cannot have semantic descendants like

', + }, + ], + }, + // graphics-symbol: Graphics-ARIA role with childrenPresentational; flags on non-svg host. + { + code: '
X
', + output: null, + errors: [ + { + message: + '
has a role of graphics-symbol, it cannot have semantic descendants like ', + }, + ], + }, ], });