Latihan 1 dari materi Testing Solid di SolidJS — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kode awal sudah punya Counter dengan signal count yang mulai dari 0, dan <div> kosong. Biarkan signal-nya, lalu di dalam <div>:
Tulis <p>Count: {count()}</p>.
Di bawahnya, tulis <button onClick={() => setCount((c) => c + 1)}>+1</button>.
Yang dicek, seperti tes di teorinya:
Sebelum apa pun ditekan, <p> berbunyi persis Count: 0, dan ada <button>.
Sesudah satu klik, <p> berbunyi Count: 1. Sesudah dua klik, Count: 2.
Hint
Komponen yang bisa diuji menampilkan keadaannya di layar, karena tesnya membaca layar, bukan isi signal-nya.
Tampilkan count() di dalam <p> setelah tulisan Count: dan buat tombol +1 yang menaikkan signal-nya dari nilai lama.
<p>Count: {count()}</p><button onClick={() => setCount((c) => c + 1)}>+1</button>
</>{ }.css=>#idfn()
Versi baru
HyperSheets
bagian dari BelajarWeb.dev
0%
Membuka gerbang…
HyperSheets
Memperbarui Aplikasi
Versi baru tersedia. Halaman akan dimuat ulang otomatis...