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

Kayce Basques

Nội dung mới trong Công cụ cho nhà phát triển trong Chrome 68:

Đọc tiếp hoặc xem phiên bản video của ghi chú phát hành ở bên dưới.

Bảng điều khiển hỗ trợ

Chrome 68 đi kèm một vài tính năng mới của Console liên quan đến tự động hoàn thành và xem trước.

Đánh giá nồng nhiệt

Khi bạn nhập một biểu thức trong Console, giờ đây Console có thể hiển thị bản xem trước kết quả của biểu thức đó bên dưới con trỏ.

Bảng điều khiển đang in kết quả của thao tác Sắp xếp() trước khi thực thi một cách rõ ràng.

Hình 1 Bảng điều khiển đang in kết quả của thao tác sort() trước khi nó được được thực thi rõ ràng

Cách bật tính năng Đánh giá Eager:

  1. Mở Bảng điều khiển.
  2. Mở phần Cài đặt Play Console Nút Cài đặt bảng điều khiển.
  3. Bật hộp đánh dấu Đánh giá Eager.

Công cụ cho nhà phát triển không chuẩn bị đánh giá xem biểu thức có gây ra tác dụng phụ hay không.

Gợi ý về đối số

Khi bạn nhập các hàm, giờ đây, Console sẽ cho bạn thấy các đối số mà hàm đó dự kiến.

Gợi ý về đối số trong Bảng điều khiển.

Hình 2. Nhiều ví dụ về gợi ý đối số trong Bảng điều khiển

Lưu ý:

  • Dấu hỏi chấm trước một đối số, chẳng hạn như ?options, đại diện cho đối số không bắt buộc.
  • Dấu ba chấm trước đối số, chẳng hạn như ...items, biểu thị tính lan truyền.
  • Một số hàm (chẳng hạn như CSS.supports()) chấp nhận nhiều chữ ký đối số.

Tự động hoàn thành sau khi thực thi hàm

Sau khi bật tính năng Đánh giá Eager, giờ đây, Console cũng cho bạn thấy những thuộc tính và hàm nào có sẵn sau khi bạn nhập một hàm.

Sau khi chạy document.querySelector('p'), giờ đây, Bảng điều khiển có thể cho bạn thấy các thuộc tính và hàm có sẵn cho phần tử đó.

Hình 3. Ảnh chụp màn hình trên cùng biểu thị hành vi cũ, còn ảnh chụp màn hình ở dưới cùng biểu thị hành vi cũ hành vi mới hỗ trợ tính năng tự động hoàn thành hàm

Từ khoá ES2017 trong tính năng tự động hoàn thành

Từ khoá ES2017 (chẳng hạn như await) hiện đã có trong giao diện người dùng tự động hoàn thành của Console.

Giờ đây, Play Console sẽ gợi ý chế độ "chờ" trong giao diện người dùng tự động hoàn thành.

Hình 4. Giờ đây, Play Console đề xuất await trong giao diện người dùng tự động hoàn thành

Quy trình kiểm tra nhanh hơn, đáng tin cậy hơn, giao diện người dùng mới và quy trình kiểm tra mới

Chrome 68 đi kèm với Lighthouse 3.0. Các phần tiếp theo là bản tóm tắt một số thay đổi lớn nhất. Xem bài viết Thông báo về Lighthouse 3.0 để biết toàn bộ thông tin.

Kiểm tra nhanh hơn, đáng tin cậy hơn

Lighthouse 3.0 có một công cụ kiểm tra nội bộ mới, có tên mã là Lantern, giúp bạn hoàn thành các hoạt động kiểm tra nhanh hơn và với ít sự chênh lệch giữa các lần chạy hơn.

Giao diện người dùng mới

Lighthouse 3.0 cũng mang đến giao diện người dùng mới nhờ sự cộng tác giữa Lighthouse và trải nghiệm người dùng Chrome (Nghiên cứu và thiết kế).

Giao diện người dùng mới của báo cáo trong Lighthouse 3.0.

Hình 5. Giao diện người dùng mới của báo cáo trong Lighthouse 3.0

Lượt kiểm tra mới

Lighthouse 3.0 cũng cung cấp 4 kiểm tra mới:

  • Nội dung đầu tiên hiển thị
  • robots.txt không hợp lệ
  • Dùng định dạng video cho nội dung động
  • Tránh nhiều chuyến đi khứ hồi tốn kém tới bất kỳ điểm khởi hành nào

Hỗ trợ BigInt

Chrome 68 hỗ trợ một số nguyên mới có tên là BigInt. BigInt cho phép bạn đại diện số nguyên có độ chính xác tuỳ ý. Hãy dùng thử trong Console:

Ví dụ về BigInt trong Console.

Hình 6. Ví dụ về BigInt trong Console (Bảng điều khiển)

Thêm đường dẫn thuộc tính vào đồng hồ

Trong khi tạm dừng trên một điểm ngắt, hãy nhấp chuột phải vào một thuộc tính trong ngăn Phạm vi rồi chọn Add property (Thêm thuộc tính) path to watch (đường dẫn đến đồng hồ) để thêm thuộc tính đó vào ngăn theo dõi.

Ví dụ về tuỳ chọn Thêm đường dẫn thuộc tính vào đồng hồ.

Hình 7. Ví dụ về trường hợp Thêm đường dẫn thuộc tính vào đồng hồ

"Hiện dấu thời gian" đã chuyển đến phần cài đặt

Hộp đánh dấu Hiển thị dấu thời gian trước đây trong phần Cài đặt Play Console Nút Cài đặt bảng điều khiển đã chuyển sang phần Cài đặt.

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ố Công cụ cho nhà phát triển bằng cách sử dụng Tuỳ chọn khác   Thêm > 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.

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 bài Tính năng mới trong Công cụ cho nhà phát triển.