Storybook with react-native doesn't load

[Deltaxel]

Hi all,

I followed the following tutorial https://storybook.js.org/tutorials/intro-to-storybook/react-native/en
There was no issues during installation. The step for @storybook/addon-ondevice-actions was not even needed as it is installed by default in current version.
However, when running yarn storybook, the editor doesn't load properly.

Is this a known issue? Is there a way to fix it?

[jonniebigodes]

@Deltaxel thanks for reaching out and let us know of your issue with the tutorial, we really appreciate it. To give you some context on this, the React Native version of the tutorial is in dire need of some TLC, we're well aware of it. In the near future, I'll be following up with the maintainer and see how far along he's progressed with the new release of Storybook for React Native and also implement a similar structure as the other versions of the tutorial so that you and any other React Native developers get a similar experience, without the need to "jump through hoops" to get started with Storybook. Once we've come up with a timeline and plan we'll be applying those changes and update the tutorial. With that out of the way, i would like to ask you something, what happens if you spin up the simulator first and then start Storybook? Are you able to see the stories being rendered? Let me know so that I can factor in this tiny but crucial piece of information.

Have a fantastic day!

Stay safe

[Deltaxel]

Hi @jonniebigodes, thanks for your reply.
Staring the project using expo start, regardless of the platform, works. For that, I replaced the content of App.tsx by export { default } from './storybook';
However, the UI displayed is clearly not as nice and usable. It's fine for mobile version, but when you're app target other platform too (web or desktop) where touchscreen is not available, this is quite unpleasant to use.
The real problem though, is not how 'nice' the UI is. The problem is that changes are not reflected until an action is done on the device and cause a refresh of the component. This is rather painful and push you to remove storybook completely.

Maybe there is a way to change the App.tsx file so the 'nice' UI is being used while running properly. Do you know of such possibility?

[jonniebigodes]

Closing this for now in favor of #608