Options addon must be configured *after* the preview has rendered in React Native

[tmeasday]

As the addon channel is not created until render time in React Native (see #1191), we cannot call setOptions until after that has happened. In practice, this currently means in a setTimeout block:

const StorybookUI = getStorybookUI({ ... });
setTimeout(() => setOptions({ ... }), 1000);

Reproduction

#815 (comment)

[slorber]

Hi,

I'm not using RN but i got the error pointing to this issue after upgrading, is it normal?

[tmeasday]

@slorber -- sorry i missed this. I think this error can sometimes happen if your node_modules gets messed up and you have two versions of @storybook/addons, too.

[tmeasday]

We should see if #2711 can be used to resolve this.

[slorber]

Will check next time I work on my storybook, haven't updated it for a while

[danielkcz]

@tmeasday So is there some viable solution/workaround as of now? The #2711 has been merged, but I am not sure how that can be used actually.

[tmeasday]

@FredyC -- the workaround of calling from a timeout should still work.

I believe it turned out #2711 was an event from the manager side when the channel was created -- a similar change would be needed on the preview side to solve this issue (if I remember right). If someone is game to give it a go, it would be great! I think most of the core team doesn't use RN and is a little afraid to touch it, unfortunately.

[danielkcz]

Actually, I just updated all packages yesterday and suddenly it seems to be working without any change. I guess some other change might have fixed it?

"@storybook/addon-actions": "^3.3.15",
"@storybook/addon-links": "^3.3.15",
"@storybook/react-native": "^3.3.15",

[danielduan]

can we verify that this has been fixed and close this ticket? @FredyC @tmeasday?

[danielkcz]

Well, it seems more like a random issue. Even with those updated packages, I have seen that error time to time so I ended up with the timeout workaround which seems to be working so far, but it would be nice to have a proper solution for that.

[Gongreg]

@FredyC, hey. You are correct that this is a random issue. And the fix shouldn't be difficult. I would like to say that we can add the event to fix this issue (I would personally do it), but I have already failed multiple times to finish the functionality I am currently working on. If nobody will take this issue I will fix it, but I can't guarantee when I will do it. Sorry for that.

[tmeasday]

@danielduan as far as I know this remains an issue. I have not quite been brave enough to touch RN (which i don't use personally day-to-day) to try and resolve it, but I suspect it wouldn't be very hard to fix.

[xeroxoid]

Any news on this? Keep randomly getting it all day long today.

[Gongreg]

Hey, sorry for no bringing up no information, this issue was buried deep.

#3903 will solve this issue.
The channel will be created as soon as you call getStorybookUI instead of in middle of react render.

So you will be able to call:

const UI = getStorybookUI({...});

setOptions({...})

and you won't have to use any timeouts.

[Gongreg]

The #3903 was merged into the master. In Storybook v4 this issue is solved.