As an automation engineer, I've been closely following the evolution of UI testing frameworks.
In 2024, Playwright and Cypress stand out as the top choices for many engineering teams. Both have left Selenium and other predecessors in the dust with their advanced capabilities.
Let's dive into the key differences between these frameworks to help you decide which one best fits your needs.
Cypress is an open-source automation framework for web app testing that's been gaining popularity since 2019-2020.
It uses only JavaScript or TypeScript, running tests inside the browser. This architectural choice contributes to extremely stable test execution.
Cypress provides an all-in-one solution for functional end-to-end UI automation.
Playwright is an open-source automation framework developed by Microsoft, gaining traction since 2020-2021.
While its main API was originally written in Node.js, it supports multiple languages including JavaScript, Python, C#, and Java through its API. However, TypeScript or JavaScript is recommended for the latest features and better community support.
Playwright uses a web socket connection to interact with the browser, making it faster and more reliable than the web-driver approach used in Selenium and other open-source frameworks.
Like Cypress, Playwright offers a comprehensive all-in-one solution for functional end-to-end UI automation.
Both Cypress and Playwright are highly capable and performant compared to other frameworks on the market. They share many features, including:
...and many more. But, let's better talk about limitations.
Playwright does not have visible limitations, offering a powerful, flexible, and fully open-source framework. Microsoft seems to be using Playwright as a way to showcase its expertise in the testing field beating Google with their
Puppeteer framework. Big boys play their own game :)
Cypress, being a commercial product, has some limitations, and some of them mentioned in the
documentation:
-
New Tab Handling
-
Cypress cannot handle multiple browser tabs due to its in-browser execution. If you need to switch to a new tab, you will not be able to do it.
-
Parallel Execution
-
Cypress requires the use of the Cypress Cloud service for parallel runs. Before
September 2023 you could use a free service
"Sorry Cypress" or cheaper
Currents.dev. But not anymore.
-
iFrame Support
-
Requires custom code or
additional packages for automation. Even with that, interacting with iFrames can be flaky
-
No Built-in Visual Testing
-
Requires
additional plugins or third-party services
Both Playwright and Cypress significantly outpace Selenium-based frameworks in terms of execution speed.
Playwright's parallel execution is limited only by your server's power.
By default, it uses half of the available logical CPUs, running one parallel thread per CPU. For increased parallelism, you can implement "sharding", grouping multiple servers for a single test run.Cypress runs tests in parallel, load balancing by "spec" file.
One "spec" file can be executed per server or VM. The Cypress Cloud service manages load balancing for test runs.For long end-to-end tests, both frameworks perform similarly. However, with a large number of small, unit-like tests, Playwright tends to outperform Cypress.
Cypress generally requires fewer lines of code to automate the same functionality compared to Playwright.
Playwright provides a more traditional developer experience. Its syntax will feel more natural to those already familiar with TypeScript or JavaScript.
While it may require more lines of code, the structure is often more intuitive for experienced developers.
Here are some code examples to illustrate the differences:
Example 1: Typing text into an input field
Cypress:
Playwright:
Example 2: Assertions
Cypress:
Playwright:
Example 3: Page Objects
Cypress:
Playwright:
Summary: In Playwright you will need to use a little bit more code to automate the same functionality compared to Cyrpress.
Playwright has been gaining significant traction since late 2023.
As of June 2nd, 2024, Playwright surpassed Cypress in weekly downloads according to
npmtrends.
This shift could be due to Cypress's mandatory Cloud service requirement for parallel execution or Playwright's growing recognition as a capable tool.
Go with Cypress if:
-
You need to write test automation scripts quickly
-
Your application is small or you don't have a large number of tests
-
Your company is willing to pay for Cypress Cloud
-
Your application doesn't use new tabs or iFrames
Go with Playwright if:
-
You prefer a more traditional development experience
-
You're working on a large project with many tests requiring parallel execution
-
Your company doesn't have a budget for Cypress Cloud
-
Your application uses new tabs, iFrames, or requires visual testing
Both Cypress and Playwright are excellent frameworks that will remain relevant in the coming years. More companies are likely to switch from Selenium-based frameworks to these modern alternatives.
Your success with either framework will depend more on how you use it rather than the framework itself. Always follow the framework's best practices, starting with the documentation before writing your first line of code.
If you're interested in learning more about Playwright, I invite you to check out my course
"SDET with Playwright" at Bondar Academy.
In this course, I'll guide you through the framework, best practices, and efficient techniques, starting from scratch for those new to automation.Remember, the choice between Cypress and Playwright ultimately depends on your specific project requirements and team preferences. Both frameworks offer powerful features for UI automation, and either can be an excellent choice when used correctly.
