storybook: addon-a11y not working with React in Storybook 4.1.11
Describe the bug The A11y extension always returns 0 errors 0 passes even when there are violations
To Reproduce Steps to reproduce the behavior: https://github.com/afisher88/react-storybook-sandbox
This repository contains a component that should fail on colour contrast and a component that contains a button with no type or text.
Expected behavior A11y errors and passes should show in the A11y panel
Screenshots

Code snippets package.json
"devDependencies": {
"@babel/core": "^7.0.1",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@storybook/addon-a11y": "^4.1.11",
"@storybook/addon-actions": "^4.1.11",
"@storybook/addon-links": "^4.1.11",
"@storybook/addons": "^4.1.11",
"@storybook/react": "^4.1.11",
"babel-loader": "^8.0.2",
"css-loader": "^2.1.0",
"mini-css-extract-plugin": "^0.5.0",
"node-sass": "^4.9.3",
"path": "^0.12.7",
"sass-loader": "^7.1.0",
"webpack": "^4.19.0",
"webpack-cli": "^3.1.0"
}
addons.js
import '@storybook/addon-actions/register';
import '@storybook/addon-links/register';
import '@storybook/addon-a11y/register';
config.js
import { configure, addDecorator } from '@storybook/react';
import { checkA11y } from '@storybook/addon-a11y';
// automatically import all files ending in *.stories.js
const req = require.context('../stories', true, /.stories.js$/);
addDecorator(checkA11y);
function loadStories() {
req.keys().forEach(filename => req(filename));
}
configure(loadStories, module);
System:
- OS: Windows10
- Device: Desktop
- Browser: Chrome
- Framework: React
- Addons: A11y
- Version: 4.1.11
Additional context I am trying to use the global decorator, however I’ve tried the component decorator and have the same issue.
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 17 (10 by maintainers)
@afisher88 We’re targeting March 4 for the release