When we designed our product, we knew that the right framework was critical to delivering the magic, zero-effort experience our customers were looking for. In the world of E2E test automation there are two major frameworks: Cypress and Playwright. Selenium is still around but its usage is dwindling. While Cypress and Playwright both have their benefits, we found that Microsoft Playwright was better than Cypress as the foundation of our product for a few simple reasons:
Let’s dig into each of those reasons, as well as scenarios where you might prefer to use Cypress.
Playwright‘s architecture makes it possible to automate our customers’ most complex use cases, many of which Cypress isn’t equipped to handle. For instance, Playwright can handle workflows that use multiple tabs, multiple browsers, multiple domains, or multiple users in the same test. Furthermore, Playwright can even test browser extensions and supports camera and microphone emulation.
On the other hand, Cypress runs “in-process,” meaning in this case that it needs to start a browser and is therefore prevented from taking certain actions that the browser treats as security constraints, such as writing to the file system.
While Cypress has added plug-in support for cross-domain testing, iFrames, and other common technologies, Playwright’s implementations are more mature and included natively in the codebase.
Any front end developer familiar with JavaScript will instantly understand the Playwright API. It uses standard promises instead of method chaining, (i.e. fluent syntax) so JavaScript developers can read the code and understand it intuitively without even needing to look at the documentation.
Arguably the biggest reason you would choose Cypress over Playwright is due to Cypress's large thriving developer community. Cypress has been around for 5+ years and has 5M+ downloads as of this writing compared to Playwright’s 1M+ downloads.
But Playwright isn’t just some weekend project; it's backed by a scrappy little team in Seattle called Microsoft. Despite being the newer kid on the block, Playwright has surpassed Cypress in GitHub Stars.
Don’t get us wrong: The competition between Cypress and Playwright continues to drive innovation — we hope Cypress continues to grow and thrive. But looking at it from a customer perspective, Playwright is a better solution and our expertise using it more than makes up for the smaller (for now) community.
Our customers get reliability benefits from Playwright’s approach to adding new features. The Cypress team takes a non-native approach by using plugins, which don’t always play nicely with each other and may create conflicts with existing projects. On the other hand, Playwright adds features directly into the code base. This architecture results in more reliable builds with fewer dependencies, and less likelihood that test code build will break. At last count, Cypress had more than 160 dependencies. Not including the optional browser installation, Playwright has only four. Consequently, Playwright builds are less likely to encounter build conflicts and will require less frequent updating than Cypress builds. The last thing you want when you’re trying to push new features is a dependency conflict in your test suite.
Playwright also helps our customers because it's faster than Cypress. Faster test runs mean faster results so that developers aren't babysitting their builds and waiting for feedback. Faster feedback means more engineering time, more productivity, and higher velocity. The impact of that is obvious: developers spend more time writing code, and the company spends less on rework. From a technical standpoint, Playwright’s WebSocket architecture gives it easier access to the elements on a given page, making it as much as four times faster (according to both Applitools and LambdaTest) than Cypress, which uses an internal proxy middle-man. Yes, we’re talking about milliseconds, but when you are running hundreds or thousands of tests with every build and you're starting to increase your build frequency, those millis add up quickly.
Most developers need to consult the Cypress documentation to understand the code, particularly when it comes to Cypress’s implementation of Promises, its idiosyncratic assertion scopes, and its non-standard configuration mechanisms. While some favor its alias-based waiting method, Cypress still allows ample opportunities for testers in a hurry to add hard-coded waits which can eventually cause tests to become brittle. In Playwright, almost everything is enclosed in 'await', which assures the availability of a given element in the DOM extremely quickly.
For cross-browser testing, Playwright supports more browsers because their team has been actively submitting patches for browsers that don’t use Chrome DevTools Protocol (CDP). These patches don’t work for Cypress though because while it does use CDP, as mentioned above, it also uses an internal proxy that falls outside of CDP. Furthermore, Playwright can be run in headless mode, which can save a bunch of time in your test setup phase.
Playwright has built in-browser emulation for mobile devices based on the target device, including user agent headers. Cypress doesn’t support mobile devices nor does it allow modification of user agent headers.
QA Wolf uses the JavaScript Bindings. However, Playwright has bindings so you can write your tests in Typescript, Python, Java, and .NET. Cypress only supports JavaScript and Typescript.
Playwright allows you to run tests using Jest/Jasmine, AVA, or Mocha. Cypress only supports Mocha, which is a BDD-style framework.
Cypress has been around since 2017, and in that time a massive community has created tutorials, guides, and videos that you can find on StackOverflow, YouTube, and by googling.
If you’re considering an in-house team, most people you talk to are going to be familiar with Cypress and it’s always easier to use what you know versus learning something new.
Cypress’s Dashboard (a paid product, by the way) gives you a lot of cool debugging and observability features. One such example is “Flaky Test Manager," which gives a historical view of tests that both pass and fail. Playwright added a UI view recently, but it's not as good as Cypress's yet. Or to get something similar, you can install VSCode and add IDE plugins. If for some reason VSCode is a showstopper for you, Cypress is worth checking out.
We love to talk about testing frameworks — and we’re happy to chat about which one makes sense for you, even if you’re not ready to become a customer. Drop your email below to schedule a meeting, and let us show you how Playwright powers a completely zero-effort QA solution.
QA Wolf is a hybrid platform & service that helps software teams ship better software faster by taking QA completely off their plate.
© 2024 QA Wolf, Inc.
