มีอะไรใหม่ในเครื่องมือสำหรับนักพัฒนาเว็บ (Chrome 108)

Jecelyn Yeen

คำแนะนำสำหรับพร็อพเพอร์ตี้ CSS ที่ไม่ได้ใช้งาน

ตอนนี้ DevTools จะระบุสไตล์ CSS ที่ถูกต้องแต่ไม่มีผลที่มองเห็นได้ ในแผงสไตล์ เครื่องมือสำหรับนักพัฒนาเว็บจะค่อยๆ เลือนพร็อพเพอร์ตี้ที่ไม่ได้ใช้งานออก วางเมาส์เหนือไอคอนข้างกฎเพื่อทําความเข้าใจสาเหตุที่กฎไม่มีผลที่มองเห็นได้

คำแนะนำสำหรับพร็อพเพอร์ตี้ CSS ที่ไม่ได้ใช้งาน

ปัญหา Chromium: 1178508

ตรวจหาตัวเลือก XPath และข้อความในแผงโปรแกรมอัดเสียงโดยอัตโนมัติ

ตอนนี้แผงโปรแกรมอัดเสียงรองรับตัวเลือก XPath และข้อความแล้ว เริ่มบันทึกการไหลเวียนของผู้ใช้ แล้วเครื่องมือบันทึกจะเลือก XPath และข้อความที่ไม่ซ้ำกันสั้นที่สุดขององค์ประกอบเป็นตัวเลือกโดยอัตโนมัติ หากมี

ตัวเลือก XPath และข้อความในแผงเครื่องมือบันทึก

ปัญหาเกี่ยวกับ Chromium: 1327206,1327209

ดำเนินการทีละขั้นตอนตามนิพจน์ที่คั่นด้วยคอมมา

ตอนนี้คุณสามารถดูทีละขั้นตอนของนิพจน์ที่คั่นด้วยคอมมาระหว่างการแก้ไขข้อบกพร่องได้แล้ว ซึ่งจะช่วยปรับปรุงความสามารถในการแก้ไขข้อบกพร่องของโค้ดที่ผ่านการย่อ

ดำเนินการตามนิพจน์ที่คั่นด้วยคอมมา

ก่อนหน้านี้ เครื่องมือสำหรับนักพัฒนาเว็บรองรับเฉพาะการไปยังแต่ละขั้นตอนของนิพจน์ที่คั่นด้วยเครื่องหมายเซมิโคลอน

จากโค้ดด้านล่าง

function foo() {}

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

เครื่องมือแปลงภาษาและเครื่องมือบีบอัดอาจเปลี่ยนค่าเหล่านั้นให้เป็นนิพจน์ที่คั่นด้วยคอมมา

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

ซึ่งทำให้เกิดความสับสนระหว่างการแก้ไขข้อบกพร่อง เนื่องจากลักษณะการแยกขั้นตอนระหว่างโค้ดที่คอมไพล์แล้วและโค้ดที่เขียนไว้จะแตกต่างกัน ปัญหาจะยิ่งสับสนมากขึ้นเมื่อใช้แผนที่ซอร์สโค้ดเพื่อแก้ไขข้อบกพร่องของโค้ดที่ผ่านการย่อขนาดในแง่ของโค้ดต้นฉบับ เนื่องจากนักพัฒนาซอฟต์แวร์จะกําลังดูเครื่องหมายเซมิโคลอน (ซึ่งเครื่องมือทางเทคนิคเปลี่ยนเป็นคอมมาอยู่เบื้องหลัง) แต่โปรแกรมแก้ไขข้อบกพร่องไม่ได้หยุดที่เครื่องหมายดังกล่าว

ปัญหา Chromium: 1370200

การตั้งค่ารายการละเว้นที่ปรับปรุงแล้ว

ไปที่การตั้งค่า > รายการที่ละเว้น DevTools ปรับปรุงการออกแบบเพื่อช่วยคุณกําหนดค่ากฎเพื่อละเว้นสคริปต์หรือรูปแบบสคริปต์รายการเดียว

แท็บรายการละเว้น

ปัญหา Chromium: 1356517

ไฮไลต์อื่นๆ

การแก้ไขที่น่าสังเกตบางส่วนในรุ่นนี้ ได้แก่

  • เติมชื่อพร็อพเพอร์ตี้ CSS ให้สมบูรณ์โดยอัตโนมัติในแผงสไตล์เมื่อกดเว้นวรรค (1343316)
  • นำการเลื่อนอัตโนมัติออกจากเบรดครัมบ์ของแผงองค์ประกอบ (1369734)

ดาวน์โหลดแชแนลตัวอย่าง

ลองใช้ Chrome Canary, Dev หรือ เบต้า เป็นเบราว์เซอร์สำหรับนักพัฒนาซอฟต์แวร์เริ่มต้น ช่องทางเวอร์ชันตัวอย่างเหล่านี้จะช่วยให้คุณเข้าถึงฟีเจอร์ล่าสุดของ DevTools, ทดสอบ API ของแพลตฟอร์มเว็บที่ล้ำสมัย และช่วยคุณค้นหาปัญหาในเว็บไซต์ได้ก่อนที่ผู้ใช้จะพบ

ติดต่อทีมเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome

ใช้ตัวเลือกต่อไปนี้เพื่อพูดคุยเกี่ยวกับฟีเจอร์ใหม่ การอัปเดต หรือสิ่งอื่นๆ ที่เกี่ยวข้องกับเครื่องมือสำหรับนักพัฒนาเว็บ

มีอะไรใหม่ในเครื่องมือสำหรับนักพัฒนาเว็บ

รายการทุกอย่างที่ครอบคลุมในชุดมีอะไรใหม่ใน DevTools