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

Sofia Emelianova

Loại bỏ dần cookie của bên thứ ba

Trang web của bạn có thể sử dụng cookie của bên thứ ba và đã đến lúc phải hành động khi chúng tôi sắp ngừng sử dụng các cookie này. Để tìm hiểu việc cần làm khi cookie của bên thứ ba bị ảnh hưởng, hãy xem bài viết Chuẩn bị cho việc ngừng sử dụng cookie của bên thứ ba.

Hộp đánh dấu Bao gồm cả vấn đề về cookie của bên thứ ba đã được bật theo mặc định cho tất cả người dùng Chrome. Vì vậy, thẻ Vấn đề giờ đây sẽ cảnh báo cho bạn về các cookie sẽ bị ảnh hưởng do việc ngừng sử dụng và loại bỏ dần cookie của bên thứ ba. Bạn có thể bỏ chọn hộp đánh dấu bất cứ lúc nào để không còn gặp phải những vấn đề này nữa.

Cảnh báo về việc cookie của bên thứ ba sắp ngừng hoạt động trong thẻ Vấn đề.

Vấn đề về Chromium: 1466310.

Phân tích cookie của trang web bằng Công cụ phân tích Hộp cát về quyền riêng tư

Tiện ích Công cụ phân tích Hộp cát về quyền riêng tư cho Công cụ cho nhà phát triển đang trong quá trình phát triển với phiên bản trước khi phát hành mới nhất là 0.3.2. Công cụ này giúp bạn hiểu cách trang web của bạn sử dụng cookie và cung cấp hướng dẫn về các API Chrome mới nhằm bảo đảm quyền riêng tư.

Cách phân tích cookie:

Cài đặt tiện ích này trong Chrome.
Mở trang web của bạn trong một thẻ duy nhất để có dữ liệu phân tích chính xác nhất.
Mở Công cụ cho nhà phát triển rồi chuyển đến bảng điều khiển Hộp cát về quyền riêng tư. Bảng điều khiển này có thể bị ẩn sau nút thả xuống ở trên cùng.
Mở phần Cookie rồi nhấp vào Analyze this tab (Phân tích thẻ này). Nếu công cụ này không tìm thấy cookie nào, hãy thử tải lại trang.

Công cụ phân tích Hộp cát về quyền riêng tư.

Để biết thêm thông tin về cách sử dụng Công cụ phân tích Hộp cát về quyền riêng tư (PSAT), hãy xem các bài viết sau:

Hướng dẫn của PSAT.
Để dự đoán những điều có khả năng xảy ra sau khi việc ngừng sử dụng có hiệu lực, hãy thiết lập Môi trường đánh giá.
Để xác định các khía cạnh sẽ bị ảnh hưởng, hãy xem Hành động phân tích chung.
Để tìm hiểu cách phân tích các tình huống phổ biến, trong đó có số liệu phân tích, thương mại điện tử, dịch vụ SSO, nội dung được nhúng, v.v., hãy xem các ví dụ minh hoạ trong Tình huống phân tích.

Ngoài ra, hãy xem hướng dẫn về Báo cáo vấn đề.

Danh sách bỏ qua nâng cao

Mẫu loại trừ mặc định cho `node_modules`

Phiên bản này bật biểu thức chính quy mặc định làm quy tắc loại trừ tuỳ chỉnh trong Cài đặt > Danh sách bỏ qua. Để giúp bạn chỉ tập trung vào mã của mình, Trình gỡ lỗi giờ đây sẽ bỏ qua các tập lệnh từ /node_modules/ và /bower_components/ theo mặc định. Bạn có thể tắt quy tắc này trong phần cài đặt bất cứ lúc nào.

Trước và sau khi thêm một biểu thức chính quy.

Vấn đề về Chromium: 1496301.

Các ngoại lệ hiện sẽ ngừng thực thi nếu được phát hiện hoặc truyền qua mã không bị bỏ qua

Khi bạn gỡ lỗi mã bằng Tạm dừng khi phát hiện các ngoại lệ được chọn, Trình gỡ lỗi giờ đây sẽ dừng thực thi trên các ngoại lệ đã phát hiện sau đây, cả đồng bộ và không đồng bộ:

Ngoại lệ được tìm thấy trong các khung không bị bỏ qua trong ngăn xếp lệnh gọi.
Phát hiện ngoại lệ truyền qua các khung không bị bỏ qua trong ngăn xếp lệnh gọi. Ví dụ: hãy xem ảnh chụp màn hình.

Tạm dừng khi phát hiện được một trường hợp ngoại lệ được truyền qua mã không bị bỏ qua.

Để kiểm tra hành vi này, hãy mở trang minh hoạ này:

Mở Công cụ cho nhà phát triển > Nguồn, thêm hidden thư mục vào danh sách bỏ qua rồi đánh dấu Tạm dừng khi phát hiện các trường hợp ngoại lệ.
Trên trang này, trong danh sách tình huống "Đã nắm bắt", hãy nhấp vào các nút khác nhau rồi xem quá trình thực thi bị tạm dừng trong các trường hợp được đề cập.

Để tạm dừng việc thực thi các ngoại lệ đã phát hiện và/hoặc chưa nắm bắt được (khi được kiểm tra) trong các lệnh gọi không đồng bộ, Debugger (Trình gỡ lỗi) sẽ tìm kiếm trình xử lý từ chối trong số các lời hứa. Kể từ phiên bản này, Trình gỡ lỗi không còn dự đoán rằng Promise.finally() sẽ phát hiện được một ngoại lệ, tương tự như cách khối try...finally không phát hiện bất kỳ trường hợp ngoại lệ nào.

Vấn đề về Chromium: 1489312, 1291064.

Đã đổi tên `x_google_ignoreList` thành `ignoreList` trong bản đồ nguồn

Thông số kỹ thuật của bản đồ nguồn đã áp dụng trường ignoreList thay vì x_google_ignoreList và Công cụ cho nhà phát triển hiện hỗ trợ tên mới cùng với trường dự phòng cho trường cũ. Khung và trình gói hiện có thể sử dụng tên trường mới.

Bản đồ nguồn cho phép bạn gỡ lỗi mã bạn đã viết thay vì mã rút gọn do trang web của bạn phân phát.

Để biết thêm thông tin về bản đồ nguồn, hãy xem:

Bật/tắt chế độ nhập mới trong khi gỡ lỗi từ xa

Giờ đây, bạn có thể chuyển đổi giữa phương thức nhập bằng cách chạm và chuột khi gỡ lỗi thẻ Chrome từ xa. Ví dụ: khi bạn chạy một phiên bản Chrome bằng --remote-debugging-port=<port> và kết nối với mục tiêu mạng này thông qua chrome://inspect/#devices.

Xem video để xem cách bật/tắt chế độ nhập trong thực tế.

Vấn đề về Chromium: 1410433.

Giờ đây, bảng điều khiển Phần tử sẽ hiển thị URL cho các nút `#document`

Để cho phép bạn gỡ lỗi iframe dễ dàng hơn, bảng điều khiển Phần tử giờ đây hiển thị documentURL bên cạnh nút #document.

Phần trước và sau hiển thị documentURL bên cạnh nút #document.

Vấn đề về Chromium: 1376976.

Chính sách bảo mật nội dung có hiệu lực trong bảng điều khiển Ứng dụng

Giờ đây, bạn có thể xem thông tin chi tiết về Chính sách bảo mật nội dung (CSP) của một khung hình được kiểm tra. Để xem thông tin chi tiết, hãy chuyển đến Ứng dụng > Khung, chọn một khung rồi di chuyển xuống mục Chính sách bảo mật nội dung (CSP).

Mục Chính sách bảo mật nội dung nằm trong thẻ Ứng dụng.

Vấn đề về Chromium: 1424714.

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

Trong thẻ Ảnh động, giờ đây, bạn có thể:

Nhấp vào vị trí bất kỳ trên tiêu đề dòng thời gian để đặt con trỏ vị trí. Ảnh động sẽ tiếp tục phát nếu trước đó đã phát và dừng lại. Trước đây, bạn phải kéo nó.
Đổi kích thước cột tên để xem tên đầy đủ của ảnh động.

Vấn đề về Chromium: 1492460, 1489721.

Hộp thoại "Bạn có tin tưởng mã này không?" trong phần Nguồn và cảnh báo tự XSS trong Console

Hiện cảnh báo về Self-XSS khi dán mã thử nghiệm đã được bật theo mặc định. Self-XSS (tự tập lệnh trên nhiều trang web) là kỹ thuật tấn công lừa bạn dán mã độc hại vào Công cụ cho nhà phát triển và cho phép kẻ tấn công giành quyền kiểm soát tài khoản web và thông tin cá nhân của bạn.

Nếu bạn là người dùng Công cụ cho nhà phát triển mới và muốn dán mã, thì giờ đây, bảng điều khiển Nguồn sẽ cho bạn thấy hộp thoại Bạn có tin tưởng mã này không? và Bảng điều khiển lúc này sẽ hiển thị một cảnh báo tương tự. Chỉ dán mã mà bạn hiểu rõ và tự mình xem xét. Để dán, hãy nhập allow pasting khi được nhắc. Sau khi cho phép dán một lần, cảnh báo sẽ không bao giờ xuất hiện lại.

Hộp thoại "Bạn có tin tưởng mã này không?" khi dán mã vào Nguồn.

Vấn đề về Chromium: 345205.

Các điểm ngắt trình nghe sự kiện trong web worker và worklet

Khi bạn đặt điểm ngắt sự kiện trong Nguồn > Điểm ngắt trình xử lý sự kiện, ngoài việc tạm dừng sự kiện này trên trang web của bạn, Trình gỡ lỗi giờ đây cũng tạm dừng khi sự kiện tương ứng xảy ra trong trình thực thi web hoặc worklet thuộc bất kỳ loại nào, bao gồm cả Worklet bộ nhớ dùng chung.

Trình gỡ lỗi bị tạm dừng khi một trình chạy dịch vụ gọi hàm hết thời gian chờ đã đặt.

Vấn đề về Chromium: 1445175.

Huy hiệu nội dung nghe nhìn mới dành cho `<audio>` và `<video>`

Giờ đây, bạn có thể bật huy hiệu nội dung nghe nhìn mới cho các phần tử <audio> và <video> trong bảng điều khiển Phần tử. Khi nhấp vào huy hiệu, bạn sẽ được chuyển đến bảng Nội dung nghe nhìn để có thể gỡ lỗi các phần tử này.

Tính năng này đang trong quá trình phát triển và sẽ cải thiện hơn nữa. Nhóm Công cụ cho nhà phát triển muốn thể hiện sự biết ơn đối với Junseo (Jeremy) Yoo vì đã đạt được mục tiêu cải tiến này.

Vấn đề về Chromium: 1448214.

Tải trước đã đổi tên thành Tải theo suy đoán

Để tránh lạm dụng cụm từ trước và phản ánh hành vi này rõ ràng hơn, chúng tôi đã đổi tên Ứng dụng > Tải trước thành Tải theo suy đoán. Tải theo suy đoán cho phép tải trang gần ngay lập tức dựa trên các quy tắc suy đoán mà bạn có thể xác định để trang web của mình kết xuất trước và tìm nạp trước hầu hết các trang được điều hướng đến.

Trước và sau khi đổi tên quá trình tải trước thành tải theo suy đoán.

Vấn đề về Chromium: 1478888.

Lighthouse 11.2.0

Bảng điều khiển Lighthouse hiện chạy phiên bản Lighthouse 11.2.0. Xem danh sách đầy đủ các thay đổi.

Trong lần cập nhật này, chúng tôi đã điều chỉnh danh mục hiệu suất. Giờ đây, thông tin chi tiết về hiệu suất sẽ được tính điểm và ưu tiên dựa trên mức tác động ước tính đối với các chỉ số về hiệu suất. Ngoài ra, thang đo điểm hiệu suất còn cung cấp thêm thông tin chi tiết về mức độ ảnh hưởng của từng chỉ số đối với điểm số này.

Cải tiến hiệu suất trước và sau.

Để tìm hiểu thông tin cơ bản về cách sử dụng bảng điều khiển Lighthouse trong Công cụ cho nhà phát triển, hãy xem bài viết Lighthouse: Tối ưu hoá tốc độ trang web.

Vấn đề về Chromium: 772558.

Cải tiến về khả năng hỗ trợ tiếp cận

Phiên bản này có các điểm cải tiến về khả năng hỗ trợ tiếp cận như sau:

Trình đọc màn hình hiện sẽ thông báo trạng thái (đã đánh dấu hoặc bỏ đánh dấu) của các hộp đánh dấu trong Nguồn > Điểm ngắt.
Giờ đây, bạn có thể truy cập trình đơn thả xuống Ẩn các vấn đề tương tự bằng bàn phím.

Vấn đề về Chromium: 1488645, 1484918.

Nội dung nổi bật khác

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

Hiệu suất: Khắc phục vấn đề chỉ báo LCP (Nội dung lớn nhất hiển thị) đôi khi bị thiếu trong bản ghi (1487136).
Tải theo suy đoán: Khắc phục URL đầy đủ cho các mục tiêu trong trình đơn thả xuống trong bảng điều khiển Mạng (1471020).
Phạm vi bao phủ:
- Sửa mức độ sử dụng từng dòng cho mã được in đẹp (1464974).
- Thông tin về mức độ phù hợp hiện được cập nhật khi tải lại trang (1494457).
Bảng điều khiển:
- Khắc phục lỗi lựa chọn một phần văn bản trong thông báo (1487449).
- Khắc phục trình đơn thả xuống tự động hoàn thành nhấp nháy (1487453).
- Dấu ngoặc đơn được hỗ trợ trong đường dẫn ngăn xếp và URL trong dấu vết ngăn xếp (1473926).
Nguồn: Đã hỗ trợ tính năng làm nổi bật cú pháp của từ khoá using TypeScript (1490515).
Trình đơn Mở nhanh hiện hiển thị các phương thức riêng tư (1492957).
Ứng dụng > Dịch vụ nền: Thanh thao tác trên cùng hiện gói văn bản khi đổi kích thước (1487276).
Phần tử > Kiểu:
- Sửa độ phân giải của các biến CSS kế thừa cho các phần tử được phân vùng (1492162).
- Khi vô hiệu hoá một thuộc tính CSS, nhận xét của thuộc tính đó giờ đây sẽ bị xoá để sửa lỗi ngắt cú pháp (1101224).
Mạng: Giờ đây, cột Mức độ ưu tiên hiển thị chú giải công cụ có thông tin về mức độ ưu tiên ban đầu (nội dung này sẽ xuất hiện khi bạn đánh dấu vào mục Hàng yêu cầu lớn) (1495735).
Ngừng sử dụng:
- Chế độ cài đặt Định dạng màu đã bị tắt trong các phiên bản trước và hiện đã bị xoá.
- Tuỳ chọn Xoá tất cả chế độ ghi đè trong Nguồn hiện đã bị xoá do mức sử dụng thấp sau khi đơn giản hoá các cơ chế ghi đè (1473681).

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

Hãy cân nhắc việc sử dụng Chrome Canary, Nhà phát triển hoặc Beta làm trình duyệt phát triển mặc định của bạn. Các kênh xem trước này cho phép bạ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, kiểm thử các API nền tảng web tiên tiến và tìm ra các vấn đề trên trang web của bạn trước khi người dùng 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 để thảo luận về các tính năng và thay đổi mới trong bài đăng, hoặc bất cứ nội dung nào khác liên quan đến Công cụ cho nhà phát triển.

Gửi đề xuất hoặc phản hồi cho chúng tôi qua crbug.com.
Báo cáo sự cố trong Công cụ cho nhà phát triển bằng cách sử dụng Tuỳ chọn khác > Trợ giúp > Báo cáo vấn đề về Công cụ cho nhà phát triển trong Công cụ cho nhà phát triển.
Tweet tại @ChromeDevTools.
Để 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 Mẹo video trên YouTube trong Công cụ cho nhà phát triển.