Gần đây, một số tính năng được cập nhật đã được đưa vào Công cụ của Chrome cho nhà phát triển. Chúng ta sẽ bắt đầu từ những điểm cập nhật của bảng điều khiển Phần tử, sau đó chuyển sang bàn về Console, Dòng thời gian và nhiều nội dung khác.
Đã tắt tính năng sao chép quy tắc kiểu trong phần nhận xét
Giờ đây, toàn bộ quy tắc CSS trong ngăn Kiểu sẽ bao gồm các kiểu mà bạn đã tắt. Các kiểu này sẽ tồn tại trong bảng nhớ tạm như đã nhận xét. [crbug.com/316532]
Sao chép dưới dạng đường dẫn CSS
"Sao chép dưới dạng đường dẫn CSS" hiện có sẵn dưới dạng một mục trong trình đơn cho các nút DOM trong bảng điều khiển Phần tử (tương tự như mục trong trình đơn Sao chép XPath).
Việc tạo bộ chọn CSS không nhất thiết phải giới hạn ở biểu định kiểu/JavaScript, chúng cũng có thể là lựa chọn thay thế cho chiến lược định vị trong các thử nghiệm WebDriver. [crbug.com/277286]
Xem kiểu phần tử DOM bóng
Giờ đây, bạn có thể kiểm tra các kiểu của các phần tử con của một gốc bóng đổ. [crbug.com/279390]
Thao tác copy() của bảng điều khiển hoạt động với các đối tượng
Phương thức copy() từ Command Line API hiện hoạt động cho các đối tượng. Hãy tiếp tục và thử dùng copy({foo:'bar'}) trong bảng điều khiển để xem phiên bản đã được tạo chuỗi và định dạng của đối tượng hiện có trong bảng nhớ tạm của bạn như thế nào. [crbug.com/289348]
Bộ lọc Regex cho bảng điều khiển
Lọc thông báo trên bảng điều khiển bằng biểu thức chính quy trong bảng điều khiển. crbug.com/318308]
Dễ dàng xoá trình nghe sự kiện
Hãy thử getEventListeners(document).mousewheel[0]; trong bảng điều khiển để truy xuất trình nghe sự kiện con lăn chuột đầu tiên trên tài liệu. Tiếp tục, hãy thử $_.remove(); để xoá trình nghe sự kiện đó ($_ = giá trị của biểu thức được đánh giá gần đây nhất). crbug.com/309524]
Xoá cảnh báo CSS
Các cảnh báo kiểu "Giá trị thuộc tính CSS không hợp lệ" mà bạn có thể đã thấy nay đã bị xoá. Chúng tôi đang nỗ lực không ngừng để giúp việc triển khai trở nên hiệu quả hơn trước Dịch vụ so sánh giá (CSS) thực tế, bao gồm cả việc xâm nhập trình duyệt. crbug.com/309982]
Các hoạt động tiến trình được tóm tắt trong biểu đồ hình tròn
Bảng điều khiển Dòng thời gian hiện chứa biểu đồ hình tròn trong ngăn Chi tiết, cho thấy trực quan nguồn chi phí hiển thị của bạn. Điều này giúp bạn nhanh chóng xác định điểm tắc nghẽn của mình.
Bạn sẽ thấy rằng nhiều thông tin từng hiển thị trong cửa sổ bật lên giờ đây đã được đẩy lên ngăn riêng. Để xem, hãy bắt đầu ghi Dòng thời gian và chọn một khung, hãy ghi lại ngăn Chi tiết mới chứa biểu đồ hình tròn. Khi ở chế độ xem Khung, bạn sẽ nhận được những số liệu thống kê thú vị như FPS trung bình (1000ms/frame duration) cho(các) khung hình đã chọn. [crbug.com/247786]
Thông tin chi tiết về sự kiện đổi kích thước hình ảnh
Các sự kiện đổi kích thước và giải mã hình ảnh trong bảng điều khiển Dòng thời gian hiện chứa đường liên kết đến nút DOM trong bảng điều khiển Phần tử.
Đường liên kết URL của hình ảnh sẽ đưa bạn đến tài nguyên tương ứng trong bảng Tài nguyên. crbug.com/244159
Khung GPU
Các khung hình xảy ra trên GPU hiện sẽ hiển thị ở trên cùng, phía trên các khung hình trên luồng chính. crbug.com/305863]
Dừng trên trình nghe popstate
'popstate' hiện có sẵn dưới dạng điểm ngắt của trình nghe sự kiện trong thanh bên của bảng điều khiển Nguồn. [crbug.com/88112]
Cài đặt hiển thị có sẵn trong ngăn
Lúc này, việc mở ngăn sẽ hiển thị một số ngăn, một trong số đó là bảng điều khiển Kết xuất. Hãy sử dụng ngăn này để hiện hình chữ nhật vẽ, đồng hồ đo FPS, v.v. Tính năng này được bật theo mặc định tại phần Cài đặt > "Hiển thị khung hiển thị "Hiển thị" trong ngăn bảng điều khiển"
Sao chép hình ảnh dưới dạng URL dữ liệu
Giờ đây, thành phần hình ảnh trong bảng điều khiển Tài nguyên có thể được sao chép nội dung dưới dạng URI dữ liệu (data:image/png;base64,iVBO...).
Để thử trải nghiệm này, hãy tìm tài nguyên hình ảnh trong Khung > [Tài nguyên] > Hình ảnh rồi nhấp chuột phải vào bản xem trước hình ảnh để truy cập trình đơn theo bối cảnh, sau đó chọn "Sao chép hình ảnh dưới dạng URL dữ liệu". crbug.com/321132]
Lọc URI dữ liệu
Nếu bạn nghĩ rằng chúng thuộc về các URI đó, thì giờ đây bạn có thể lọc ra các URI dữ liệu ra khỏi thẻ Mạng. Chọn biểu tượng Bộ lọc
Đã sửa lỗi Thời gian mạng
Nếu bạn thấy hình ảnh của mình dường như mất 300.000 năm để tải xuống, chúng tôi xin lỗi. ;) Hiện đã khắc phục các dấu thời gian không chính xác này cho tài nguyên mạng. crbug.com/309570]
Hành vi ghi mạng có quyền kiểm soát nhiều hơn
Hành vi của mạng ghi có chút khác biệt. Trước tiên, nút ghi lại hoạt động giống như bạn thấy trong Dòng thời gian hoặc hồ sơ CPU. Vì bạn mong muốn việc này nên nếu bạn tải lại trang khi Công cụ cho nhà phát triển đang mở, thì quá trình ghi mạng sẽ tự động bắt đầu. Sau đó, tính năng này sẽ tắt nên nếu bạn muốn chụp hoạt động mạng sau khi tải trang, hãy bật tính năng này. Nhờ đó, bạn có thể dễ dàng hình dung thác nước của mình mà không cần gây lỗi mạng trễ. crbug.com/325878]
Giao diện Công cụ cho nhà phát triển hiện được cung cấp thông qua tiện ích
Biểu định kiểu người dùng hiện có sẵn thông qua Thử nghiệm cho nhà phát triển (hộp kiểm: "Cho phép giao diện người dùng tuỳ chỉnh") cho phép tiện ích của Chrome áp dụng kiểu tuỳ chỉnh cho Công cụ cho nhà phát triển. Xem phần Tiện ích giao diện Công cụ cho nhà phát triển mẫu để biết ví dụ. crbug.com/318566]
Trên đây là thông tin về ấn bản này của thông báo Công cụ cho nhà phát triển. Nếu bạn chưa tham gia, hãy xem ấn bản Tháng 11.