Knobs Addon broken on master

[danielduan]

I have storybook, knobs, and info all npm linked from the latest master to my source project directory.

With a very simple test project, I get an error for Cannot read property 'removeListener' of null

TypeError: Cannot read property 'removeListener' of null
    at WrapStory.componentWillUnmount (http://localhost:9001/static/preview.bundle.js:65836:25)
    at http://localhost:9001/static/preview.bundle.js:40392:25
    at measureLifeCyclePerf (http://localhost:9001/static/preview.bundle.js:40058:12)
    at ReactCompositeComponentWrapper.unmountComponent (http://localhost:9001/static/preview.bundle.js:40391:11)
    at Object.unmountComponent (http://localhost:9001/static/preview.bundle.js:9558:22)
    at ReactCompositeComponentWrapper.unmountComponent (http://localhost:9001/static/preview.bundle.js:40401:23)
    at Object.unmountComponent (http://localhost:9001/static/preview.bundle.js:9558:22)
    at unmountComponentFromNode (http://localhost:9001/static/preview.bundle.js:20479:19)
    at ReactDefaultBatchingStrategyTransaction.perform (http://localhost:9001/static/preview.bundle.js:11839:20)
    at Object.batchedUpdates (http://localhost:9001/static/preview.bundle.js:43977:26)

test.story.jsx:

import React from 'react';
import { storiesOf, action } from '@kadira/storybook';
import { withKnobs, text, boolean, number } from '@kadira/storybook-addon-knobs';

const story = storiesOf('Test', module);
story.addDecorator(withKnobs);

story.add('with text', () => (
  <span>hello world</span>
));

addon.js

//  To get our default addons (actions and links)
import '@kadira/storybook/addons';
//  To add the knobs addon
import '@kadira/storybook-addon-knobs/register';

config.js

import { configure, setAddon } from '@kadira/storybook';
import infoAddon from '@kadira/react-storybook-addon-info';

const req = require.context('../stories', true, /.stories.jsx$/);

function loadStories() {
  req.keys().forEach((filename) => req(filename));
}

setAddon(infoAddon);
configure(loadStories, module);

I realize I'm not actually using the knobs text() option, but if I do, I still get the same error.

[ndelangen]

Hey @danielduan Do you think you could give this PR branch a try?

#1008

[danielduan]

@ndelangen Yup, just gave it a shot. I'm still getting the same error.

Cannot read property 'removeListener' of null
TypeError: Cannot read property 'removeListener' of null
    at WrapStory.componentWillUnmount (http://localhost:9001/static/preview.bundle.js:65733:25)
    at http://localhost:9001/static/preview.bundle.js:36181:25
    at measureLifeCyclePerf (http://localhost:9001/static/preview.bundle.js:35847:12)
    at ReactCompositeComponentWrapper.unmountComponent (http://localhost:9001/static/preview.bundle.js:36180:11)
    at Object.unmountComponent (http://localhost:9001/static/preview.bundle.js:5266:22)
    at ReactCompositeComponentWrapper.unmountComponent (http://localhost:9001/static/preview.bundle.js:36190:23)
    at Object.unmountComponent (http://localhost:9001/static/preview.bundle.js:5266:22)
    at unmountComponentFromNode (http://localhost:9001/static/preview.bundle.js:16225:19)
    at ReactDefaultBatchingStrategyTransaction.perform (http://localhost:9001/static/preview.bundle.js:7575:20)
    at Object.batchedUpdates (http://localhost:9001/static/preview.bundle.js:39766:26)

I tried it with the example in the knobs readme as well: https://github.com/storybooks/storybook/tree/master/packages/addon-knobs

It seems to crash when I reload the page. It renders everything the first time fine.

[ndelangen]

Can you help me reproduce this locally?

[danielduan]

Let me try to send you the few files I have set up through slack.

[ndelangen]

I've added knobs to the storybooks.js.org storybook, and it works great. I think this has been fixed, let me know if you are still having problems, and re-open. Thanks!

[eljusto]

I still encounter such error even in sample project.
Here is my package.json:

  ¦ react: ^15.5.4,
  ¦ react-dom: ^15.5.4
  },
  devDependencies: {
  ¦ @kadira/storybook: ^2.35.3,
  ¦ @storybook/addon-knobs: ^3.0.0-alpha.0,
  ¦ @storybook/addons: ^3.0.0-alpha.0,
  ¦ react-scripts: 0.9.x
  },

Cannot read property 'removeListener' of null
TypeError: Cannot read property 'removeListener' of null
    at WrapStory.componentWillUnmount (webpack:///./~/@storybook/addon-knobs/dist/components/WrapStory.js?:74:25)
    at eval (webpack:///./~/react-dom/lib/ReactCompositeComponent.js?:409:25)
    at measureLifeCyclePerf (webpack:///./~/react-dom/lib/ReactCompositeComponent.js?:75:12)
    at ReactCompositeComponentWrapper.unmountComponent (webpack:///./~/react-dom/lib/ReactCompositeComponent.js?:408:11)
    at Object.unmountComponent (webpack:///./~/react-dom/lib/ReactReconciler.js?:79:22)
    at ReactCompositeComponentWrapper.unmountComponent (webpack:///./~/react-dom/lib/ReactCompositeComponent.js?:418:23)
    at Object.unmountComponent (webpack:///./~/react-dom/lib/ReactReconciler.js?:79:22)
    at unmountComponentFromNode (webpack:///./~/react-dom/lib/ReactMount.js?:143:19)
    at ReactDefaultBatchingStrategyTransaction.perform (webpack:///./~/react-dom/lib/Transaction.js?:140:20)
    at Object.batchedUpdates (webpack:///./~/react-dom/lib/ReactDefaultBatchingStrategy.js?:62:26)```

[ndelangen]

don't mix 2.x.x with 3.x.x, they are not compatible.

You can upgrade to the latest alpha by installing:

npm i @storybook/react

This package would replace @kadira/storybook

Let me know if you need further help 👍

[eljusto]

Yes, it works. Thank you!