Latihan 2 dari materi Actions Svelte di Svelte — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kode awalnya cuma berisi komentar TODO.
Di <script>, buat action tooltip(node, text). Isinya node.setAttribute('title', text).
Kembalikan objek berisi update(newText), yang memanggil node.setAttribute('title', newText), dan destroy(), yang memanggil node.removeAttribute('title').
Di bawah script, buat tombol yang memakai action itu dengan teks Ini tooltip: <button use:tooltip={'Ini tooltip'}>Hover saya</button>.
Yang dicek:
Halaman punya <button>.
Kodemu memakai use:tooltip.
Kodemu memasang atribut lewat setAttribute("title" atau .title =.
Tombolnya benar-benar punya title="Ini tooltip".
Objek yang dikembalikan punya update yang memanggil setAttribute('title', ...) dan destroy yang memanggil removeAttribute('title').
Hint
Action menerima elemennya sebagai argumen pertama dan nilai dari use:tooltip={...} sebagai argumen kedua. Tooltip bawaan browser cukup atribut title.
function tooltip(node, text) memasang title dengan setAttribute, lalu return { update(newText) {...}, destroy() {...} }. Tombolnya memakai use:tooltip dengan teks di dalam kurung kurawal.
