Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Cypress vs. Playwright
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Matija Marohnić
September 28, 2022
Programming
0
160
Cypress vs. Playwright
Matija Marohnić
September 28, 2022
Tweet
Share
More Decks by Matija Marohnić
See All by Matija Marohnić
Goodbye jsdom/happy-dom, hello Vitest Browser Mode!
silvenon
0
9
Introduction to Remix
silvenon
0
140
Studying Strapi: an open source head headless CMS
silvenon
0
48
CSS Specificity
silvenon
0
46
Make your JavaScript projects more accessible to newcomers
silvenon
0
78
React Hooks
silvenon
0
84
PostCSS
silvenon
0
45
CSS Custom Properties
silvenon
0
41
Maintainable Integration Testing in React
silvenon
0
48
Other Decks in Programming
See All in Programming
CSC307 Lecture 05
javiergs
PRO
0
500
CSC307 Lecture 07
javiergs
PRO
0
550
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
AI によるインシデント初動調査の自動化を行う AI インシデントコマンダーを作った話
azukiazusa1
1
720
疑似コードによるプロンプト記述、どのくらい正確に実行される?
kokuyouwind
0
380
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
masahiro_nishimi
5
440
15年続くIoTサービスのSREエンジニアが挑む分散トレーシング導入
melonps
2
200
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
140
AIによる高速開発をどう制御するか? ガードレール設置で開発速度と品質を両立させたチームの事例
tonkotsuboy_com
7
2.3k
Fluid Templating in TYPO3 14
s2b
0
130
React 19でつくる「気持ちいいUI」- 楽観的UIのすすめ
himorishige
11
7.4k
AIエージェント、”どう作るか”で差は出るか? / AI Agents: Does the "How" Make a Difference?
rkaga
4
2k
Featured
See All Featured
Building Applications with DynamoDB
mza
96
6.9k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
310
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
84
30 Presentation Tips
portentint
PRO
1
210
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
62
49k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.8k
Evolving SEO for Evolving Search Engines
ryanjones
0
120
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
910
The untapped power of vector embeddings
frankvandijk
1
1.6k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Claude Code のすすめ
schroneko
67
210k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
180
Transcript
Matija Marohnić Cypress vs. Playwright End-to-end testing showdown https://silvenon.com/blog/e2e-testing-with-cypress-vs-playwright
My experience with Cypress
Background • prior experience with tools like WebdriverIO • used
Cypress for a long time • friendlier API • approachable • but eventually mostly for critical functionality
Speed • 5 tests = 45s (locally) • compared to
my other optimizations it became uncomfortable • started writing less tests 💔
GUI 🤷
GUI
API • familiarity = jQuery 😔 • won’t look familiar
to any new developers
API • should = expect
API • wrap objects to make assertions • another round
of jQuery for everyone! 🍻
API • synchronous…? • commands are queued to be run
later
Meet Playwright 🎭
Background • new testing framework by Microsoft • haven’t used
it in any serious projects yet • only side projects
Supports WebKit • unlike Cypress, Playwright supports Safari • Safari’s
support table can be uncomfortable, so it’s really useful
Headless by default • seemed odd at fi rst •
turned out to be a great feature • less clutter, no dashboards or browsers • run headed only when you need to debug
Speed • 13 tests = 3s ⚡ • more than
2x as many tests = 15x faster • speed is no longer an issue • started testing every square inch of my blog
API • asynchronous, almost everything needs to be awaited
API • at fi rst repetitive and error-prone, mistakes aren’t
always obvious • but gives full control over execution order, more transparent
API • uses Jest’s expect library for assertions, so looks
more like a unit test • doesn’t need a Testing Library plugin, locators are powerful
VS Code extension 🤯 • killer feature • makes Playwright
really e ffi cient to use! • run a test just by clicking on it, and much more • a more balanced approach to GUI — stay in your text editor • 👨💻
…and so much more!
• I’m always excited to learn more about Playwright •
it makes me want to write more tests 🥳