Pengujian dan Deploy

Repository ini tidak memakai pipeline CI. Semua pemeriksaan dijalankan lewat npm script yang sama di mesin lokal, lalu npm run deploy membangun Worker OpenNext dan mengirimkannya ke Cloudflare (package.json:6-20¹). README menetapkan urutan npm test, npm run lint, npm run typecheck, dan npm run build sebagai rangkaian verifikasi sebelum deploy (README.md:43-50²).

Perintah verifikasi

prebuild menjalankan npm run cf-typegen, yaitu wrangler types --env-interface CloudflareEnv (package.json:8-9⁸, package.json:18¹²). Karena itu npm run build selalu memakai tipe CloudflareEnv terbaru sebelum next build membaca worker.ts. Script quran:build berdiri di luar rangkaian verifikasi; ia hanya dipakai saat data Qur'an dibangun ulang, seperti dijelaskan di Data Qur'an dan Mushaf (package.json:19¹³).

Modul yang dijaga oleh test

vitest.config.ts memasang alias @ ke ./src dan hanya mengambil berkas tests/**/*.test.ts (vitest.config.ts:4-11¹⁴). Tidak ada test yang menyentuh Worker atau jaringan; semuanya memanggil fungsi di src/lib, sehingga npm test tidak butuh hasil build.

Dari build ke Worker

npm run deploy tidak menambahkan apa pun pada next build. Perintah itu memanggil opennextjs-cloudflare build untuk menghasilkan .open-next/, lalu opennextjs-cloudflare deploy yang membaca wrangler.jsonc dan mengirim Worker (package.json:16¹⁰). .open-next/worker.js baru ada setelah langkah build itu, dan worker.ts mengimpornya dengan @ts-ignore supaya npm run typecheck tetap bisa jalan sebelum ada build (worker.ts:1-10²⁷).

sequenceDiagram
  actor Dev
  participant NPM as npm scripts
  participant ESLint as eslint
  participant TSC as tsc
  participant Vitest as vitest
  participant ON as opennextjs-cloudflare
  participant CF as Cloudflare Workers
  Dev->>NPM: npm test / lint / typecheck
  NPM->>Vitest: berkas .test.ts di tests/
  NPM->>ESLint: eslint .
  NPM->>TSC: tsc --noEmit
  Vitest-->>Dev: lulus atau gagal
  Dev->>NPM: npm run deploy
  NPM->>ON: opennextjs-cloudflare build
  ON->>ON: tulis .open-next/worker.js dan .open-next/assets
  ON->>CF: opennextjs-cloudflare deploy memakai wrangler.jsonc
  CF-->>Dev: Worker quran-academy aktif
  style ON fill:#f59e0b,color:#000
  style CF fill:#336791,color:#fff
  style Vitest fill:#2d7d46,color:#fff
%% fig: Alur verifikasi sampai deploy
%% desc: Perintah uji, lint, dan typecheck berjalan lokal, lalu opennextjs-cloudflare membangun .open-next dan mengirimnya ke Cloudflare.

open-next.config.ts memilih staticAssetsIncrementalCache dan menyalakan enableCacheInterception, sehingga halaman prerender beserta RSC payload-nya dilayani dari aset statis, bukan dirender ulang oleh Worker pada setiap request dan prefetch (open-next.config.ts:4-9³⁴).

Cache-Control sesudah deploy

Pembungkus worker.ts mengubah satu hal pada response sebelum dikirim: bila Cache-Control memuat s-maxage, header itu ditulis ulang menjadi public, max-age=0, must-revalidate; response lain dikembalikan apa adanya (worker.ts:11-15³⁵). Alasannya tercatat di komentar berkas: setelah deploy, stale-while-revalidate membuat browser menampilkan halaman dari build sebelumnya yang chunk CSS-nya sudah tidak ada sehingga muncul 404, sedangkan revalidasi per kunjungan hanya menghasilkan 304 lewat ETag (worker.ts:5-7³⁶).

graph TD
  Req["request masuk ke fetch"] --> ONW["openNextWorker.fetch di .open-next/worker.js"]
  ONW --> Resp["Response"]
  Resp --> Check{"Cache-Control memuat s-maxage?"}
  Check -- tidak --> Pass["dikembalikan apa adanya"]
  Check -- ya --> Rewrite["Cache-Control: public, max-age=0, must-revalidate"]
  Rewrite --> Sent["response dikirim ke browser"]
  Pass --> Sent
  style ONW fill:#336791,color:#fff
  style Check fill:#f59e0b,color:#000
  style Rewrite fill:#8b5cf6,color:#fff
  style Pass fill:#2d7d46,color:#fff
  style Sent fill:#2d7d46,color:#fff
%% fig: Penulisan ulang Cache-Control di worker.ts
%% desc: Hanya response yang membawa s-maxage yang headernya diganti menjadi must-revalidate; response lain lewat tanpa perubahan.

⚠️ npm run deploy tidak menjalankan test, lint, atau typecheck (package.json:16¹⁰). Apa pun yang ada di working tree saat perintah itu dijalankan langsung masuk ke bundel Worker, jadi jalankan npm test lebih dulu.

⚠️ npm run build hanya menjalankan next build; bundel .open-next/ dan aset .open-next/assets baru dibuat oleh opennextjs-cloudflare build di dalam npm run deploy (package.json:8-9⁸, wrangler.jsonc:7-9³²). Untuk mencoba hasil build sebelum menyentuh produksi, pakai npm run preview (package.json:15⁹, README.md:52-54³⁷).