@component-controls/axe-plugin NPM

In action

Overview

Accessibility testing plugin using the axe-core library from deque

Some of the design goals:

Test at the component-level.
Provide a dashboard view to quickly see the errors and tests for the component.
Ability to select and outline the sub-elements generating the errors.
Ability to see details from the errors and passed rules.

Install

yarn add @component-controls/axe-plugin --dev

Documentation

A11Y Testing

API

AllyBlock

react component

Story block container that displays displays the [axe](https://github.com/dequelabs/axe-core) ally test results

defined in @component-controls/axe-plugin/plugins/axe-plugin/src/AllyBlock/AllyBlock.tsx

properties

Name	Type	Parent	Description
`axeOptions`	`Specbrandingbrand`: `stringapplication`: `stringreporter`: `"v1"` \| `"v2"` \| `"raw"` \| `"raw-env"` \| `"no-passes"checks`: `Check`[]`rules`: `Rule`[]`standardsariaAttrs`[`string`]: AriaAttrs`ariaRoles`[`string`]: AriaRoles`htmlElms`[`string`]: HtmlElms`cssColors`[`string`]: `number`[]`localelang`: `stringrules`: RuleLocale`checks`: CheckLocale`disableOtherRules`: `booleanaxeVersion`: `stringver`: `string`	`AllyBlockOwmProps`
`id`	`string`	`StoryInputProps`
`name`	`string`	`StoryInputProps`
`title`	`string`	`BlockContainerOwnProps`	optional section title for the block.
`description`	`string`	`BlockContainerOwnProps`	optional markdown description.
`collapsible`	`boolean`	`BlockContainerOwnProps`	if false, will nothave a collapsible frame.
`data-testid`	`string`	`BlockContainerOwnProps`	testing id
`plain`	`boolean`	`BlockContainerOwnProps`	inner container variant or plain
`slot`	`string` \| `undefined`	`HTMLAttributes`
`style`	`CSSProperties` \| `undefined`	`HTMLAttributes`
`key`	`Key` \| `null` \| `undefined`	`Attributes`
`sx`	`ThemeUICSSObject` \| `ThemeDerivedStyles`	`Attributes`	The `ThemeUIStyleObject` extends [style props](https://emotion.sh/docs/object-styles) such that properties that are part of the `Theme` will be transformed to their corresponding values. Other valid CSS properties are also allowed.
`defaultChecked`	`boolean` \| `undefined`	`HTMLAttributes`
`defaultValue`	`string` \| `number` \| `ReadonlyArray`<`string`> \| `undefined`	`HTMLAttributes`
`suppressContentEditableWarning`	`boolean` \| `undefined`	`HTMLAttributes`
`suppressHydrationWarning`	`boolean` \| `undefined`	`HTMLAttributes`
`accessKey`	`string` \| `undefined`	`HTMLAttributes`
`className`	`string` \| `undefined`	`HTMLAttributes`
`contentEditable`	`Booleanish` \| `"inherit"` \| `undefined`	`HTMLAttributes`
`contextMenu`	`string` \| `undefined`	`HTMLAttributes`
`dir`	`string` \| `undefined`	`HTMLAttributes`
`draggable`	`Booleanish` \| `undefined`	`HTMLAttributes`
`hidden`	`boolean` \| `undefined`	`HTMLAttributes`
`lang`	`string` \| `undefined`	`HTMLAttributes`
`placeholder`	`string` \| `undefined`	`HTMLAttributes`
`spellCheck`	`Booleanish` \| `undefined`	`HTMLAttributes`
`tabIndex`	`number` \| `undefined`	`HTMLAttributes`
`translate`	`"yes"` \| `"no"` \| `undefined`	`HTMLAttributes`
`radioGroup`	`string` \| `undefined`	`HTMLAttributes`
`role`	`AriaRole` \| `undefined`	`HTMLAttributes`
`about`	`string` \| `undefined`	`HTMLAttributes`
`datatype`	`string` \| `undefined`	`HTMLAttributes`
`inlist`	`any`	`HTMLAttributes`
`prefix`	`string` \| `undefined`	`HTMLAttributes`
`property`	`string` \| `undefined`	`HTMLAttributes`
`resource`	`string` \| `undefined`	`HTMLAttributes`
`typeof`	`string` \| `undefined`	`HTMLAttributes`
`vocab`	`string` \| `undefined`	`HTMLAttributes`
`autoCapitalize`	`string` \| `undefined`	`HTMLAttributes`
`autoCorrect`	`string` \| `undefined`	`HTMLAttributes`
`autoSave`	`string` \| `undefined`	`HTMLAttributes`
`color`	`string` \| `undefined`

addon storybook

@component-controls/blocks @component-controls/components @component-controls/core @component-controls/store @primer/octicons-react axe-core react theme-ui

@infinitebrahmanuniverse/nolb-_compo @everything-registry/sub-chunk-193 @zalastax/nolb-_compo @component-controls/pages

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

@component-controls/axe-plugin v4.0.3

Table of contents

In action

Overview

Install

Documentation

API

AllyBlock