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

Điều tiết yêu cầu WebSocket

Bảng điều khiển Network (Mạng) hiện hỗ trợ điều tiết các yêu cầu cổng web. Trước đây, tính năng hạn chế mạng không hoạt động đối với các yêu cầu cổng web.

Mở bảng điều khiển Mạng, nhấp vào một yêu cầu cổng web rồi mở thẻ Thông báo để quan sát quá trình chuyển tin nhắn. Chọn 3G chậm để điều chỉnh tốc độ.

Điều tiết yêu cầu WebSocket

Vấn đề với Chromium: 423246

Ngăn New Reporting API (API Báo cáo mới) trong bảng Application (Ứng dụng)

Sử dụng ngăn API Báo cáo mới để theo dõi các báo cáo được tạo trên trang của bạn và trạng thái của các báo cáo đó.

API Báo cáo được thiết kế để giúp bạn theo dõi các lỗi vi phạm bảo mật trên trang, các lệnh gọi API không dùng nữa, v.v.

Mở một trang sử dụng API Báo cáo (ví dụ: trang minh hoạ). Trong bảng Ứng dụng, hãy di chuyển xuống phần Dịch vụ nền rồi chọn ngăn API Báo cáo.

Mục Báo cáo hiển thị cho bạn danh sách các báo cáo được tạo trên trang của bạn và trạng thái của các báo cáo đó. Nhấp vào báo cáo đó để xem thông tin chi tiết về báo cáo.

Phần Điểm cuối cung cấp cho bạn thông tin tổng quan về tất cả điểm cuối đã định cấu hình trong tiêu đề Reporting-Endpoints.

Ngăn API báo cáo

Vấn đề với Chromium: 1205856

Hỗ trợ đợi cho đến khi phần tử hiển thị/nhấp vào được trong bảng điều khiển Máy ghi âm

Khi phát lại bản ghi luồng người dùng, bảng điều khiển Ghi âm giờ đây sẽ đợi cho đến khi phần tử hiển thị hoặc có thể nhấp trong khung nhìn hoặc cố gắng tự động cuộn phần tử vào khung nhìn trước khi phát lại bước. Trước đây, quá trình phát lại sẽ không hoạt động ngay lập tức.

Dưới đây là ví dụ về trình đơn ngoài màn hình được đặt bên ngoài khung nhìn và trượt vào khi được kích hoạt. Luồng người dùng chuyển đổi trình đơn rồi nhấp vào mục trong trình đơn. Trước đây, quá trình phát lại sẽ không thành công ở bước cuối cùng vì mục trong trình đơn vẫn đang trượt vào và chưa hiển thị trong khung nhìn. Vấn đề này hiện đã được khắc phục.

Vấn đề với Chromium: 1257499

Tạo kiểu, định dạng và lọc hiệu quả hơn trên bảng điều khiển

Định kiểu đúng thông điệp nhật ký bằng mã thoát ANSI

Giờ đây, bạn có thể sử dụng trình tự thoát ANSI để tạo kiểu đúng cách cho các thông báo trong bảng điều khiển. Trước đây, bảng điều khiển Công cụ cho nhà phát triển có khả năng hỗ trợ rất hạn chế (và một phần bị hỏng) cho các trình tự thoát ANSI.

Các nhà phát triển Node.js thường tô màu thông điệp nhật ký thông qua trình tự thoát ANSI, thường với sự trợ giúp của một số thư viện định kiểu như phấn, màu, ansi-colors, kleur, v.v.

Với những thay đổi này, giờ đây bạn có thể gỡ lỗi ứng dụng Node.js của mình một cách liền mạch bằng Công cụ cho nhà phát triển, với các thông báo trên bảng điều khiển có màu phù hợp. Hãy mở bản minh hoạ này để tự xem!

Để tìm hiểu thêm về cách định dạng và định kiểu thông báo trên bảng điều khiển bằng Công cụ cho nhà phát triển, hãy tham khảo tài liệu về định dạng và định kiểu thông báo trong Bảng điều khiển.

định kiểu bảng điều khiển

Các sự cố với Chromium: 1282837, 1282076

Hỗ trợ đúng cách các thông số định dạng %s, %d, %i%f

Bảng điều khiển hiện thực hiện đúng cách các lượt chuyển đổi loại %s, %d, %i%f như được chỉ định trong Tiêu chuẩn của Play Console. Trước đây, kết quả của cuộc trò chuyện không nhất quán.

hỗ trợ thông số định dạng trong thông báo bảng điều khiển

Các sự cố với Chromium: 1277944, 1282076

Bộ lọc nhóm bảng điều khiển trực quan hơn

Khi lọc thông báo trên bảng điều khiển, một thông báo trên bảng điều khiển sẽ xuất hiện nếu nội dung thông báo khớp với bộ lọc hoặc tiêu đề của nhóm (hoặc nhóm đối tượng cấp trên) khớp với bộ lọc. Trước đây, tiêu đề nhóm bảng điều khiển sẽ xuất hiện bất kể bộ lọc.

Ngoài ra, nếu thông báo trên bảng điều khiển xuất hiện, thì nhóm (hoặc nhóm đối tượng cấp trên) chứa thông báo đó cũng sẽ xuất hiện.

bộ lọc nhóm bảng điều khiển

Vấn đề với Chromium: 1068788

Cải tiến bản đồ nguồn

Gỡ lỗi tiện ích của Chrome bằng tệp bản đồ nguồn

Giờ đây, bạn có thể gỡ lỗi tiện ích của Chrome bằng các tệp bản đồ nguồn. Trước đây, Công cụ cho nhà phát triển chỉ hỗ trợ sơ đồ nguồn cùng dòng để gỡ lỗi tiện ích của Chrome.

Gỡ lỗi tiện ích của Chrome bằng tệp bản đồ nguồn

Vấn đề với Chromium: 212374

Cải thiện cây thư mục nguồn trong bảng điều khiển Nguồn

Cây thư mục nguồn trong bảng điều khiển Nguồn hiện đã được cải thiện và bớt lộn xộn trong cấu trúc và cách đặt tên thư mục (ví dụ: “../”, “./”, v.v.). Trong trường hợp này, đây là kết quả của việc chuẩn hoá các URL nguồn tuyệt đối trong bản đồ nguồn.

Cải thiện cây thư mục nguồn trong bảng điều khiển Nguồn

Vấn đề với Chromium: 1284737

Hiển thị các tệp nguồn của trình chạy trong bảng điều khiển Nguồn

Các tệp nguồn Worker (ví dụ: web worker, service worker) có SourceURL tương đối hiện hiển thị trong bảng điều khiển Source. Trước đây, các tệp nguồn của trình chạy không được xử lý đúng cách.

ALT_TEXT_HERE

Vấn đề với Chromium: 1277002

Thông tin cập nhật về Giao diện tối tự động của Chrome

Giao diện người dùng mô phỏng Giao diện tối tự động hiện đã được đơn giản hoá. Hiện tại, hộp đánh dấu là một hộp đánh dấu, trước đây là một trình đơn thả xuống.

Ngoài ra, khi bạn bật Giao diện tối tự động, trình đơn thả xuống Emulate prefers-color- Scheme sẽ tắt và tự động được đặt thành prefers-color-Schema: Dark.

Chrome 96 ra mắt Bản dùng thử theo nguyên gốc cho Giao diện tối tự động trên Android. Với tính năng này, trình duyệt sẽ áp dụng giao diện tối được tạo tự động cho các trang web có giao diện sáng khi người dùng chọn sử dụng giao diện tối trong Hệ điều hành.

Mô phỏng Giao diện tối tự động

Vấn đề với Chromium: 1243309

Công cụ chọn màu và ngăn chia thân thiện với thao tác chạm

Giờ đây, bạn có thể chọn màu và đổi kích thước Ngăn trong Công cụ cho nhà phát triển bằng ngón tay hoặc bút cảm ứng trên thiết bị màn hình cảm ứng.

Dưới đây là ví dụ được chụp bằng màn hình cảm ứng của thiết bị Google Pixelbook.

Các sự cố với Chromium: 1284245, 1284995

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:

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   Thêm   > 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.

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

Danh sách mọi nội dung được đề cập trong loạt video Tính năng mới trong Công cụ cho nhà phát triển.

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Kiến thức cơ bản về Chrome

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 đã bị huỷ.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59