@storybook/[email protected] Error on PropTypes.oneOfType when argument is a var

[johnhunter]

Describe the bug
Addon-info throws an exception (when a story is rendered) if a mounted component defines a PropTypes.oneOfType as a variable rather than an array literal.

To Reproduce
Steps to reproduce the behavior:

1. Import the Test.jsx component into a story and render
2. run storybook
3. Load created story

Expected behavior
The component renders without error

Actual behavior

• Story does not render
• Exception message displayed:

propTypes.map is not a function
    TypeError: propTypes.map is not a function
    at OneOfType (OneOfType.js:27)
    at mountIndeterminateComponent (react-dom.development.js:14811)
    at beginWork (react-dom.development.js:15316)
    at performUnitOfWork (react-dom.development.js:18150)
    at workLoop (react-dom.development.js:18190)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at replayUnitOfWork (react-dom.development.js:17437)

The exception occurs at:
https://github.com/storybooks/storybook/blob/4c757d05f162925217751bb5d61518c108d0935b/addons/info/src/components/types/OneOfType.js#L10-L11
where propTypes is expected to be an iterable (either an array of propType, or an object of name "custom"). In this case the value is the string name of the variable passed to PropTypes.oneOfType in the Component - in this case "b".

Code snippets
Test.jsx

import React from 'react';
import PropTypes from 'prop-types';


const Test = ({ a, b }) => <div> {a} {b} </div>;

const allowedChildTypes = [
  PropTypes.number,
  PropTypes.string,
  PropTypes.element,
];

Test.propTypes = {
  // works ok
  a: PropTypes.oneOfType([
    PropTypes.number,
    PropTypes.string,
    PropTypes.element,
  ]),
  // fails with: TypeError: propTypes.map is not a function
  b: PropTypes.oneOfType(allowedChildTypes),
};

export default Test;

System:

• OS: MacOS
• Device: Macbook Pro 2018
• Browser: chrome
• Framework: [email protected]
• Version: [e.g. 4.1.4]

Additional context
It is valid and desirable to use variables as arguments to oneOfType. Its likely that the problem is with react-dom passing the propTypes as a string. However the plugin should guard against the exception and at a minimum report the propType as "custom" or "unknown".

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[johnhunter]

I appreciate it’s a low priority issue. I’ll see if I can get a PR raised to resolve. Thanks.

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[shilman]

Thanks @johnhunter and sorry for the slow response. Everybody's been head's down on the SB5 release. Will def appreciate a fix if you have one. I'll also be prioritizing addon-info after the v5 release, moving it out of the preview #1147 and addressing bugs like this one.

[johnhunter]

Thanks @shilman much appreciated - i'm looking forward to seeing SB5. Not able to get to a fix at the moment, will let you know if I do.

[johnhunter]

Upgrade to 5.0.1 resolved this issue. With the given example Test.jsx both property 'a' and 'b' report propType as 'other'.

Great work on SB5 - thanks!