check_aria_attributes
Validate ARIA attribute usage in HTML to ensure compliance with accessibility standards, enhancing web accessibility testing with WCAG guidelines.
Instructions
Check if ARIA attributes are used correctly in HTML
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| html | Yes | HTML content to test for ARIA attribute usage |
Implementation Reference
- src/index.ts:601-673 (handler)The main handler function for the 'check_aria_attributes' tool. Launches Puppeteer browser, sets the provided HTML content, runs AxePuppeteer with ARIA-specific rules (aria-allowed-attr, aria-hidden-body, etc.), formats and returns violations and passes as JSON text content.
async checkAriaAttributes(args: any) { const { html } = args; if (!html) { throw new McpError( ErrorCode.InvalidParams, 'Missing required parameter: html' ); } let browser; try { browser = await puppeteer.launch({ headless: true, args: ['--no-sandbox', '--disable-setuid-sandbox'] }); const page = await browser.newPage(); await page.setContent(html); // Run only the ARIA-related rules const axe = new AxePuppeteer(page) .options({ runOnly: { type: 'rule', values: [ 'aria-allowed-attr', 'aria-hidden-body', 'aria-required-attr', 'aria-required-children', 'aria-required-parent', 'aria-roles', 'aria-valid-attr', 'aria-valid-attr-value' ] } }); const result = await axe.analyze(); return { content: [ { type: 'text', text: JSON.stringify({ violations: result.violations.map(violation => ({ id: violation.id, impact: violation.impact, description: violation.description, help: violation.help, helpUrl: violation.helpUrl, affectedNodes: violation.nodes.map(node => ({ html: node.html, target: node.target, failureSummary: node.failureSummary })) })), passes: result.passes.map(pass => ({ id: pass.id, description: pass.description, help: pass.help, nodes: pass.nodes.length })) }, null, 2), }, ], }; } finally { if (browser) { await browser.close(); } } } - src/index.ts:131-140 (schema)Input schema for the tool, requiring a single 'html' string parameter.
inputSchema: { type: 'object', properties: { html: { type: 'string', description: 'HTML content to test for ARIA attribute usage', } }, required: ['html'], }, - src/index.ts:128-141 (registration)Tool registration object in the ListTools response, defining name, description, and input schema.
{ name: 'check_aria_attributes', description: 'Check if ARIA attributes are used correctly in HTML', inputSchema: { type: 'object', properties: { html: { type: 'string', description: 'HTML content to test for ARIA attribute usage', } }, required: ['html'], }, }, - src/index.ts:170-171 (registration)Dispatch case in the CallToolRequest handler that calls the checkAriaAttributes method.
case 'check_aria_attributes': return await this.checkAriaAttributes(request.params.arguments);