storybook: Knobs do not update in Storybook 5.2.0 release candidate, or 5.2.1

Describe the bug Knobs don’t continue to update the component.

To Reproduce https://cbinsights.github.io/form-design-system/fds-components/?path=/story/interactive-button--knobs

Go to the button and toggle the “disabled” knob on and off.

Our design system is thankfully open source, so you can try this out locally too:

https://github.com/cbinsights/form-design-system

Clone the above repo, and run yarn && yarn build:full && yarn storybook to install all dependencies and run storybook, and try to disable that button, same as on that URL above.

Now I did a bisect on this, and was able to nail down the commit that introduces this bug: 3fa319cb7bef80a82be1a1a462f7962b0dbc8379 which is the storybook upgrade to the release candidate 5.2.0 (note: updating to 5.2.1 does not fix this either)

So if you go to the commit prior: be0ead9857a40e2c720f0b8d162dc40adfa77743 and yarn install --force, you’ll notice that everything fixes itself. I believe this is pretty much a smoking gun (to be fair, maybe I’m doing something that isn’t supported in newer versions of Storybook too).

Expected behavior It’s expected for the knobs to continue to update… they do not.

(final note: none of the errors in the console.log are the direct result of this problem. I’ve fixed a lot of those locally and the problem still occurs).

Screenshots N/A

Code snippets N/A

System:

Environment Info:

  System:
    OS: macOS 10.14.5
    CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
  Binaries:
    Node: 10.16.0 - /usr/local/bin/node
    Yarn: 1.16.0 - /usr/local/bin/yarn
    npm: 6.9.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 77.0.3865.90
    Firefox: 67.0.1
    Safari: 12.1.1
  npmPackages:
    @storybook/addon-actions: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/addon-centered: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/addon-knobs: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/addon-links: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/addon-notes: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/addons: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/react: ^5.2.0-rc.11 => 5.2.0-rc.11 
    @storybook/theming: ^5.2.0-rc.11 => 5.2.0-rc.11

Additional context N/A

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 3
Comments: 15 (7 by maintainers)

Most upvoted comments

Yippee!! I just released https://github.com/storybookjs/storybook/releases/tag/v5.3.0-alpha.9 containing PR #8287 that references this issue. Upgrade today to try it out!

You can find this prerelease on the @next NPM tag.

Closing this issue. Please re-open if you think there’s still more to do.

shilman on Oct 4, 2019

I’m using react-docgen-typescript-loader and I don’t have storybook-addon-react-docgen installed, so hipstersmoothie/storybook-addon-react-docgen#49 isn’t a workaround for me.

dcecile on Sep 24, 2019

@shilman yes, it’s related. More precisely, the problem is storybook-addon-react-docgen decorator calling getStory(context) three times. It’s actually fixed by https://github.com/hipstersmoothie/storybook-addon-react-docgen/pull/49, so the issue doesn’t reproduce with storybook-addon-react-docgen@1.2.21. @rey-wright please upgrade to this version

Nevertheless, seems like we have a bug in useEffect: it adds multiple instances of the same effect on synchronous rerender, which may lead to issues when using synchronous setState

Hypnosphi on Sep 23, 2019

@dcecile yes please

Hypnosphi on Oct 4, 2019

I am also facing the same issue after upgrading to 5.2.0 version. it was working with 5.1.11 but the viewport add-on not working in 5.1.11 so I upgraded to 5.2.0 and now viewport is working fine but the knobs changes are not working after once (if I change any knob input it update the component once, after no response for any knob change).

sathishj21 on Sep 23, 2019