Halaman ini diterjemahkan oleh Cloud Translation API.

Yang Baru di DevTools (Chrome 108)

Jecelyn Yeen

Petunjuk untuk properti CSS yang tidak aktif

DevTools kini mengidentifikasi gaya CSS yang valid tetapi tidak memiliki efek yang terlihat. Di panel Styles, DevTools memudarkan properti yang tidak aktif. Arahkan kursor ke ikon di sampingnya untuk memahami mengapa aturan tidak memiliki pengaruh yang terlihat.

Petunjuk untuk properti CSS yang tidak aktif.

Masalah Chromium: 1178508

Deteksi otomatis XPath dan pemilih teks di panel Perekam

Panel Perekam sekarang mendukung pemilih teks dan XPath. Mulai merekam alur penggunaan dan perekam akan otomatis memilih XPath dan teks unik terpendek dari suatu elemen sebagai pemilih jika tersedia.

XPath dan pemilih teks di panel Perekam Suara.

Masalah Chromium: 1327206,1327209

Telusuri ekspresi yang dipisahkan koma

Anda kini dapat menelusuri ekspresi yang dipisahkan koma selama proses debug. Hal ini meningkatkan kemampuan debug kode yang diminifikasi.

Lewati ekspresi yang dipisahkan koma.

Sebelumnya, DevTools hanya mendukung langkah melalui ekspresi yang dipisahkan titik koma.

Dengan kode di bawah ini,

function foo() {}

function bar() {
  foo();
  foo();
  return 42;
}

Transpiler dan minifier dapat mengubahnya menjadi ekspresi yang dipisahkan koma.

function bar(){return foo(),foo(),42}

Hal ini menimbulkan kebingungan selama proses debug karena perilaku langkah berbeda antara kode yang diminifikasi dan yang ditulis. Bahkan lebih membingungkan saat menggunakan peta sumber untuk men-debug kode yang diminifikasi dalam hal kode asli, karena developer kemudian melihat titik koma (yang di balik layar diubah menjadi koma oleh toolchain) tetapi debugger tidak menghentikannya.

Masalah Chromium: 1370200

Peningkatan setelan daftar Abaikan

Buka Setelan > Daftar Abaikan. DevTools meningkatkan desain untuk membantu Anda mengonfigurasi aturan untuk mengabaikan satu skrip atau pola skrip.

Tab Daftar yang Diabaikan.

Masalah Chromium: 1356517

Sorotan lain-lain

Berikut adalah beberapa perbaikan penting dalam rilis ini:

Pelengkapan otomatis nama properti CSS di panel Styles saat menekan spasi. (1343316)
Hapus scroll otomatis di breadcrumb panel Element. (1369734)

Mendownload saluran pratinjau

Pertimbangkan untuk menggunakan Chrome Canary, Dev, atau Beta sebagai browser pengembangan default Anda. Saluran pratinjau ini memberi Anda akses ke fitur DevTools terbaru, menguji API platform web tercanggih, dan menemukan masalah di situs Anda sebelum pengguna melakukannya.

Menghubungi tim Chrome DevTools

Gunakan opsi berikut untuk membahas fitur dan perubahan baru di postingan, atau hal lain yang berkaitan dengan DevTools.

Kirim saran atau masukan kepada kami melalui crbug.com.
Laporkan masalah DevTools menggunakan Opsi lainnya > Bantuan > Laporkan masalah DevTools di DevTools.
Tweet di @ChromeDevTools.
Berikan komentar di video YouTube Apa yang baru di DevTools atau video YouTube Tips DevTools.