如何使用剧作家测试框架点击按钮？
目前，我正在NUXT项目中进行端到端测试。我想测试我项目的前端，以确保UI可以呈现和可单击。但是，我面临着我的按钮问题。感觉好像没有点击按钮。我很确定我的按钮的CSS选择器已正确定义，如下所示
屏幕
截图显示按钮显示了该按钮是悬停在或部分单击。有什么方法可以解决这个问题吗？
page.spec.ts
import { resolve, join } from 'path'
import { test, expect } from '@playwright/test'
const ROOT_PATH = resolve(__dirname, '..', 'screenshots')
test('job board test', async ({ page, baseURL }) => {
await page.goto(baseURL + '/') // <-- Nuxt app is running and route '/' is showing.
const html = await page.innerHTML('body')
console.log(html)
await expect(page.locator('h2').locator('text= meow')).toBeVisible()
await page.fill('text=User name', 'jeff');
await page.fill('text= Password', 'jeff');
await page.locator('.v-btn').click(); // button clicked
// Step 1 - Is Homepage working
await page.screenshot({ path: join(ROOT_PATH, 'detail.png') })
})
Currently , i am doing an end to end testing in my nuxt project. I want to test the frontend of my project to ensure the UI is presentable and clickable. However , I am facing a problem for my button. It felt like button is not clicked. I am pretty sure the css selector for my button is correctly defined as shown in here
The screenshot shows that the button is hovered over or partially clicked. Is there any way to solve this issue ?
page.spec.ts
import { resolve, join } from 'path'
import { test, expect } from '@playwright/test'
const ROOT_PATH = resolve(__dirname, '..', 'screenshots')
test('job board test', async ({ page, baseURL }) => {
await page.goto(baseURL + '/') // <-- Nuxt app is running and route '/' is showing.
const html = await page.innerHTML('body')
console.log(html)
await expect(page.locator('h2').locator('text= meow')).toBeVisible()
await page.fill('text=User name', 'jeff');
await page.fill('text= Password', 'jeff');
await page.locator('.v-btn').click(); // button clicked
// Step 1 - Is Homepage working
await page.screenshot({ path: join(ROOT_PATH, 'detail.png') })
})
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以尝试单击按钮。设置
forcetrue将绕过行动性检查。You can try force clicking the button. Setting
forcetotruewill bypass the actionability check.