Playwright vs Cypress vs Puppeteer: E2E CI production 2026

TL;DR

• Playwright: Recommended default. Cross-browser, paralel, free, TypeScript first-class.
• Cypress: Recommended untuk tim yang butuh Component Testing atau DX lokal superior.
• Puppeteer: Skip untuk E2E suite — gunakan untuk automation/scraping.

Konteks 2026

Di pertengahan 2026, landscape E2E testing sudah relatif settled. Playwright dari Microsoft jelas memimpin adoption di project TypeScript baru. Cypress masih punya basis loyal, terutama di tim frontend yang heavy React. Puppeteer tetap hidup tapi niche shift-nya ke arah automation, bukan testing.

Yang berubah: CI cost menjadi pertimbangan nyata. GitHub Actions minutes tidak gratis tanpa batas, Cypress Cloud harganya naik dua kali sejak 2024, dan tim Indonesia dengan rate card USD merasakan ini lebih dari tim US/EU. Decision ini bukan hanya teknis — ada TCO yang perlu dihitung.

Perbandingan

Dimensi	Playwright	Cypress	Puppeteer
Harga	Free (open source)	Free core, Cloud $67+/bulan	Free (open source)
Browser support	Chromium, Firefox, WebKit	Chrome, Firefox, Edge (terbatas)	Chromium, Firefox
Parallel CI	Native, tanpa config extra	Butuh Cypress Cloud atau config manual	Manual, tidak ada built-in
TypeScript support	First-class, zero config	Good, butuh setup	Good, butuh setup
Debug lokal	UI mode (bagus, bukan great)	Time-travel debugger (excellent)	DevTools manual
Component testing	Experimental	Mature, stabil	Tidak ada
Flaky test handling	Built-in retry + trace	Built-in retry + Cloud dashboard	Manual
Indonesia CI latency	Runner US/EU, acceptable	Runner US/EU, sama	Runner US/EU, sama

Playwright

Playwright adalah pilihan saya untuk project baru sejak 2025. Bukan karena hype, tapi karena hal-hal konkret yang saya alami di pipeline production.

Cross-browser tanpa effort adalah perbedaan paling nyata. Install @playwright/test, jalankan npx playwright install, dan test Anda berjalan di Chromium, Firefox, dan WebKit (Safari engine) tanpa konfigurasi tambahan. Untuk project yang ada user Safari signifikan — dan di Indonesia mobile traffic Safari dari iPhone cukup besar — ini bukan nice-to-have.

Parallelization juga zero-config. Playwright menjalankan test file secara paralel by default. Di CI dengan 50 test, runtime turun dari 8 menit (sequential) ke 2-3 menit (paralel di 4 worker). Tidak perlu Playwright Cloud, tidak perlu bayar service tambahan.

Kelemahannya jujur: debugging lokal kurang smooth dari Cypress. Playwright UI mode (--ui) sudah jauh lebih baik dari 2024, tapi time-travel experience Cypress masih lebih intuitif untuk junior dev yang baru onboarding ke E2E. Trace viewer Playwright powerful tapi butuh kurva belajar.

Satu hal yang perlu diperhatikan untuk konteks Indonesia: Playwright test generator (codegen) generate test yang terlalu brittle kalau dipakai tanpa edit — selector-nya kadang terlalu spesifik ke implementasi DOM. Selalu review generated test sebelum commit.

Cypress

Cypress punya satu keunggulan yang susah didebat: developer experience saat nulis dan debug test. Time-travel debugger — kemampuan “rewind” setiap step test dengan snapshot DOM — membuat debugging test yang fail jadi 5x lebih cepat dibanding buka trace Playwright.

Component Testing adalah fitur yang genuinely tidak ada padanannya di Playwright. Mount React atau Vue component secara isolation, test interaksinya tanpa perlu spin up full browser app. Untuk tim yang punya banyak komponen UI kompleks (form multi-step, rich text editor, drag-drop), ini worth tersendiri.

Tapi ada dua hal yang saya hitung dengan serius: Cypress Cloud pricing dan browser support. Cypress tanpa Cloud masih functional untuk CI sederhana — parallelisasi bisa dikonfigurasikan manual, report bisa pakai Mochawesome. Tapi built-in parallelization yang smooth butuh Cypress Cloud, dan $67/bulan per 3 user terasa signifikan untuk startup Indonesia di awal. Browser support juga terbatas dibanding Playwright — WebKit/Safari tidak tersedia, dan untuk project yang perlu cross-browser CI strict, ini gap nyata.

Cypress worth jika: tim Anda berat di React Component Testing, atau tim punya kebiasaan debug test secara visual dan interaktif setiap hari. Untuk pure E2E pipeline CI tanpa budget Cloud: hitung ulang.

Puppeteer

Puppeteer adalah tool yang saya respect tapi tidak rekomendasikan untuk E2E test suite. Ini bukan kritik — Puppeteer memang tidak dirancang untuk itu.

Untuk scraping dan PDF generation, Puppeteer masih pilihan terbaik. CDP (Chrome DevTools Protocol) akses langsung memberi kontrol yang Playwright dan Cypress tidak expose. Bypass anti-scraping, intercept network di level rendah, generate PDF pixel-perfect dari halaman web — ini domain Puppeteer.

Untuk E2E testing: Anda menulis terlalu banyak boilerplate. Tidak ada built-in assertion, tidak ada test runner native, tidak ada automatic retry, tidak ada test reporter yang langsung terintegrasi. Anda bisa pakai Jest + Puppeteer dan build sendiri semua itu, tapi mengapa tidak pakai Playwright yang sudah menyediakan semuanya?

Kalau Anda sudah punya test suite Puppeteer dan jalan: tidak perlu migrate sekarang. Kalau mulai dari nol: pilih Playwright.

Verdict

Pakai Playwright kalau:

• Project baru di 2026
• Pipeline CI perlu cross-browser (Chromium + Firefox + WebKit/Safari)
• Tim ada budget concern — tidak mau bayar Cloud service tambahan
• TypeScript-first, monorepo, atau integrasi ke Vitest/Jest ecosystem

Pakai Cypress kalau:

• Tim berat React dan butuh Component Testing yang mature
• Developer banyak debug test secara lokal setiap hari (time-travel debugger worth)
• Sudah existing Cypress suite yang jalan — migrasi tidak worth kecuali ada pain point nyata

Pakai Puppeteer kalau:

• Task automation headless, scraping, atau PDF generation
• Bukan untuk E2E test suite di CI

Untuk konteks Indonesia: Playwright adalah default yang aman. Cross-browser coverage, zero added cost, dan ecosystem TypeScript yang solid. Cypress masih pilihan valid dengan kondisi spesifik — tapi hitung Cypress Cloud cost terhadap budget CI Anda sebelum commit.