Halo semuanya, dalam edisi terakhir DevTools Digest, kita dapat melihat Stack panggilan asinkron yang canggih dan beberapa lainnya. Dalam edisi ini, kita akan melihat pemfilteran Panel Jaringan yang ditingkatkan (dengan pelengkapan otomatis), kemampuan edit dengan konten Shadow DOM, update CodeMirror 4, dan lainnya.
Pemfilteran panel jaringan
Anda kini dapat memfilter resource berdasarkan kolom tertentu seperti Domain. Salah satu format filter adalah: Domain:website.com. Selain pemfilteran, Anda juga mendapatkan saran pelengkapan otomatis untuk nilai filter yang valid yang diperbarui secara real time saat Anda mengetik kueri. Anda mungkin merasa ini berguna saat perlu menemukan semua resource yang ditayangkan oleh domain tertentu. [crbubg.com/258421]
Mengedit konten Shadow DOM
DevTools selalu dapat mengedit HTML reguler di panel Elemen, kemampuan ini kini diperluas ke elemen yang merupakan bagian dari Shadow DOM. [crbug.com/348991]
Mengupgrade ke CodeMirror 4.0
CodeMirror, editor teks berbasis JavaScript yang digunakan sebagai bagian dari Panel Sumber telah diupgrade ke versi 4. Banyak fungsi baru telah ditambahkan sebagai hasilnya. crbug.com/356878]
Penelusuran cepat untuk properti CSS
Sekarang Anda dapat menelusuri nama properti, nilai, atau pemilih aturan dari kotak penelusuran baru di panel Gaya. Hasil akan ditandai secara real time saat Anda mengetik kueri. [crbug.com/278852]
Stempel waktu di samping pesan konsol
Saat mencatat pesan secara berurutan, sebaiknya lihat waktu persis pesan dicatat. Anda dapat mengaktifkannya melalui Eksperimen DevTools. [crbug.com/131714]
Perincian Statistik Memori untuk snapshot heap
Saat melihat snapshot heap yang direkam, perhatikan diagram lingkaran statistik yang memberikan ringkasan visual dengan kode warna tentang aspek JavaScript yang paling banyak menggunakan memori. Saat ini merupakan fitur eksperimental, aktifkan “Statistik snapshot heap” untuk mencobanya. [crbug.com/346335]
Melihat sumber asli console.log, bukan versi yang digabungkan
Anda mungkin memiliki fungsi wrapper console.log, tetapi sayangnya di konsol, semua pesan Anda berasal dari sesuatu seperti util.js:46. Sekarang Anda dapat meminta DevTools me-resolve lokasi asli Anda. Masukkan file yang menggabungkan pesan log konsol ke dalam kotak input “Lewati langkah-langkah sumber dengan nama tertentu” agar DevTools mem-blackbox-nya, lalu tampilkan sumber sebenarnya dari pernyataan log. [crbug.com/231007]
Beberapa tambahan kecil, tetapi canggih
Muat ulang panel Pemroses Peristiwa di Panel Elemen, setelah menambahkan atau menghapus pemroses peristiwa JavaScript secara dinamis. [crbug.com/341044]
Anda dapat menggunakan
Ctrl+untuk mendapatkan fokus pada input Konsol. Anda mungkin merasa ini berguna untuk alur kerja khusus keyboard di DevTools. [crbug.com/144943]Saran pelengkapan otomatis gaya batas untuk nilai (titik-titik, putus-putus, ganda, alur) telah diperbarui agar sesuai dengan spesifikasi. [crbug.com/349998]
Tombol Pulihkan default dan muat ulang **telah ditambahkan ke panel Setelan yang berfungsi persis seperti namanya. [crbug.com/135451]
Saat ini merupakan fitur eksperimental, Anda dapat mencoba dok ke kiri untuk mengetahui kesesuaiannya dengan alur kerja Anda. Mode tata letak lainnya adalah dok ke jendela utama (kanan atau bawah) dan lepaskan kaitan ke jendela terpisah. [crbug.com/134282]
"wheel" kini ditawarkan sebagai titik henti sementara pemroses peristiwa, selain peristiwa klik, mousemove, mousedown, dll. yang biasa. [crbug.com/347562]
Sekian untuk saat ini, terima kasih telah membaca.