Addon Info - Prop Types wrong infos on static bundle
See original GitHub issueDescribe the bug After running static build the Prop Types table misses informations
To Reproduce Steps to reproduce the behavior:
- Go to https://components.helixa.ai/?path=/story/atoms--button
- Scroll down to Prop Types
- See error
Expected behavior Should look the same as on dev mode
Screenshots
Local
Static bundle
The difference inspecting react table component
On static bundle the ‘propTypes’ object is missing.
Code snippets
import PropTypes from 'prop-types';
import React from 'react';
import { StyledButton } from './StyledButton';
const Button = ({
disabled,
tag,
as,
onClick,
onMouseOver,
onMouseOut,
...rest
}) => (
<StyledButton
as={!as && tag ? tag : as}
disabled={disabled}
onClick={onClick}
onMouseOver={onMouseOver}
onMouseOut={onMouseOut}
{...rest}
/>
);
// This is to work around: https://github.com/kadirahq/react-storybook-addon-info/issues/26#issuecomment-229029177
Button.displayName = 'Button';
Button.propTypes = {
/** The html tag of the button to render with */
tag: PropTypes.oneOf(['button', 'a']),
/** The html type of the button, tip: use submit in forms */
type: PropTypes.oneOf(['button', 'submit']),
/** The variant colors of the button */
variant: PropTypes.oneOf(['primary', 'standard', 'outlined', 'subtle']),
/** The size of the button */
size: PropTypes.oneOf(['small', 'medium', 'large']),
/** Sets the disabled prop */
disabled: PropTypes.bool,
/** On click callback function */
onClick: PropTypes.func,
/** On Mouse Over callback function */
onMouseOver: PropTypes.func,
/** On Mouse Out callback function */
onMouseOut: PropTypes.func,
};
Button.defaultProps = {
tag: 'button',
type: 'button',
variant: 'standard',
size: 'medium',
disabled: false,
};
export default Button;
System:
- OS: MacOS
- Device: Macbook Pro 2018
- Browser: chrome
- Framework: react
- Addons: info
- Version: [e.g. 5.0.5]
Additional infos
"@babel/cli": "^7.2.3",
"@babel/core": "^7.3.4",
"@storybook/addon-actions": "^5.0.5",
"@storybook/addon-info": "^5.0.5",
"@storybook/addon-jest": "^5.0.5",
"@storybook/addon-knobs": "^5.0.5",
"@storybook/addon-links": "^5.0.5",
"@storybook/addon-options": "^5.0.5",
"@storybook/addons": "^5.0.5",
"@storybook/react": "^5.0.5",
Issue Analytics
- State:
- Created 4 years ago
- Comments:5 (1 by maintainers)
Top Results From Across the Web
Prop table broken in 5.3.2 with propTypes · Issue #9415 - GitHub
Declare propTypes for a component. Open storybook and see that it hasn't generated a prop table. Expected behavior. Expected to see prop ...
Read more >Static propTypes not working under ES6 - Stack Overflow
Changed to use static but got this error: Warning: Failed prop type: Required prop name was not specified in App. – Pavel. Jul...
Read more >Output - webpack
The bundle is written to the directory specified by the output.path option. For a single entry point, this can be a static name....
Read more >JavaScript - Bootstrap
Only one plugin per element via data attributes. Don't use data attributes from multiple plugins on the same element. For example, a button...
Read more >Bundle Structures - Apple Developer
Explains how to use bundle objects to organize resources.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I think there is a point here concerning static build issues. https://github.com/storybooks/storybook/tree/next/addons/info#the-faq
Also, this worked for me to get around the issue as well
"storybook:build": "NODE_ENV=development build-storybook -c .storybook -o build"
Fixed, thanks a lot @joeycozza !