Belajar Playwright - Security & Isolation

#Pendahuluan

Test suite yang tidak aman bisa menjadi pintu masuk bagi masalah yang jauh lebih besar: credential bocor ke dalam kode, data pengguna saling menumpuk antar test, atau secret produsksi yang tertanam di artifact. Episode 13 ini membahas security dan isolation — dua fondasi yang membuat suite aman dan deterministik.

Isolasi lewat BrowserContext membuat setiap test berjalan di dunia tersendiri, sementara praktik manajemen secret memastikan credential tidak pernah masuk ke repository. Kalian akan belajar pola konkret untuk menyimpan, menyuntikkan, dan melindungi data sensitif dalam test end-to-end.

#Running Tests dalam Isolated Browser Contexts

#Kenapa Isolasi Penting

Tanpa isolasi, dua test yang berjalan paralel bisa saling mengganggu: keduanya berbagi cookies, localStorage, atau session — menyebabkan kegagalan yang acak dan sulit direproduksi. Playwright menyelesaikan ini dengan memberikan context baru untuk setiap test secara default.

Context adalah unit isolasi: cookies, storage, dan state browser tidak pernah bocor antar context. Inilah yang membuat test Playwright aman dijalankan paralel tanpa khawatir saling menimpa.

Untuk test yang butuh sesi login, jangan login berulang setiap test. Siapkan storage state sekali dan muat di test lain:

Simpan storage state setelah login

import { test } from '@playwright/test';
 
test('siapkan state login', async ({ page }) => {
  await page.goto('/login');
  await page.getByLabel('Email').fill('user@example.com');
  await page.getByLabel('Password').fill('rahasia123');
  await page.getByRole('button', { name: 'Masuk' }).click();
  await page.context().storageState({ path: 'artifacts/state.json' });
});

page.context().storageState({ path: 'artifacts/state.json' }) menyimpan cookies dan localStorage ke file. Test lain lalu memuatnya sebagai basis context:

Gunakan storage state di config

use: {
  storageState: './artifacts/state.json',
},

Dengan storageState di konfigurasi, setiap test mulai dengan sesi login tanpa menjalankan ulang alur login — lebih cepat dan lebih stabil.

#Securely Handling Secrets dan Environment Variables

#Prinsip Dasar: Tidak Ada Secret di Repo

Aturan nomor satu: secret tidak pernah ditulis di file yang di-commit. Playwright membaca environment variables dari proses yang menjalankannya, jadi semua nilai sensitif disimpan di environment CI atau file .env lokal yang masuk .gitignore.

Isi .env.local

TEST_USER_EMAIL=user@example.com
TEST_USER_PASSWORD=rahasia123
TEST_ADMIN_EMAIL=admin@example.com

File ini dibaca oleh Node.js ketika test berjalan. Pastikan .env.local masuk .gitignore — commit secret adalah salah satu kesalahan paling mahal dalam software engineering.

#Mengakses Environment Variables di Test

Baca secret dari environment

import { test, expect } from '@playwright/test';
 
const email = process.env.TEST_USER_EMAIL!;
const password = process.env.TEST_USER_PASSWORD!;
 
test('login dengan credential dari env', async ({ page }) => {
  await page.goto('/login');
  await page.getByLabel('Email').fill(email);
  await page.getByLabel('Password').fill(password);
  await page.getByRole('button', { name: 'Masuk' }).click();
  await expect(page).toHaveURL(/dashboard/);
});

process.env.TEST_USER_EMAIL dibaca dari environment saat test berjalan. Nilai tidak pernah muncul sebagai literal di kode, sehingga aman untuk di-commit.

#Menjaga Secret dari Log dan Report

Ada satu jebakan halus: teks yang diketik ke input form akan muncul di trace dan video. Jika credential dipakai dalam test yang menangkap artifact, secret bisa bocor lewat rekaman. Solusinya: gunakan akun test yang aman untuk di-ekspos, atau buat secret tersebut khusus untuk environment test.

Matikan trace untuk test berisi credential

test.use({ trace: 'off', video: 'off' });

test.use({ trace: 'off', video: 'off' }) menonaktifkan perekaman untuk test yang menangani data sensitif, sehingga credential tidak tertinggal di artifact.

#Protecting Test Data dan Credentials

#Jangan Pakai Credential Produksi

Credential produksi tidak boleh dipakai untuk test — risikonya besar dan praktik buruk. Gunakan akun khusus test yang data dan permission-nya terkontrol, dibuat melalui seeding atau fixture yang disediakan tim backend.

#Enkripsi dan Rotasi

Untuk secret yang memang harus disimpan, gunakan secret manager platform (misalnya GitHub Secrets, GitLab CI variables, atau Vault) dan rotasi secara berkala. Semakin sedikit orang yang tahu nilai secret, semakin kecil permukaan serangannya.

#Data Test yang Realistis Tapi Tidak Nyata

Gunakan data fiktif yang realistis: email user+test@example.com, nomor kartu yang disediakan untuk testing (seperti 4242 pola pada sandbox payment), dan alamat palsu. Hindari memakai data pengguna sungguhan, baik dari produksi maupun ekspor database.

#Preventing Test State Leakage

#Selalu Bersihkan Data yang Dibuat

Test yang membuat data — pesanan, akun, entri — sebaiknya membersihkannya setelah selesai atau menggunakan data yang unik per test:

Nama unik per test

import { test, expect } from '@playwright/test';
 
test('pendaftaran user baru', async ({ page }) => {
  const uniqueEmail = `user-${Date.now()}@example.com`;
  await page.goto('/daftar');
  await page.getByLabel('Email').fill(uniqueEmail);
  await page.getByRole('button', { name: 'Daftar' }).click();
  await expect(page.getByText('Akun dibuat')).toBeVisible();
});

${Date.now()}@ menghasilkan nilai unik per eksekusi, mencegah tabrakan data antar test yang berjalan berulang kali. Nilai unik adalah cara paling sederhana mencegah state leakage pada data yang identik.

#Gunakan Database Isolasi per Environment

Idealnya, setiap environment test memiliki database sendiri yang bisa di-reset kapan saja. Jika tidak memungkinkan, pastikan test memakai prefix atau namespace yang jelas untuk data yang dibuat, sehingga jejak test mudah dibedakan dan dibersihkan.

Jalankan suite dengan environment terisolasi

TEST_ENV=staging npx playwright test

Perintah TEST_ENV=staging npx playwright test menjalankan suite dengan environment variable yang menentukan target — staging memakai database staging, bukan produksi.

#Penutup

Episode 13 membuat suite kalian aman dan deterministik: setiap test berjalan di BrowserContext terisolasi sehingga tidak ada state leakage, secret disimpan di environment dan tidak pernah masuk repository, credential produksi tidak pernah dipakai, dan storage state mempercepat test yang membutuhkan login tanpa mengorbankan isolasi.

Inti yang harus dibawa pulang:

Playwright memberi context baru per test secara default — jaga isolasi ini.
Simpan secret di environment variables, bukan literal di kode.
Nonaktifkan trace dan video untuk test yang menangani credential.
Gunakan akun dan data khusus test, bukan credential produksi.
Buat data unik per test untuk mencegah tabrakan state.

Di episode 14 selanjutnya kita akan membahas CI/CD integration — mengintegrasikan Playwright ke GitHub Actions, GitLab CI, dan Jenkins, perbedaan headless dan headed run di CI, pengelolaan artifact test seperti trace dan screenshot, serta eksekusi paralel dan matrix runs.