Use @storybook/addon-docs instead of deprecated @storybook/addon-info

[sojeri]

Deprecated @storybook/addon-info is pulling in a bad marked dependency via marsky. Although this is already fixed in marked, it is unlikely to be fixed any time soon for marksy: storybookjs/marksy#78. (There were breaking changes which marksy maintainers have yet to resolve; it is a non-trivial fix.)

Since @storybook/addon-info is deprecated, even without the security vulnerability we should be switching to @storybook/addon-docs.

yarn audit output

>> yarn audit
yarn audit v1.22.4
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ moderate      │ Regular Expression Denial of Service                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ marked                                                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.6.2                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ @storybook/addon-info                                        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ @storybook/addon-info > marksy > marked                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://www.npmjs.com/advisories/812                         │
└───────────────┴──────────────────────────────────────────────────────────────┘
1 vulnerabilities found - Packages audited: 328229
Severity: 1 Moderate
✨  Done in 1.60s.

references

• storybook's list of addons which calls info out as deprecated
• storybook's info -> docs migration guide
• storybook addons-docs main
• https://www.npmjs.com/advisories/812
• Current version of marked creates npm audit issue storybookjs/marksy#78

[haworku]

From @sojeri on Slack: "one thing of note is that you can get around the worst of this change by upgrading sb to v6."

Also in SB6 (in beta as of January 2020) TypeScript is zero-config and should work with SB Docs out of the box - https://github.com/storybookjs/storybook/tree/next/addons/docs#typescript-configuration

[ahobson]

I’ve been looking into storybook 5.3.0 in prep for storybook 6, the switch to addon-docs from addon-info and how to get our prop documentation to show up and I’ve finally figured it out.

When we switch from addon-info to addon-docs all stories will have a Happo change because of how things are displayed.

5.3.0 introduces new ways of configuring things that I believe 6.0 will require.

Finally, 6.0 has new typescript config bits that I think simplify our config.

1. PR to upgrade to 5.3.0 with the new config layout, but still use addon-info. This will also have changes that are needed to support addon-docs, but should work fine with addon-info.
2. PR to switch to addon-docs with the smallest change possible. This one will have the giant Happo change
3. Probably by then storybook will be on 6.0 (It's currently on 6.0.0-rc5) and we can upgrade and hopefully don't have any Happo changes
4. I'll create a separate issue for the typescript config cleanup once we are on 6.0.