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 113)

Sofia Emelianova

Jecelyn Yeen

Ghi đè tiêu đề phản hồi của mạng

Giờ đây, bạn có thể ghi đè tiêu đề phản hồi trong bảng điều khiển Network (Mạng). Trước đây, bạn cần quyền truy cập vào máy chủ web để thử nghiệm các tiêu đề phản hồi HTTP.

Với cơ chế ghi đè tiêu đề phản hồi, bạn có thể tạo nguyên mẫu cục bộ các bản sửa lỗi cho nhiều tiêu đề, bao gồm nhưng không giới hạn ở:

Để ghi đè tiêu đề, hãy chuyển đến Mạng > Tiêu đề > Tiêu đề phản hồi, di chuột qua giá trị của tiêu đề, nhấp vào rồi chỉnh sửa giá trị đó.

Lỗi CORS được khắc phục bằng tùy chọn ghi đè tiêu đề.

Bạn cũng có thể thêm tiêu đề tuỳ chỉnh.

Thêm tiêu đề tuỳ chỉnh.

Để chỉnh sửa tất cả cơ chế ghi đè ở một nơi duy nhất, hãy chỉnh sửa tệp .headers trong phần Nguồn > Ghi đè. Tại đó, bạn cũng có thể nhấp vào Thêm quy tắc ghi đè để ghi đè nhiều yêu cầu bằng ký tự đại diện (*).

Đang chỉnh sửa tất cả cơ chế ghi đè.

Sự cố Chromium: 1288023.

Cải tiến quy trình gỡ lỗi Nuxt, Vite và Rollup

Để giúp bạn xác định các vấn đề nhanh hơn trong quá trình gỡ lỗi, dấu vết ngăn xếp nâng cao hiện sẽ ẩn các khung hình đến từ các nguồn do Nuxt 3.3 trở lên. Công cụ cho nhà phát triển bỏ qua các khung như vậy:

Trong dấu vết trên Bảng điều khiển, ở đường liên kết Hiển thị N khung khác.
Trong Sources (Nguồn) > Call Stack (Ngăn xếp lệnh gọi), trong phần Show Skip- listed (Hiển thị các khung trong danh sách bỏ qua).

Dấu vết ngăn xếp trước và sau khi bật danh sách bỏ qua của bên thứ ba.

Để mang đến cho bạn những cải tiến này, các nhóm Công cụ cho nhà phát triển, Nuxt, Vite và Rollup đã hợp tác để sử dụng tiện ích bản đồ nguồn x_google_ignoreList:

Nhóm Công cụ cho nhà phát triển muốn thể hiện sự cảm kích với các nhóm Nuxt, Vite và Rollup vì đã giúp họ đạt được mục tiêu này. Chúng tôi trân trọng nỗ lực và sự hợp tác của bạn, những yếu tố quan trọng tạo nên sự thành công của việc triển khai này. Một lần nữa, cảm ơn bạn đã đóng góp!

Cải thiện CSS trong Phần tử > Kiểu

Thuộc tính và giá trị CSS không hợp lệ

Để giúp bạn chẩn đoán vấn đề CSS nhanh hơn, ngăn Styles hiện đã gạch ngang:

Toàn bộ phần khai báo CSS (giá trị thuộc tính và) khi tài sản CSS không hợp lệ.
Chỉ là giá trị khi thuộc tính CSS hợp lệ nhưng giá trị không hợp lệ.

Tên thuộc tính không hợp lệ và giá trị thuộc tính không hợp lệ.

Nhóm Công cụ cho nhà phát triển muốn cảm ơn Yisi(一丝) vì đã giúp cải thiện ứng dụng này.

Đường liên kết đến các khung chính trong thuộc tính viết tắt của ảnh động

Thuộc tính CSS viết tắt animation hiện chứa các đường liên kết đến @keyframes tại quy tắc tương ứng, nhờ đó, bạn có thể di chuyển trong ngăn Kiểu nhanh hơn.

Đường liên kết đến các khung chính trong thuộc tính viết tắt của ảnh động.

Vấn đề với Chromium: 1420656.

Chế độ cài đặt mới trong bảng điều khiển: Tự động hoàn thành khi nhấn Enter

Kể từ phiên bản trước (112), bạn có thể định cấu hình Bảng điều khiển Công cụ cho nhà phát triển để áp dụng đề xuất tự động hoàn thành khi nhấn Enter.

Theo mặc định, để chấp nhận đề xuất tự động hoàn thành, bạn có thể nhấn phím Tab hoặc Arrow right. Để tự động hoàn thành bằng Enter, hãy bật Cài đặt > Bảng điều khiển > Chấp nhận đề xuất tự động hoàn thành khi nhấn Enter.

Hộp đánh dấu tương ứng trong phần Cài đặt.

Ngoài ra, văn bản của một chế độ cài đặt khác cũng thân thiện với người dùng hơn: Xem việc đánh giá mã là hành động của người dùng.

Vấn đề với Chromium: 1276960.

Hộp thoại mở nhanh trong Trình đơn lệnh hiện chuyển sang màu xám các tệp của bên thứ ba trong danh sách bỏ qua để làm nổi bật các tệp mà bạn đã sáng tạo.

Tập lệnh được liệt kê trong danh sách bỏ qua trong hộp thoại mở nhanh trước và sau khi thay đổi.

Vấn đề với Chromium: 1424345.

Không dùng Trình phân tích tài nguyên JavaScript: Giai đoạn 2

Ngay từ Chrome 58, nhóm Công cụ cho nhà phát triển đã lên kế hoạch ngừng sử dụng Trình phân tích JavaScript, đồng thời yêu cầu các nhà phát triển Node.js và Deno sử dụng bảng điều khiển Hiệu suất để phân tích hiệu suất của CPU JavaScript.

Phiên bản 113 của Công cụ cho nhà phát triển bắt đầu giai đoạn 2 của việc ngừng sử dụng Trình phân tích tài nguyên JavaScript 4 giai đoạn. Trong giai đoạn này, bạn vẫn có thể mở bảng điều khiển nhưng giao diện người dùng của bảng điều khiển sẽ không còn nữa.

Để phân tích hiệu suất của CPU, hãy nhấp vào Go to Performance Panel (Chuyển đến bảng điều khiển hiệu suất).

Ngừng sử dụng Trình phân tích tài nguyên JavaScript.

Vấn đề với Chromium: 1354548.

Thông tin nổi bật khác

Dưới đây là một số sửa đổi đáng chú ý trong bản phát hành này:

Sửa lỗi in ra đẹp trong bảng điều khiển Sources (Nguồn) để xử lý tên biến có ký tự Unicode không chính xác (1425055).
Thẻ Vấn đề đã thêm thông báo mới về các vấn đề Tự động điền liên quan đến giá trị HTML không chuẩn (1399414).

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.