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
c2
c2ā€¢6mo ago
the best frontend testing is clicking around holy shit u just gave me a business idea frontend integration testing as a service šŸ‘šŸæ
JacobMGEvans
JacobMGEvansā€¢6mo ago
Dont use jokes in responding to #questions, its not helpful or constructive to people seeking actual guidance.
DevKoko
DevKokoā€¢6mo ago
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
DevKoko
DevKokoā€¢6mo ago
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.
DevKoko
DevKokoā€¢6mo ago
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.
oz
ozOPā€¢6mo ago
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 šŸ™‚
JacobMGEvans
JacobMGEvansā€¢6mo ago
I am more a Vitest advocate, Jest is getting old and having harder and harder time keeping up with the ecosystem changes
DevKoko
DevKokoā€¢6mo ago
oh yes Vitest! I've been slowly migrating to it from Jest
cje
cjeā€¢6mo ago
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.
oz
ozOPā€¢6mo ago
Thanks guys! @cje so I assume vitest tests direct functions and not user style usage
cje
cjeā€¢6mo ago
Read the testing library docs
oz
ozOPā€¢6mo ago
šŸ‘ 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!
JacobMGEvans
JacobMGEvansā€¢6mo ago
This is the way
Want results from more Discord servers?
Add your server