Tổng Hợp Các Method Của Locator Trong Playwright - Hướng Dẫn Chi Tiết
5:00 read
Giới Thiệu
Locator là thành phần cốt lõi trong Playwright, cung cấp khả năng auto-waiting và retry tự động. Locator đại diện cho cách tìm element trên page tại bất kỳ thời điểm nào. Các method của Locator đóng vai trò quan trọng trong việc tương tác với trang web, cho phép bạn thực hiện mọi thao tác từ cơ bản đến phức tạp như click, điền form, kiểm tra trạng thái, và xử lý các tình huống đặc biệt. Hiểu và sử dụng thành thạo các method này là chìa khóa để viết test automation hiệu quả và ổn định.
1. Các Method Tương Tác Với Element
1.1. Click và Double Click
| Method | Mô Tả | Ví Dụ |
|---|---|---|
click() |
Click vào element | await page.getByRole('button').click() |
dblclick() |
Double-click element | await locator.dblclick() |
tap() |
Thao tác tap (cho thiết bị cảm ứng) | await locator.tap() |
Ví dụ click với options:
// Click với modifier key
await page.locator('canvas').click({
button: 'right',
modifiers: ['Shift'],
position: { x: 23, y: 32 }
});
1.2. Nhập Liệu (Input)
| Method | Mô Tả | Sử Dụng Khi |
|---|---|---|
fill() |
Điền giá trị vào input field | Nhập văn bản nhanh vào form |
type() (deprecated) |
Gõ từng ký tự | Không nên dùng, dùng pressSequentially() |
pressSequentially() |
Gõ từng ký tự (như người dùng thật) | Cần trigger keyboard events |
press() |
Nhấn một phím cụ thể | Nhấn Enter, Backspace, v.v. |
Ví dụ:
// Fill - Cách nhanh nhất
await page.getByRole('textbox').fill('example value');
// Press sequentially - Gõ từng ký tự
await locator.pressSequentially('Hello', { delay: 100 });
// Press - Nhấn phím đặc biệt
await page.getByRole('textbox').press('Backspace');
await locator.press('Control+A'); // Shortcut
1.3. Xóa và Clear
// Clear input field
await page.getByRole('textbox').clear();
// Blur - Remove focus
await locator.blur();
1.4. Hover và Focus
// Hover over element
await page.getByRole('link').hover();
// Focus vào element
await locator.focus();
// Scroll element vào view
await locator.scrollIntoViewIfNeeded();
Yêu cầu đăng nhập
Vui lòng đăng nhập để truy cập nội dung này
Additional Resources
Course Guide
Comprehensive PDF guide with examples
GitHub Repository
Example code for all lessons
Discussion
Have a question about this lesson? Post it here and get answers from instructors and peers.