What's an equivalent to Meteor.startup in Storybook

Eric Burel

I've been trying to integrate Vulcan.js, a Meteor framework, with Storybook. The difficulty comes from the differences in build system. Currently, we are able to load some specific Meteor packages in Storybook using Webpack.

So, now we need to mimick some additional Meteor features in Storybook. We rely on a Meteor.startup() callback to initialize a specific React component that is a registry of other components. However I can't find any equivalent pattern in Storybook.

The characteristic of a callback registered with Meteor.startup() are as following:

  • it is run after the app is build. So it is not possible to just write a "startup" file and import it, because it will run too soon, the registry will still be empty
  • it is run before stories are actually rendered or loaded. Basically Meteor.startup callbacks are guaranteed to be the first function to be run. So calling relevant function in a decorator may be too late.
  • it is called only once. This is not a strong requirement as we can bypass it by writing callbacks as pure function but it's better to avoid multiple calls.

I've tried writing an addon, but it does not work as addons have their own build system. Therefore they can't access our Meteor packages and yet they need them to work correctly.

I've tried writing a decorator. That's an okay solution but I have strange behaviour, because it runs the startup function on every component mount (that's the only way to run them after import but before render). That's my best bet currently but it seems suboptimal.

Last solution is running the code at the top of relevant stories. It works but it's error prone and affects the developer experience

So, here is the question: how would you define a callback in Storybook so that it is run during startup, like Meteor.startup callbacks do?

Fred Stark

If you dig into it, on the client Meteor.startup is just a wrapper around document.addEventListener('DOMContentLoaded', func)

So it should be easy to replicate by listening for the event

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

What is the Linux equivalent of Windows Startup?

分類Dev

StorybookのMeteor.startupに相当するものは何ですか

分類Dev

Insert data in collection at Meteor's startup

分類Dev

What is the Matlab equivalent to Python's `not in`?

分類Dev

What is Julia's equivalent of R's which?

分類Dev

What is Perl's equivalent to Ruby's Pry

分類Dev

What's the PHP equivalent of Python's locals()?

分類Dev

What's is the equivalent of to jQuery .one() in AngularJS?

分類Dev

What is Constraint layout's equivalent in Flutter?

分類Dev

What is the Rust equivalent of Scala's value classes?

分類Dev

What is Moq's equivalent of LastCall in RhinoMocks?

分類Dev

What is the RegEx equivalent of ".-" in Lua's pattern matching?

分類Dev

What's the Angular equivalent of Vue <slot/>?

分類Dev

What is the Haskell equivalent of Rust's Read trait?

分類Dev

What's the NSAttributedString conversion equivalent of the <pre> tag?

分類Dev

What is the Python Equivalent of Batch's PAUSE function

分類Dev

Meteor bundle error on startup

分類Dev

What's the docker-compose equivalent of docker run --init?

分類Dev

What's the equivalent of React Native { flex: 1 } for React JS?

分類Dev

what is the Java equivalent of Pythons's subprocess shell=True property?

分類Dev

What's the powershell equivalent to "%~dpn0" in batch?

分類Dev

What's the Debian equivalent of Ubuntu Core/Base images?

分類Dev

What is the Visual Studio TestTools equivalent of NUnit's Assert.Ignore?

分類Dev

What's the equivalent of Array.map for ES6 Map?

分類Dev

What's the Swift equivalent of Objective-C's "#ifdef __IPHONE_11_0"?

分類Dev

What is the PostgreSQL equivalent for ISNULL()

分類Dev

What is the equivalent in Swift to NSParameterAssert?

分類Dev

What is the swift equivalent of this cast?

分類Dev

What is the MutableLiveData equivalent in RxJava?

Related 関連記事

  1. 1

    What is the Linux equivalent of Windows Startup?

  2. 2

    StorybookのMeteor.startupに相当するものは何ですか

  3. 3

    Insert data in collection at Meteor's startup

  4. 4

    What is the Matlab equivalent to Python's `not in`?

  5. 5

    What is Julia's equivalent of R's which?

  6. 6

    What is Perl's equivalent to Ruby's Pry

  7. 7

    What's the PHP equivalent of Python's locals()?

  8. 8

    What's is the equivalent of to jQuery .one() in AngularJS?

  9. 9

    What is Constraint layout's equivalent in Flutter?

  10. 10

    What is the Rust equivalent of Scala's value classes?

  11. 11

    What is Moq's equivalent of LastCall in RhinoMocks?

  12. 12

    What is the RegEx equivalent of ".-" in Lua's pattern matching?

  13. 13

    What's the Angular equivalent of Vue <slot/>?

  14. 14

    What is the Haskell equivalent of Rust's Read trait?

  15. 15

    What's the NSAttributedString conversion equivalent of the <pre> tag?

  16. 16

    What is the Python Equivalent of Batch's PAUSE function

  17. 17

    Meteor bundle error on startup

  18. 18

    What's the docker-compose equivalent of docker run --init?

  19. 19

    What's the equivalent of React Native { flex: 1 } for React JS?

  20. 20

    what is the Java equivalent of Pythons's subprocess shell=True property?

  21. 21

    What's the powershell equivalent to "%~dpn0" in batch?

  22. 22

    What's the Debian equivalent of Ubuntu Core/Base images?

  23. 23

    What is the Visual Studio TestTools equivalent of NUnit's Assert.Ignore?

  24. 24

    What's the equivalent of Array.map for ES6 Map?

  25. 25

    What's the Swift equivalent of Objective-C's "#ifdef __IPHONE_11_0"?

  26. 26

    What is the PostgreSQL equivalent for ISNULL()

  27. 27

    What is the equivalent in Swift to NSParameterAssert?

  28. 28

    What is the swift equivalent of this cast?

  29. 29

    What is the MutableLiveData equivalent in RxJava?

ホットタグ

アーカイブ