storybook: Error when clicking on the menu item on React 16

Workaround: https://github.com/storybooks/storybook/issues/1965#issuecomment-336912108 (https://github.com/storybooks/storybook/issues/1965#issuecomment-335414898)

I’ve updated to react 16 and there’s this strange error: when I click on any menu item (to open other story or group) I have blank screen (nothing at all is rendered).

I use yarn storybook to start storybook.

yarn run v1.1.0
$ start-storybook -p 9009 -s public
@storybook/react v3.2.12
=> Loading static files from: /home/mozgiii/Desktop/truvest/webapp/public .
=> Loading custom addons config.
=> Using default webpack setup based on "Create React App".
webpack built 8fda9afa05b5574a775e in 5531ms                                              
Storybook started on => http://localhost:9009/

Initially page loads on the first story. Looks ok so far, but there are some errors in the console: image image

Here’s the log as saved by chrome: localhost-1507074821359.log

Now, when I click on any menu item something bad happends and I have blank screen. There are new errors in the console: image image Some skipped, it’s only the beginning and the end…

New log: localhost-1507075072650.log

I have no idea why this is happening. I tried using react 15 again and it works there. I’ve also tried removing all my storeis and using only standard “welcome” with the same results - I think it means the issue is somewhere in the package.

I’m using CRA, here’s some info on my setup:

Keywords:

  • Uncaught TypeError: Cannot read property 'velocity1507074569941' of null
  • The above error occurred in the <TransitionGroup> component:

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 4
  • Comments: 24 (11 by maintainers)

Most upvoted comments

a temporary workaround I found with this issue (as upgrading to 3.2.12 wasn’t enough), is to use the options addon and set sidebarAnimations to false.

react-treebeard uses velocity-react for those animations and somehow it’s not working anymore with React16.

It works! So it was a yarn bug all along… Thank you very much.

@Hypnosphi if you need a project to see the issue you can use https://github.com/algolia/react-instantsearch and just remove the sidebarAnimations config.

Thanks @mthuret Disabling animations worked, but heads up for future readers - the option is sidebarAnimations: false, the comment above is missing the s at the end of Animations.