สวัสดี Kayce กลับมาอีกแล้วพร้อมข้อมูลสรุปเกี่ยวกับข่าวสารใหม่ใน DevTools นับตั้งแต่เดือนที่แล้ว
ฟีเจอร์ใหม่ในคอนโซล
ใน Chrome 56 ซึ่งตอนนี้อยู่ใน Canary คอนโซลเครื่องมือสําหรับนักพัฒนาเว็บจะขับเคลื่อนโดย CodeMirror ซึ่งจะช่วยให้คุณใช้ฟีเจอร์ใหม่ๆ มากมายได้ เช่น
การไฮไลต์ไวยากรณ์ขณะพิมพ์ ก่อนหน้านี้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์จะไฮไลต์ไวยากรณ์ได้หลังจากที่ประเมินโค้ดบล็อกแล้วเท่านั้น
การไฮไลต์วงเล็บ / วงเล็บเหลี่ยม / วงเล็บปีกกาที่ตรงกัน หากมีวงเล็บเหลี่ยม วงเล็บ หรือวงเล็บปีกกาเกินมา เครื่องมือสำหรับนักพัฒนาเว็บจะไฮไลต์รายการนั้นด้วยสีแดง

ระบบจะไฮไลต์วงเล็บเหลี่ยม วงเล็บ หรือวงเล็บปีกกาที่ตรงกันเป็นสีเทาเมื่อเคอร์เซอร์อยู่ข้างวงเล็บดังกล่าว

Smart Return เมื่อคุณพิมพ์โค้ดบล็อกหลายบรรทัด ตอนนี้ DevTools จะทราบว่าควรสร้างบรรทัดใหม่หรือเรียกใช้โค้ดทุกครั้งที่คุณกด Enter ตัวอย่างเช่น สมมติว่าคุณต้องการประเมินลูป for
ต่อไปนี้ในคอนโซล
for (var i = 0; i < 5; i++) {
console.log(i);
}
ก่อนหน้านี้ การกด Enter หลังจากพิมพ์บรรทัดแรกจะทําให้เครื่องมือสําหรับนักพัฒนาเว็บประเมินบรรทัดนั้น ซึ่งจะทําให้เกิดข้อผิดพลาด หากต้องการเขียนโค้ดบล็อกต่อในบรรทัดใหม่ คุณจะต้องกด Shift ค้างไว้ก่อนกด Enter ในทางตรงกันข้าม ตอนนี้ DevTools จะต่อบล็อกโค้ดในบรรทัดใหม่โดยอัตโนมัติหลังจากที่คุณกด Enter ตามที่คาดไว้
เคอร์เซอร์หลายตัว กด Command (Mac) หรือ Control+Alt (Windows, Linux) ค้างไว้ แล้วคลิก

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

User Agent ใหม่: UC Browser
ตอนนี้คุณเลือก UC Browser สำหรับ iOS, Android หรือ Windows Phone ได้จากแท็บลิ้นชักสภาพเครือข่าย

การแชร์คือการแสดงความห่วงใย
และเช่นเคย เรายินดีรับฟังความคิดเห็นหรือไอเดียเกี่ยวกับ DevTools
- ติดต่อเราได้ที่ ChromeDevTools ใน Twitter หากมีคำถามสั้นๆ หรือความคิดเห็น หรือต้องการแชร์ไอเดียใหม่ๆ
- หากต้องการการสนทนาที่ยาวขึ้น รายชื่ออีเมลหรือ Stack Overflow จะเป็นตัวเลือกที่ดีที่สุด
- หากมีปัญหาเกี่ยวกับเอกสาร โปรดเปิดปัญหาในรีโพซิทอรีเอกสาร
- คุณติดต่อทีมโดยตรงเพื่อรายงานข้อบกพร่องหรือขอฟีเจอร์ใน Crbug ได้ทุกเมื่อ
พบกันใหม่ในเดือนหน้า
Kayce