Kalau Anda pernah meminta AI coding assistant menuliskan fitur CSS atau JavaScript baru, lalu kodenya gagal di Firefox padahal si AI bilang "sudah didukung semua browser", Anda tidak sendirian. Masalahnya bukan sekadar model yang kurang pintar, melainkan data yang ia hafal sudah kedaluwarsa. Mozilla mencoba menutup celah itu lewat MDN MCP server: server resmi yang menyambungkan dokumentasi MDN dan data kompatibilitas browser langsung ke dalam agen AI atau IDE Anda.

Masalahnya: pengetahuan model berhenti di satu tanggal

Model bahasa besar dilatih dari snapshot data pada satu titik waktu. Fitur web yang rilis setelahnya bisa dianggap "belum ada", atau sebaliknya dianggap "sudah aman dipakai" padahal masih di belakang flag. Dalam tulisan resminya, tim MDN menyebut dua contoh: model mungkin tidak tahu bahwa aturan CSS @view-transition sudah ada, atau tidak tahu apakah sebuah fitur sudah masuk status baseline "Widely Available".

Bagi tim yang mengelola situs layanan publik, kesalahan seperti ini mahal: kode tampak benar di laptop developer, tetapi rusak di perangkat warga yang memakai browser lebih lama.

Apa itu MDN MCP server

MCP (Model Context Protocol) adalah standar terbuka agar alat AI bisa terhubung ke sumber data eksternal. MDN MCP server memakai protokol itu untuk memberi agen akses ke tiga hal: pencarian di MDN, isi dokumentasi MDN, serta data kompatibilitas browser. Server ini berjalan sebagai layanan remote di mcp.mdn.mozilla.net dan bekerja dengan klien apa pun yang mendukung MCP, termasuk VS Code, Zed, Cursor, Claude Code, Codex CLI, Antigravity CLI (sebelumnya Gemini CLI), dan Claude Desktop.

Statusnya masih eksperimental. Mozilla menyatakan server ini bisa dihentikan kapan saja, dan selama masa uji mereka menyimpan data kueri yang masuk.

Cara memasangnya

Untuk Claude Code, cukup satu perintah di terminal:

claude mcp add --transport http mdn https://mcp.mdn.mozilla.net/

Untuk VS Code, tambahkan server remote ke berkas konfigurasi MCP. Di .vscode/mcp.json bentuknya seperti ini (perhatikan kunci servers):

{
  "servers": {
    "mdn": {
      "type": "http",
      "url": "https://mcp.mdn.mozilla.net/"
    }
  }
}

Di Cursor, konfigurasi ditaruh pada .cursor/mcp.json dengan kunci mcpServers:

{
  "mcpServers": {
    "mdn": {
      "url": "https://mcp.mdn.mozilla.net/"
    }
  }
}

Setelah ditambahkan, cek daftar server di klien Anda (misalnya claude mcp list) untuk memastikan statusnya aktif sebelum dipakai.

Seberapa besar bedanya? Ini hasil uji Mozilla

Tim MDN menguji Claude Code Opus 4.7 dengan dan tanpa MCP, memakai empat fitur yang baru dikirim di Firefox 151: fungsi CSS light-dark() untuk gambar, pseudo-class :buffering, atribut shadowrootslotassignment pada <template>, dan Web Serial API.

• Catatan pemakaian relatif setara. Beberapa jawaban dengan MCP justru lebih lengkap, misalnya ikut memberi contoh light-dark() dengan gradient linear.
• Informasi dukungan browser jauh berbeda. Tanpa MCP, model hanya benar pada satu dari empat kasus, yaitu :buffering.
• Tanpa MCP, model menyebut shadowrootslotassignment didukung Chrome 120 dan Safari 18.3 — kemungkinan tertukar dengan opsi slotAssignment pada Element.attachShadow(). Faktanya Firefox 151-lah browser pertama yang mendukungnya.
• Untuk Web Serial API, model tanpa MCP bahkan menyatakan Firefox "tidak mengimplementasikan dan tidak ada di roadmap", padahal Firefox 151 sudah mengirim dukungannya pada Mei 2026.
• Jawaban dengan MCP juga sekitar dua kali lebih cepat, karena agen tidak perlu mengunduh dan mem-parsing banyak halaman HTML untuk menebak informasi terbaru.

Pola ini penting dipahami: MCP bukan sulap yang membuat kode jadi benar, tetapi ia menghilangkan sumber kesalahan yang paling sering luput — klaim kompatibilitas yang tidak berdasar.

Catatan sebelum dipakai di proyek klien

• Jangan kirim data sensitif. Kueri yang dikirim ke agen bisa tersimpan di sisi server selama masa eksperimen. Hindari menempelkan kode klien, kredensial, atau data pribadi ke dalam prompt yang memicu pencarian dokumentasi.
• Ada opsi opt-out analitik. Mozilla menyediakan header X-Moz-1st-Party-Data-Opt-Out: 1 pada permintaan ke MCP bila Anda ingin menolak analitik pihak pertama.
• Tetap verifikasi. Untuk keputusan rilis, cek langsung tabel kompatibilitas di MDN dan uji di browser target. MCP mempercepat riset, bukan menggantikan pengujian.
• Rencanakan fallback. Karena statusnya eksperimental, jangan jadikan satu-satunya jalur dokumentasi tim. Repositori resminya menyediakan opsi menjalankan server secara lokal bila Anda butuh kendali penuh.

Alur kerja praktis untuk tim kecil

1. Pasang MDN MCP di IDE/CLI yang dipakai sehari-hari, satu kali per mesin developer.
2. Biasakan prompt eksplisit: "sebelum menulis kode, cek dukungan browser fitur X dan sebutkan baseline-nya".
3. Minta agen menuliskan sumber atau tabel dukungan di komentar pull request, sehingga reviewer bisa menilai.
4. Untuk situs layanan publik, tetapkan daftar browser minimum yang wajib didukung, lalu tolak fitur yang belum memenuhi daftar itu.

Kesimpulannya, MDN MCP server adalah tambahan kecil yang dampaknya terasa: agen AI berhenti menebak soal dukungan browser dan mulai membaca sumber yang benar. Untuk tim yang memakai AI coding assistant setiap hari, biaya pemasangannya beberapa menit, sementara kesalahan kompatibilitas yang dicegah bisa menghemat berhari-hari perbaikan.

Sumber: Introducing the MDN MCP server (MDN Blog), MDN MCP server (dokumentasi resmi), VS Code MCP servers documentation.