Nếu đang dùng Chrome 111 trở lên, có thể bạn đã nhận thấy chúng tôi đã thay đổi thiết kế của thanh bên có điểm ngắt. Với Chrome 113, thanh bên mới sẽ thay thế hoàn toàn thiết kế cũ. Mục tiêu của chúng tôi đối với việc thiết kế lại là cải thiện quy trình công việc có điểm ngắt bằng cách:
Cung cấp thông tin tổng quan tốt hơn trên mọi điểm ngắt đã đặt. Làm cho quy trình công việc thông thường của người dùng có các điểm ngắt dễ truy cập hơn và trực quan hơn. Hiển thị các tính năng điểm ngắt hiện có tuyệt vời.
Bài đăng này giả định rằng bạn đã quen với việc gỡ lỗi bằng các điểm ngắt. Nếu bạn chưa từng sử dụng điểm ngắt trước đây, hãy truy cập thông tin tổng quan về điểm ngắt và tìm hiểu thêm về cách bạn có thể sử dụng điểm ngắt để gỡ lỗi mã của mình.
Bây giờ, hãy cùng tìm hiểu những ưu điểm của thiết kế mới này và cách bạn có thể sử dụng thanh bên mới! Xin lưu ý rằng bản thiết kế lại tập trung vào việc làm cho các tính năng hiện có trở nên trực quan hơn và dễ truy cập hơn, thay vì thêm tính năng mới.
Tạm dừng các trường hợp ngoại lệ để điều tra lý do mã của bạn đang gửi lỗi
Mã của bạn có gửi một ngoại lệ không? Đừng lo! Công cụ của Chrome cho nhà phát triển cho phép bạn tạm dừng các trường hợp ngoại lệ để ngừng thực thi tại thời điểm trả về ngoại lệ. Việc này có thể giúp bạn điều tra và hiểu rõ hơn về các trường hợp mà mã của bạn gặp phải lỗi. Bạn có thể chọn xem bạn muốn tạm dừng đối với những trường hợp ngoại lệ bị phát hiện, ngoại lệ chưa được nắm bắt hay cả hai, bằng cách chọn các hộp đánh dấu tương ứng trong thanh bên.
Quản lý các điểm ngắt: mở rộng các nhóm điểm ngắt phù hợp và thu gọn các nhóm điểm ngắt khác để tập trung vào những điểm liên quan
Các điểm ngắt có thể trải rộng trên nhiều tệp. Thanh bên của điểm ngắt nhóm các điểm ngắt theo tệp chứa chúng. Chỉ tập trung vào những vấn đề quan trọng đối với phiên gỡ lỗi hiện tại của bạn bằng cách mở rộng các nhóm điểm ngắt phù hợp và thu gọn các nhóm còn lại.
Quản lý điểm ngắt: một lần nhấp để chuyển tới mã, xoá hoặc bật/tắt điểm ngắt
Thanh bên của điểm ngắt cho phép bạn thực hiện các thao tác phổ biến chỉ bằng một lần nhấp. Sau đây là tổng quan về cách bạn có thể ...
Di chuyển đến vị trí điểm ngắt trong Trình soạn thảo mã. Xoá một điểm ngắt hoặc tất cả các điểm ngắt trong một tệp. Bật hoặc tắt một điểm ngắt hay tất cả các điểm ngắt trong một tệp.
Và tất cả những việc này chỉ bằng một cú nhấp chuột! Tất nhiên, các tuỳ chọn này cũng có sẵn trong trình đơn theo bối cảnh:
Chuyển đến vị trí của điểm ngắt bằng cách nhấp vào đoạn mã của điểm ngắt
Bạn có muốn kiểm tra vị trí bạn đã đặt điểm ngắt và phân tích mã xung quanh không? Chỉ cần nhấp vào đoạn mã của một điểm ngắt trong thanh bên, vị trí mã sẽ được mở trong trình soạn thảo mã.
Xoá một điểm ngắt duy nhất hoặc tất cả các điểm ngắt trong một tệp bằng cách nhấp vào nút xoá
Di chuột qua một điểm ngắt hoặc một nhóm điểm ngắt để hiển thị nút xoá giúp xoá một hoặc tất cả các điểm ngắt trong tệp khi nhấp vào.
Tắt một hoặc tất cả các điểm ngắt trong một tệp
Đánh dấu hoặc bỏ đánh dấu hộp kiểm bên cạnh điểm ngắt để bật hoặc tắt điểm ngắt đó.
Để bật hoặc tắt tất cả các điểm ngắt trong một tệp, hãy di chuột qua nhóm điểm ngắt và chọn hoặc bỏ chọn hộp đánh dấu xuất hiện bên cạnh tên tệp.
Sử dụng các tính năng điểm ngắt ít được biết đến sau đây: điểm ngắt và điểm ghi nhật ký có điều kiện
Chỉnh sửa điều kiện điểm ngắt hoặc thay đổi nhật ký điểm ghi nhật ký của bạn bằng cách chỉnh sửa điểm ngắt
Chỉnh sửa điều kiện điểm ngắt hoặc nhật ký bằng cách di chuột qua điểm ngắt rồi nhấp vào nút chỉnh sửa xuất hiện. Thao tác này sẽ mở ra hộp thoại để thay đổi loại điểm ngắt và thông tin chi tiết về điểm ngắt.
Ngoài ra, hãy chọn dòng của điểm ngắt trong trình soạn thảo mã và nhập Control+Alt+b trên Linux và Command+Alt+b trên Mac để mở hộp thoại chỉnh sửa điểm ngắt.
Bạn cũng có thể nhanh chóng kiểm tra kỹ điều kiện hoặc nhật ký điểm ghi nhật ký bằng cách di chuột qua điểm ngắt trong thanh bên:
Kết luận
Mục tiêu của chúng tôi đằng sau việc thiết kế lại thanh bên điểm ngắt là làm cho việc gỡ lỗi với điểm ngắt dễ dàng hơn. Quan trọng nhất là chúng tôi muốn mọi thứ trở nên có cấu trúc hơn, dễ truy cập và dễ hiểu hơn. Chúng tôi hy vọng những điểm cải tiến này sẽ giúp ích cho bạn trong phiên gỡ lỗi tiếp theo!
Nếu bạn có đề xuất cải thiện thêm, hãy cho chúng tôi biết bằng cách gửi lỗi!
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.