Best Frontend Testing System?
For my NextJS app what is the BEST software out there for a small freelance team to create tests for our clients projects so as we develop we ensure each input, form, page, drawer, etc have the info and function as they need.
Bonus if it connects to github to pass / fail pull requests based on those tests.
Also we will be using Vercel for hosting on most if not all platforms if that info is helpful.
What do you guys recommend?
13 Replies
the best frontend testing is clicking around
holy shit
u just gave me a business idea
frontend integration testing as a service
ššæ
Dont use jokes in responding to #questions, its not helpful or constructive to people seeking actual guidance.
Disclaimer: I'm still exploring frontend testing myself
Jest + react-testing-library might be worth looking into for unit & integration tests
Cypress for e2e tests, integration tests, component tests, unit tests
OR
Playwright for the occasional e2e tests using real browsers
Testing Frameworks for Javascript | Write, Run, Debug | Cypress
Simplify front-end testing with Cypress' open-source app. Explore our versatile testing frameworks for browser-based applications and components.
Fast and reliable end-to-end testing for modern web apps | Playwright
Cross-browser end-to-end testing for modern web apps
PostHog for analytics, feature flags and A/B testing; open-source and can be self-hosted
PostHog - How developers build successful products
PostHog is the only all-in-one platform for product analytics, feature flags, session replays, A/B testing, and surveys that's built for developers.
Honestly "best" is subjective, so you would have to experiment to see what works for you. But all the tests you write can be run in GitHub workflows.
Really appreciate this info! Hectic day will have time to check these this weekend probs but thanks again.
I know I said "best" to me that means easiests with best tool suite. As I saw some librarys can take hour stos etup simple tests for simple pages. We have built some pretty complex pages so looking for something that really streamlines the process.
I saw some that use a "recording" to see what you do then you say what you expected those seems easy and cool but yeah thats what I meant haha.
Will let you know when I go over š
I am more a Vitest advocate, Jest is getting old and having harder and harder time keeping up with the ecosystem changes
oh yes Vitest! I've been slowly migrating to it from Jest
for unit tests: vitest + testing library
for browser tests: playwright
it will most likely take you hours to get a good setup, and write tests. that's how it is.
Thanks guys!
@cje so I assume vitest tests direct functions and not user style usage
Read the testing library docs
š
So I see the difference, but It seems they really do the same thing just playwright has a more real user experience since it tests directly by emulating browser where as vitest just calls the component ensuring text and others are there
Obviously playwright has a slight advantage as its as close as can be to a real user experience, but hypothetically is vitest enough?
an AI thread helped with this haha
Vitest is great for backend and Playwright is best for frontend. So combined we can ensure both are perfect (assuming the tests are comprehensive of course š ) thanks guys!
This is the way