chromaui / learnstorybook-code

Code for Learn Storybook
https://learnstorybook.com
MIT License
396 stars 1.21k forks source link

How to add unit testing to this vuejs project? #62

Closed minikiller closed 3 years ago

minikiller commented 3 years ago

I found a addon @storybook/addon-jest, but it can not run under vuejs. So I want to know ,how to add unit testing in storybook. I want to see testing result in storybook . Thanks.

jonniebigodes commented 3 years ago

@minikiller to give you a bit of context. This repo is for the Intro to Storybook tutorial's code and questions/issues associated with it. And your question seems more of a Storybook issue. But I won't mind providing you with some assistance on this. One thing I would like to ask you is the following, are you running the addon with Vue 2 or Vue 3?

I haven't tested it with Vue 2, but it should work as expected. I've spun up a repo here with a simple implementation of the Jest addon with Storybook and Vue 3. One caveat to this that I would like to point out. I've adjusted the scripts and instead of you running "yarn storybook" to start Storybook, you now run "yarn storybook-dev", that script will run the unit tests I've created and then start Storybook. If you look at the TaskList story you'll see the addon in action in the Addons panel. To see the implementation you can check the TaskList.stories.js file.

Let me know and we'll go from there. Sounds good?

Stay safe

minikiller commented 3 years ago

Thanks for you help. It works now, I don't know why it has error when I added @storybook/addon-jest to my project. When I run 'yarn storybook', it show 'can't get' in chrome browse. I have to re-install whole library again. Thanks!!!