-
Notifications
You must be signed in to change notification settings - Fork 130
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add an escape hatch for a11y errors #1083
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
--- | ||
'@sumup/circuit-ui': minor | ||
--- | ||
|
||
Added an escape hatch to silence accessibility errors in development when the `UNSAFE_DISABLE_ACCESSIBILITY_ERRORS` environment variable is set to `true`. |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,5 @@ | ||
const webpack = require('webpack'); | ||
|
||
module.exports = { | ||
stories: [ | ||
'../packages/**/*.stories.@(js|ts|tsx|mdx)', | ||
|
@@ -20,12 +22,12 @@ module.exports = { | |
features: { | ||
postcss: false, | ||
}, | ||
webpackFinal: transpileModules, | ||
managerWebpack: transpileModules, | ||
webpackFinal: createWebpackConfig, | ||
managerWebpack: createWebpackConfig, | ||
}; | ||
|
||
// Transpile all node_modules under the @sumup/* namespace. | ||
function transpileModules(config) { | ||
function createWebpackConfig(config) { | ||
// Transpile all node_modules under the @sumup/* namespace. | ||
config.module.rules = config.module.rules.map((rule) => { | ||
// Modify all rules that apply to story files. | ||
if ( | ||
|
@@ -40,5 +42,14 @@ function transpileModules(config) { | |
} | ||
return rule; | ||
}); | ||
// Expose environment variables to Storybook | ||
config.plugins = [ | ||
...config.plugins, | ||
new webpack.DefinePlugin({ | ||
'process.env.UNSAFE_DISABLE_ACCESSIBILITY_ERRORS': JSON.stringify( | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Note: here I had to use |
||
process.env.UNSAFE_DISABLE_ACCESSIBILITY_ERRORS, | ||
), | ||
}), | ||
]; | ||
return config; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -166,6 +166,7 @@ export const Hamburger = ({ | |
...props | ||
}: HamburgerProps): JSX.Element => { | ||
if ( | ||
process.env.UNSAFE_DISABLE_ACCESSIBILITY_ERRORS !== 'true' && | ||
process.env.NODE_ENV !== 'production' && | ||
process.env.NODE_ENV !== 'test' && | ||
(!activeLabel || !inactiveLabel) | ||
Comment on lines
+169
to
172
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Wondering if there's a way to abstract this away somewhere to avoid 3 duplicate lines in 30ish components There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I don't think there is a way without adding a function call in production everywhere 😕 |
||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm not sure if this is necessary. I thought it couldn't hurt