Storybook: [addon-knobs] perfomances issues especially when editing text or numbers

Created on 14 Mar 2019  路  6Comments  路  Source: storybookjs/storybook

Describe the bug
Using @storybook/addon-knobs in a storybook created with React and experiencing performance issues, especially when editing text or number. Here is a simple example of a story that I used:

storiesOf('Components', module) .addDecorator(withKnobs) .add('with editable text', () => <div>{text('Text', 'Some text')}</div> )

To Reproduce
Steps to reproduce the behavior:

Just go to this example storybook built in React, go to the Knobs tab, and edit the "optional" text:

https://storybooks-official.netlify.com/?path=/story/addons-knobs-withknobs--dynamic-knobs

When you start doing a mix of typing and erasing text, some of your text disappears or previously written text is suddenly added.

This storybook was the first example given for Storybook 5.0 found on the main storybook website:

https://storybook.js.org/docs/basics/live-examples/

Expected behavior
Edit the text without having some text removed or added while typing.

System:

  • OS: MacOS
  • Device: Macbook Pro 2015
  • Browser: Chrome
  • Framework: react
  • Addons: Knobs
  • Version: 5.0.x
knobs bug

Most helpful comment

Looks like I need to release a stable version with this fix: https://github.com/storybooks/storybook/pull/6022

@sangbpark94 @ruudyroon Would you mind trying out the latest 5.1-alpha?

I'll release the fix on latest later today.

All 6 comments

Facing the exact same issue.

@sanbpark94 & @ruudyroon Which version are you using?

Looks like I need to release a stable version with this fix: https://github.com/storybooks/storybook/pull/6022

@sangbpark94 @ruudyroon Would you mind trying out the latest 5.1-alpha?

I'll release the fix on latest later today.

Just gave v5.1.0-alpha.6 a test and it looks like the bug is resolved!

Thanks for testing it out @sangbpark94!

It seems all is well. Closed.

Was this page helpful?
0 / 5 - 0 ratings