Tips DevTools: Mengedit, men-debug, dan mengekspor rekaman alur pengguna

Sofia Emelianova
Sofia Emelianova

Panel Perekam DevTools memungkinkan Anda merekam tindakan pengguna di halaman, memutar ulang, membagikan, dan mengekspornya ke berbagai format yang dapat Anda gunakan di CI/CD.

Panel Perekam sedang dalam pengembangan aktif dan baru-baru ini menambahkan fitur baru untuk membantu Anda mengedit, men-debug, dan mengekspor rekaman.

Dengan panel Perekam, Anda dapat:

  • Perlambat pemutaran ulang, tetapkan titik henti sementara, jeda, lanjutkan, atau lanjutkan eksekusi satu langkah pada satu waktu.
  • Saat dijeda, berinteraksilah dengan halaman atau beralihlah ke panel lain untuk pemeriksaan lebih lanjut.
  • Tambahkan langkah-langkah yang tidak otomatis direkam Perekam. Misalnya, pengarahan kursor mouse yang akan mencemari rekaman.
  • Konfigurasikan langkah-langkah, misalnya, tambahkan waktu tunggu, kondisi, dan pernyataan.
  • Mengekspor rekaman dalam berbagai format seperti JSON, skrip@puppeteer/replay, dan skrip Puppeteer.

Selain itu, Anda dapat menambahkan lebih banyak format ekspor menggunakan ekstensi Chrome untuk panel Perekam. Pada saat penulisan, Anda dapat menambahkan ekstensi untuk alat berikut: Cypress, WebPageTest, Nightwatch, Testing Library, dan WebdriverIO. Lihat daftar lengkap ekstensi.

Untuk informasi selengkapnya: