Latihan 1 dari materi Error Boundaries & Graceful Degradation di Debugging — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Tulis dua function yang menjaga halaman tetap jalan walaupun sebagian gagal.
safelyRender(widgets, log) meniru error boundary per widget. widgets adalah array { name, render }, dan render() bisa mengembalikan string atau melempar error. Kembalikan array hasil, satu per widget, dengan urutan yang sama:
render() berhasil: masukkan hasilnya.render() melempar error: panggil log({ widget: name, error: e.message }), lalu masukkan string "[" + name + " unavailable]", misalnya [Chart unavailable].allSettledFallback(promises, fallbacks) mengembalikan Promise yang resolve ke array: nilai promise yang fulfilled, atau fallbacks[i] di posisi yang sama untuk yang rejected. Pakai Promise.allSettled.Kode pemanggil di bawah function sudah ada di kode awal, biarkan saja. Yang dinilai delapan baris console-nya, berurutan:
Selamat Datang
[Chart unavailable]
© 2026
Chart
API down
user
[]
notif
Ada juga cek tambahan:
allSettledFallback([Promise.resolve("a"), Promise.reject("x")], ["fb1", "fb2"]) digabung dengan koma harus a,fb2.allSettledFallback([Promise.reject(1), Promise.resolve("ok")], ["A", "B"]) digabung dengan | harus A|ok.safelyRender dengan widget a yang mengembalikan ok dan widget b yang melempar Error("x") harus menghasilkan ok,[b unavailable] dan mencatat b dengan pesan x.
