Inspektur regresi visual Storybook
Unggah PNG baseline dan latest dari Loki, soroti perbedaan visual di browser, dan ekspor laporan heatmap.
Pilih file PNG baseline dan latest yang dibuat Loki. Ekstrak laporan dan pilih pasangan tangkapan layar yang cocok.
Warna sorotan
Ikhtisar
Inspeksi tangkapan regresi visual Loki langsung di browser. Soroti perbedaan, tinjau metrik, dan ekspor heatmap — tanpa CLI.
Cara pakai
- Ekstrak hasil run Loki lalu unggah PNG baseline/latest yang berpasangan.
- Atur ambang diff dan warna sorotan untuk memisahkan sinyal dari noise.
- Tinjau heatmap, salin angka ringkasan, dan unduh PNG beranotasi untuk umpan balik.
Kasus penggunaan
- Menyetujui diff regresi visual Storybook sebelum merge pull request.
- Berbagi heatmap dengan desainer guna memastikan perubahan UI memang disengaja.
- Mengaudit kegagalan Loki dengan cepat di mesin tanpa toolchain lengkap.
Tips & pengetahuan
- Ambil baseline dan latest dengan ukuran viewport serta device pixel ratio yang sama.
- Stabilkan timestamp atau data dinamis di story untuk mengurangi positif palsu.
- Jika dimensi meleset, ulangi pengambilan agar tangkapan selaras sebelum disetujui.