Trang này được dịch bởi Cloud Translation API.

Tính năng mới trong Công cụ cho nhà phát triển (Chrome 80)

Kayce Basques

Hỗ trợ việc khai báo lại `let` và `class` trong Bảng điều khiển

Console hiện hỗ trợ khai báo lại câu lệnh let và class. Việc không thể khai báo lại là điều các nhà phát triển web thường thấy khó chịu khi sử dụng Console để thử nghiệm mã JavaScript mới.

Cảnh báo: Việc khai báo lại câu lệnh let hoặc class trong một tập lệnh bên ngoài Bảng điều khiển hoặc trong một dữ liệu đầu vào duy nhất của Bảng điều khiển sẽ vẫn gây ra SyntaxError.

Ví dụ: trước đây, khi khai báo lại biến cục bộ bằng let, Bảng điều khiển sẽ gửi lỗi:

Ảnh chụp màn hình Bảng điều khiển trong Chrome 78 cho thấy quá trình khai báo lại cho phép không thành công.

Console hiện cho phép khai báo lại:

Ảnh chụp màn hình Bảng điều khiển trong Chrome 80 cho thấy quá trình khai báo lại cho phép thành công.

Sự cố Chromium #1004193

Cải thiện tính năng gỡ lỗi WebAssembly

Công cụ cho nhà phát triển đã bắt đầu hỗ trợ Tiêu chuẩn gỡ lỗi DWARF, nghĩa là tăng cường hỗ trợ cho việc vượt qua mã, đặt điểm ngắt và phân giải dấu vết ngăn xếp bằng ngôn ngữ nguồn trong Công cụ cho nhà phát triển. Hãy tham khảo bài viết Gỡ lỗi WebAssembly được cải tiến trong Công cụ của Chrome cho nhà phát triển để biết toàn bộ câu chuyện.

Ảnh chụp màn hình về bước gỡ lỗi WebAssembly mới dựa trên DWARF.

Nội dung cập nhật về bảng điều khiển mạng

Yêu cầu chuỗi trình khởi tạo trong thẻ Trình khởi tạo

Giờ đây, bạn có thể xem các phương thức khởi tạo và phần phụ thuộc của một yêu cầu mạng dưới dạng danh sách lồng nhau. Điều này có thể giúp bạn hiểu lý do tại sao một tài nguyên được yêu cầu hoặc hoạt động mạng nào do một tài nguyên nhất định (chẳng hạn như tập lệnh) gây ra.

Ảnh chụp màn hình về Chuỗi trình khởi tạo yêu cầu trong thẻ Trình khởi tạo

Sau khi ghi nhật ký hoạt động mạng trong bảng điều khiển Mạng, hãy nhấp vào một tài nguyên, rồi chuyển đến thẻ Trình khởi tạo để xem Chuỗi trình khởi tạo yêu cầu:

Tài nguyên được kiểm tra được in đậm. Trong ảnh chụp màn hình ở trên, https://web.dev/default-627898b5.js là tài nguyên được kiểm tra.
Các tài nguyên ở phía trên tài nguyên được kiểm tra là người tạo. Trong ảnh chụp màn hình ở trên, https://web.dev/bootstrap.js là đối tượng khởi tạo của https://web.dev/default-627898b5.js. Nói cách khác, https://web.dev/bootstrap.js đã gây ra yêu cầu mạng cho https://web.dev/default-627898b5.js.
Tài nguyên bên dưới tài nguyên được kiểm tra là phần phụ thuộc. Trong ảnh chụp màn hình ở trên, https://web.dev/chunk-f34f99f7.js là phần phụ thuộc của https://web.dev/default-627898b5.js. Nói cách khác, https://web.dev/default-627898b5.js đã gây ra yêu cầu mạng cho https://web.dev/chunk-f34f99f7.js.

Sự cố Chromium #842488

Làm nổi bật yêu cầu mạng đã chọn trong phần Tổng quan

Sau khi bạn nhấp vào một tài nguyên mạng để kiểm tra, bảng điều khiển Mạng giờ đây sẽ hiển thị đường viền màu xanh dương xung quanh tài nguyên đó trong mục Overview (Tổng quan). Điều này có thể giúp bạn phát hiện xem yêu cầu mạng đang diễn ra sớm hơn hay muộn hơn dự kiến.

Ảnh chụp màn hình ngăn Overview (Tổng quan) làm nổi bật tài nguyên được kiểm tra.

Sự cố Chromium #988253

Các cột URL và đường dẫn trong bảng điều khiển Mạng

Sử dụng các cột Path (Đường dẫn) và URL mới trong bảng điều khiển Network (Mạng) để xem đường dẫn tuyệt đối hoặc URL đầy đủ của từng tài nguyên mạng.

Ảnh chụp màn hình về cột Đường dẫn và URL mới trong bảng điều khiển Mạng.

Nhấp chuột phải vào tiêu đề bảng Thác nước, rồi chọn Đường dẫn hoặc URL để hiển thị các cột mới.

Sự cố Chromium #993366

Chuỗi tác nhân người dùng được cập nhật

Công cụ cho nhà phát triển hỗ trợ việc thiết lập chuỗi Tác nhân người dùng tuỳ chỉnh thông qua thẻ Điều kiện mạng. Chuỗi tác nhân người dùng ảnh hưởng đến tiêu đề HTTP User-Agent đính kèm với tài nguyên mạng, cũng như giá trị của navigator.userAgent.

Các chuỗi Tác nhân người dùng định sẵn đã được cập nhật để phản ánh các phiên bản trình duyệt hiện đại.

Ảnh chụp màn hình trình đơn Tác nhân người dùng trong thẻ Điều kiện mạng.

Để truy cập vào Điều kiện mạng, hãy mở Trình đơn Command và chạy lệnh Show Network Conditions.

Sự cố Chromium #1029031

Nội dung cập nhật về bảng điều khiển kiểm tra

Giao diện người dùng cấu hình mới

Giao diện người dùng cấu hình có thiết kế mới, thích ứng và các tuỳ chọn cấu hình điều tiết đã được đơn giản hoá. Vui lòng xem phần Điều tiết bảng điều khiển kiểm tra để biết thêm thông tin về những thay đổi đối với giao diện người dùng điều tiết.

Giao diện người dùng của cấu hình mới.

Cập nhật về thẻ Mức độ phù hợp

Chế độ bao phủ trên mỗi hàm hoặc trên mỗi khối

Thẻ Phạm vi lập chỉ mục có trình đơn thả xuống mới cho phép bạn chỉ định xem dữ liệu về mức độ sử dụng mã sẽ được thu thập theo hàm hay trên mỗi khối. Phạm vi áp dụng mỗi khối chi tiết hơn nhưng cũng tốn kém hơn nhiều khi thu thập. Công cụ cho nhà phát triển hiện sử dụng mức độ phù hợp cho mỗi chức năng theo mặc định.

Trình đơn thả xuống chế độ mức độ phù hợp.

Mức độ phù hợp bây giờ phải được bắt đầu bằng cách tải lại trang

Việc bật/tắt mức độ sử dụng mã mà không cần tải lại trang đã bị xoá vì dữ liệu về mức độ sử dụng không đáng tin cậy. Ví dụ: một hàm có thể được báo cáo là không dùng đến nếu quá trình thực thi đã diễn ra từ lâu và trình thu gom rác của V8 đã dọn dẹp hàm đó.

Sự cố Chromium #1004203

Tải kênh xem trước xuống

Hãy cân nhắc sử dụng Chrome Canary, Dev hoặc Beta làm trình duyệt phát triển mặc định. Các kênh xem trước này cung cấp cho bạn quyền truy cập vào các tính năng mới nhất của Công cụ cho nhà phát triển, thử nghiệm API nền tảng web tiên tiến và tìm ra sự cố trên trang web của bạn trước khi người dùng của bạn làm điều đó!

Liên hệ với nhóm Công cụ của Chrome cho nhà phát triển

Sử dụng các lựa chọn sau đây để thảo luận về các tính năng mới và thay đổi trong bài đăng hoặc bất cứ vấn đề nào khác liên quan đến Công cụ cho nhà phát triển.

Hãy gửi đề xuất hoặc phản hồi cho chúng tôi qua crbug.com.
Báo cáo sự cố của Công cụ cho nhà phát triển bằng cách sử dụng phần Tuỳ chọn khác > Trợ giúp > Báo cáo sự cố về Công cụ cho nhà phát triển trong Công cụ cho nhà phát triển.
Tweet tại @ChromeDevTools.
Hãy để lại bình luận về tính năng mới trong video trên YouTube của Công cụ cho nhà phát triển hoặc video trên YouTube.