Aria Text
Testing & Qualityaria-textAria Text is an Agent Skill for testing & quality published in the thedaviddias/Front-End-Checklist repository on GitHub: a SKILL.md instruction file an AI agent can load to do this task.
Use when reviewing rendered HTML, interactive components, or design-system patterns related to Avoid focusable descendants in role='text' elements. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.
How to use this skill
Bring this guide into your coding agent with a prompt tailored to the tool you use.
- Open your project in Codex.
- Copy and paste the prompt below.
- Review files and risks before approving any action.
Inspect the Agent Skill at https://github.com/thedaviddias/Front-End-Checklist/blob/HEAD/skills/aria-text/SKILL.md and all supporting files. Report provenance, permissions, scripts, dependencies, and security risks. Propose an exact installation into .agents/skills/aria-text, but wait for my approval before writing files or running scripts.
Copying this prompt does not install or run the skill. Review third-party files before use.
Avoid focusable descendants in role="text" elements
Using role="text" on a container forces screen readers to treat everything inside as a single string of text, which effectively hides any interactive elements from users who rely on assistive technology.
Quick Reference
- Elements with
role="text"should not contain interactive children (links, buttons) - Ensure
role="text"only contains static text content - Prevent accessibility "black holes" where interactive items are hidden from screen readers
Check
Identify elements with role="text" and verify they do not contain any focusable elements like buttons, links, or inputs.
Fix
Remove role="text" from containers that have interactive children or move the interactive elements outside.
Explain
Explain how role="text" overrides the semantics of descendant elements, making interactive components inaccessible to screen reader users.
Code Review
Review the rendered markup and interactive states that affect Avoid focusable descendants in role="text" elements. Flag exact elements, roles, labels, focus behavior, or keyboard interactions that violate the rule, and note how to verify the fix with browser accessibility tooling or assistive tech.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/en/rules/accessibility/aria-text