Hướng Dẫn Làm Việc với Radio Buttons trong Playwright
Trong bài viết này, chúng ta sẽ tìm hiểu cách làm việc với radio buttons trong Playwright. Để bắt đầu, bạn cần cài đặt ứng dụng trên môi trường local để thực hành. Bạn có thể tham khảo hướng dẫn cài đặt ứng dụng theo liên kết bên dưới:
Hướng dẫn cài đặt ứng dụng local
Nội Dung Chính
Hôm nay, tôi sẽ cùng các bạn khám phá các bước cần thiết để thao tác với radio buttons. Sau đây là những bước chính mà chúng ta sẽ thực hiện:
- Tích vào radio button
- Kiểm tra trạng thái của radio button đã được tích
Thực Hiện Test Case cho Radio Buttons
Đầu tiên, bạn cần tạo một file test mới. Sau đó, chúng ta sẽ xây dựng test case để kiểm tra radio buttons như sau:
javascript
test('check radio buttons', async({page})=> {
// Mở trang và đi đến mục Form Layouts
await page.goto('http://localhost:4200/')
await page.getByText('Forms').click()
await page.getByText('Form Layouts').click()
// Thao tác với radio button
const usingTheGrid = page.locator('nb-card', {hasText:'Using the Grid'}) // Lưu lại local thẻ cha chưa radio button
// Tích vào radio button
await usingTheGrid.getByRole('radio',{name: 'Option 1'}).check({force:true}) // Hoặc có thể dùng await usingTheGrid.getByLabel('Option 1').check({force:true})
// Kiểm tra radio button đã được tích hay chưa
const radioStatus = await usingTheGrid.getByRole('radio',{name: 'Option 1'}).isChecked()
expect(radioStatus).toBeTruthy() // Hoặc sử dụng await expect(usingTheGrid.getByRole('radio', {name: 'Option 1'})).toBeChecked()
// Kiểm tra radio Option 2
await usingTheGrid.getByRole('radio',{name:'Option 2'}).check({force:true})
// Kiểm tra trạng thái của các options
expect(await usingTheGrid.getByRole('radio', {name: 'Option 1'}).isChecked()).toBeFalsy()
expect(await usingTheGrid.getByRole('radio', {name: 'Option 2'}).isChecked()).toBeTruthy()
})Như vậy, với những bước trên, bạn đã có thể làm việc với radio buttons trong Playwright một cách dễ dàng. Hãy thử nghiệm và áp dụng vào dự án của mình để thấy được hiệu quả!
source: viblo
