1. Giới thiệu
Sử dụng bảng điều khiển Máy ghi âm để ghi lại, phát lại và đo lường các luồng của người dùng.
Hãy xem bảng điều khiển Máy ghi âm mới (tính năng xem trước) với video bên dưới.
Kiến thức bạn sẽ học được
- Ghi lại luồng người dùng
- Phát lại luồng người dùng
- Chỉnh sửa luồng người dùng
- Đo lường luồng người dùng
Bạn cần có
- Máy tính đang hoạt động và Wi-Fi thực
- Chrome 101 trở lên.
2. Mở bảng điều khiển Máy ghi âm
Mở bảng điều khiển Máy ghi âm bằng các bước sau
- Mở Công cụ cho nhà phát triển.
- Nhấp vào Tùy chọn khác > Công cụ khác > Máy ghi.
Hoặc sử dụng Trình đơn lệnh để mở bảng điều khiển Máy ghi âm. 
3. Bắt đầu
Chúng tôi sẽ sử dụng trang giới thiệu đặt cà phê này. Thanh toán là luồng người dùng phổ biến giữa các trang web mua sắm.
Trong các phần tiếp theo, chúng tôi sẽ hướng dẫn bạn cách ghi lại, phát lại và đo lường quy trình thanh toán sau đây bằng bảng điều khiển Máy ghi âm:
- Thêm một quán cà phê vào giỏ hàng.
- Thêm một loại cà phê khác vào giỏ hàng.
- Chuyển đến trang giỏ hàng.
- Xóa một cà phê khỏi giỏ hàng.
- Bắt đầu quy trình thanh toán.
- Điền thông tin thanh toán.
- Ngày trả phòng.
4. Ghi lại luồng người dùng
- Mở trang bản minh họa. Nhấp vào nút Bắt đầu bản ghi mới để bắt đầu.
- Nhập "coffee checkout" vào hộp văn bản Tên bản ghi.
- Nhấp vào nút Bắt đầu bản ghi mới. Quá trình ghi đã được bắt đầu. Bảng này sẽ hiện Đang ghi... cho biết đang ghi.
- Nhấp vào Cappuccino để thêm sản phẩm đó vào giỏ hàng.
- Nhấp vào Americano để thêm sản phẩm vào giỏ hàng. Xin lưu ý rằng Máy ghi âm hiển thị các bước mà bạn đã thực hiện cho đến nay.
- Chuyển đến trang giỏ hàng.
- Xóa Americano khỏi giỏ hàng.
- Nhấp vào nút Tổng: $19,00 để bắt đầu quy trình thanh toán.
- Trong biểu mẫu chi tiết thanh toán, hãy điền vào hộp văn bản Tên và Email, rồi đánh dấu vào hộp Tôi muốn nhận thông tin cập nhật về đơn đặt hàng và thông báo khuyến mãi.
- Nhấp vào nút Gửi để hoàn tất quy trình thanh toán.
- Trong bảng điều khiển Máy ghi. Nhấp vào nút Kết thúc quá trình ghi để kết thúc quá trình ghi.
5. Phát lại luồng người dùng
Sau khi ghi lại luồng người dùng, bạn có thể phát lại luồng đó bằng cách nhấp vào nút Phát lại.
Bạn có thể xem bản phát lại luồng người dùng trên trang. Tiến trình phát cũng hiển thị trong bảng Máy ghi.
Bạn có thể mô phỏng một kết nối mạng chậm bằng cách định cấu hình tùy chọn cài đặt Phát lại. Ví dụ: mở rộng mục Cài đặt tính năng phát lại, chọn 3G chậm trong trình đơn thả xuống Mạng. 
Bạn cũng có thể đặt thời gian chờ dài hơn cho tất cả các bước.
Các chế độ cài đặt khác có thể được hỗ trợ trong tương lai. Hãy chia sẻ với chúng tôi chế độ phát lại mà bạn muốn!
6. Đo lường luồng người dùng
Bạn có thể đo lường hiệu suất của một luồng người dùng bằng cách nhấp vào nút Đo lường hiệu suất. Ví dụ: quy trình thanh toán là luồng người dùng quan trọng của một trang web mua sắm. Thông qua bảng Trình ghi, bạn có thể ghi lại quy trình thanh toán một lần và đo lường thường xuyên.
Trước tiên, việc nhấp vào nút Đo lường hiệu suất sẽ kích hoạt bản phát lại luồng người dùng, sau đó mở dấu vết hiệu suất trong bảng Hiệu suất.
Tìm hiểu cách phân tích hiệu suất thời gian chạy của trang bằng bảng Hiệu suất. Bạn có thể bật hộp đánh dấu Các chỉ số quan trọng về trang web trong bảng điều khiển Hiệu suất để xem các chỉ số của Các chỉ số quan trọng về trang web, xác định các cơ hội cải thiện trải nghiệm duyệt web của người dùng.
7. Chỉnh sửa luồng người dùng
Hãy xem qua các tùy chọn để chỉnh sửa luồng người dùng.
Ở đầu bảng điều khiển Máy ghi âm, có các tùy chọn để bạn:
- Thêm một bản ghi mới. Nhấp vào biểu tượng dấu + để thêm bản ghi mới.
- Xem tất cả bản ghi. Trình đơn thả xuống sẽ hiển thị danh sách các bản ghi đã lưu. Chọn tùy chọn [số] bản ghi để mở rộng và quản lý danh sách các bản ghi đã lưu.
- Xuất bản ghi. Bạn có thể xuất luồng người dùng dưới dạng tập lệnh Puppeteer để tùy chỉnh thêm tập lệnh.
- Xóa bản ghi âm. Xoá bản ghi đã chọn.
Bạn cũng có thể chỉnh sửa tên của bản ghi bằng cách nhấp vào nút chỉnh sửa bên cạnh bản ghi đó.
8. Chỉnh sửa các bước
Hãy xem qua các tùy chọn để chỉnh sửa các bước trong quy trình làm việc.
Mở rộng các bước
- Mở rộng từng bước để xem chi tiết về hành động. Ví dụ: mở rộng bước Click Elements "Cappuccino".
- Bước trên hiển thị hai bộ chọn. Để biết thêm thông tin, hãy xem bài viết Ưu tiên bộ chọn. Khi phát lại luồng người dùng, Trình ghi cố gắng truy vấn phần tử bằng một trong các bộ chọn theo trình tự. Ví dụ: nếu Trình ghi truy vấn thành công phần tử bằng bộ chọn đầu tiên, thì bộ ghi âm sẽ bỏ qua bộ chọn thứ hai và chuyển sang bước tiếp theo.
- Bạn có thể thêm hoặc xóa bất kỳ bộ chọn nào. Ví dụ: bạn có thể xóa bộ chọn số 2 vì trong trường hợp này chỉ cần
aria/Cappuccinolà đủ. Di chuột qua bộ chọn số 2 rồi nhấp vào biểu tượng - để xoá bộ chọn đó.
- Bạn cũng có thể chỉnh sửa bộ chọn. Ví dụ: nếu muốn chọn Mocha thay vì Cappuccino, bạn có thể chỉnh sửa giá trị bộ chọn thành aria/Mocha.
Hoặc nhấp vào nút Chọn rồi nhấp vào Mocha trên trang. - Phát lại luồng ngay, bạn nên chọn Mocha thay vì Cappuccino.
- Hãy thử chỉnh sửa các thuộc tính bước khác như type, target, value và các thuộc tính khác.
Thêm và xóa các bước
Bạn cũng có thể thêm và xóa các bước. Điều này sẽ hữu ích nếu bạn muốn thêm một bước bổ sung hoặc xóa một bước bị vô tình thêm vào. Thay vì ghi lại luồng người dùng, bạn chỉ cần chỉnh sửa luồng đó. Nhấp vào trình đơn kebab 3 dấu chấm bên cạnh bước để mở trình đơn.
- Ví dụ: sự kiện Scroll sau bước Mocha là không cần thiết. Bạn có thể chọn Xóa bước để xóa bước này.
- Giả sử bạn muốn chờ cho đến khi 9 cà phê hiển thị trên trang trước khi thực hiện bất kỳ bước nào.
- Trong trình đơn bước Mocha, hãy chọn Thêm bước trước.
- Trong Xác nhận phần tử, hãy chỉnh sửa bước mới bằng thông tin chi tiết sau:
- loại: WaitForElement
- bộ chọn số 1: .cup
- toán tử: == (nhấp vào nút thêm toán tử)
- số lượng: 9 (nhấp vào nút thêm số lượng)
- Phát lại luồng ngay bây giờ để xem các thay đổi.
9. Xin chúc mừng!
Chúc mừng bạn! Bạn đã hoàn thành thành công lớp học lập trình này!
À, bạn cũng có thể tùy chỉnh bộ chọn cho các bản ghi. Hãy truy cập vào tài liệu của chúng tôi để tìm hiểu thêm.