search

fwouts / react-screenshot-test

A dead simple library to screenshot test React components
https://www.npmjs.com/package/react-screenshot-test
MIT License
618 stars 24 forks source link

Feat: Vue.js Support #302

Closed HelloAlexPan closed 3 years ago

HelloAlexPan commented 3 years ago

Hey @fwouts! How hard do you think it would be to port this for Vue?

I stumbled across this project on Twitter, and my team is literally in the process of building the same thing but for Vue.

Would you have any advice on porting this to vue, and if you would be willing to merge a vue version to this project for better maintenance?

fwouts commented 3 years ago

Hi @HelloAlexPan!

Thanks for the question. I hadn't thought of this, and now that I do, I realise there is surprisingly little code tied to React in this library. Probably not very hard!

I'd invite you to read through the technical docs, but you'll see that the main piece that would need to be updated is ReactComponentServer. Everything else is agnostic of React. We could implement a Vue version based on Vue SSR, and that might be most of the work done already for a port.

The next question would be what the tests themselves would look like. How do you envision a Vue screenshot test looking like? Would you use JSX syntax, or invoke a Vue template somehow?

You should also be aware of one important limitation of react-screenshot-test: it only supports server-side rendering. There is no client-side hydration—in fact, react-screenshot-test purely generates a static HTML page with no JS. Would this be a reasonable limitation for you?

If not, I'm currently building https://reactpreview.com, which could probably be extended to Vue with some extra work. While React Preview is a VS Code extension, I was thinking of building a more powerful version of react-screenshot-test using the same foundations, supporting client-side rendering. This probably won't be open-source however (I've left my job to focus on this, so I need to make money somehow).

I see that you're also in Sydney—wanna grab a coffee? If so PM me on Twitter or LinkedIn :)

HelloAlexPan commented 3 years ago

Hey @fwouts! Awesome, thanks for your guidance!

I've forwarded the above to our team and will continue to update thread with any questions/updates to our build. Hopefully we can make some good contributions to this awesome project.

Would love to grab coffee!! I'll shoot you a message over twitter :)

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.