Belajar Cypress - Pre-Requisites Skill & Setup Environment

#Pendahuluan

Selamat datang di series Belajar Cypress! Series ini akan membawa kalian menguasai Cypress — framework end-to-end testing paling populer untuk aplikasi web modern — dari fondasi konsep sampai production-grade. Total ada 23 episode yang tersusun dari enam fase.

Tapi sebelum menyentuh Cypress, ada beberapa skill dasar dan perangkat lunak yang wajib kalian miliki. Mengapa prasyarat ini penting? Karena test yang baik lahir dari pemahaman tentang bagaimana aplikasi web bekerja: DOM, jaringan, dan siklus hidup halaman. Cypress mengotomatiskan interaksi pengguna, dan kalian tidak bisa mengotomatiskan apa yang tidak kalian pahami.

Episode 0 ini adalah peta jalan kalian: memastikan skill dasar, menyiapkan Node.js dan tooling, lalu memverifikasi environment sebelum masuk ke instalasi Cypress di episode 3.

#Skill Dasar yang Wajib Dikuasai

#HTML, CSS, DOM, dan HTTP

Cypress bekerja dengan meniru perilaku pengguna di browser, jadi kalian wajib nyaman dengan HTML dan CSS untuk membaca struktur halaman dan memilih elemen. Pahami juga konsep DOM — pohon elemen yang dirender browser — karena hampir semua perintah Cypress pada akhirnya memilih elemen DOM.

Jangan lupakan HTTP: Cypress berdiri di antara aplikasi dan server, sehingga mengerti method, status code, dan header sangat membantu saat memakai cy.intercept() di episode 12.

node --version
npm --version

Output node --version harus menampilkan Node.js 18 atau lebih baru, dan npm --version menampilkan package manager yang siap dipakai. Node.js adalah runtime tempat seluruh tooling Cypress berjalan.

#JavaScript dan Node.js

Test Cypress ditulis dalam JavaScript. Kalian wajib menguasai sintaks dasar: variabel, arrow function, promise, async/await, array method seperti map dan filter, serta object destructuring. Pahami juga model eksekusi asinkron Node.js, karena Cypress berjalan di atasnya.

#Konsep Automated Testing dan Test Pyramid

Pahami alasan tim menulis test otomatis dan bagaimana kedudukannya. Test pyramid membagi strategi menjadi tiga lapis:

• Unit test: menguji fungsi atau komponen terkecil secara terisolasi.
• Integration test: menguji kerja sama antar modul atau komponen.
• End-to-end test: menguji alur lengkap dari UI sampai backend, persis seperti pengguna.

Cypress terutama dipakai untuk lapis end-to-end dan component testing. Di episode 20 kita akan membahas cara menyeimbangkan ketiga lapis ini agar suite tidak terlalu mahal untuk dijalankan.

#Software & Tools yang Perlu Disiapkan

#Node.js dan Package Manager

Cypress didistribusikan sebagai paket npm. Install Node.js versi LTS dari situs resminya, atau lewat Node Version Manager. Untuk package manager, pilih salah satu dari npm, yarn, atau pnpm — series ini memakai npm karena paling umum.

node -v
npm -v

Untuk memasang Cypress nanti, jalankan perintah install di direktori project:

npm install cypress --save-dev

npm install cypress --save-dev menaruh Cypress di devDependencies karena tool testing tidak diperlukan di production.

#IDE, Browser, dan Git

Pilih VS Code atau WebStorm untuk menulis test. Aktifkan ekstensi bahasa yang sesuai agar editor menyorot sintaks dengan benar.

Browser utama Cypress adalah Chrome, Edge, dan Firefox. Salah satunya wajib terinstall — Cypress mengontrol browser lewat protocol bawaan, bukan WebDriver seperti Selenium.

Terakhir, Git: version control membantu melacak perubahan test dan berkolaborasi dengan tim. Kita akan memakainya untuk menjalankan Cypress di CI pada episode 14.

#Hardware Minimum Requirements

Cypress tidak terlalu rakus, tapi butuh ruang untuk bernapas:

• RAM minimal 4 GB, lebih disarankan 8 GB.
• CPU dual-core ke atas.
• Storage 5 GB+ untuk cache browser dan artefak test.

#Verifikasi Environment

Sebelum lanjut, jalankan verifikasi cepat untuk memastikan semuanya siap:

node -v
npm -v
git --version

Pastikan semua perintah node -v, npm -v, dan git --version menghasilkan output tanpa error. Jika kalian memakai nvm, pastikan versi Node yang aktif adalah yang diinginkan dengan menjalankan node -v dari direktori project.

Setelah itu, buat direktori kosong untuk project latihan:

mkdir cypress-playground
cd cypress-playground
npm init -y

npm init -y membuat package.json baru yang akan kita pakai untuk menginstall Cypress di episode 3.

#Penutup

Di episode 0 ini kalian sudah menyiapkan pijakan untuk seluruh series: memahami dasar web dan JavaScript, konsep test pyramid, menyiapkan Node.js dan package manager, memastikan browser dan Git terinstall, serta memverifikasi environment pertama.

Inti yang harus dibawa pulang:

• Kuasai HTML, CSS, DOM, dan HTTP sebelum menulis test.
• Test pyramid: unit, integration, dan end-to-end — Cypress untuk dua lapis terakhir.
• Node.js 18+ dan npm adalah fondasi tooling Cypress.
• Pastikan Chrome, Edge, atau Firefox terinstall.
• Minimal RAM 4 GB, CPU dual-core, dan storage 5 GB.

Di episode 1 selanjutnya kita akan membahas sejarah, latar belakang, dan mengapa memilih Cypress — dari asal-usulnya yang dimulai Brian Mann, keunggulan real-time reload dan automatic waiting, hingga perbandingannya dengan Selenium, Playwright, dan Jest. Pastikan environment kalian sudah siap, karena perjalanan Belajar Cypress baru saja dimulai!