使用剧作家导航后元素不可见

Question

我正在使用 playwright 来实现我的浏览器自动化。

我单击一个超链接，将我带到 Google.com，我想在导航后验证“Google 搜索”按钮是否存在。这是我的代码。

const textToClick = "Visit Google"

const textToVerify = "Google Search"

const elements = await page.$$(`text=${textToClick}`)

await element[0].click()

const elements = await page.$$(`text=${textToVerify}`)

const elementLength = elements.length

console.log("Element Length::",elementLength, ":: TexToFind::",textToVerify)

当我使用 mocha 测试运行它时，找不到“Google 搜索”按钮。

但是当我通过 visual studio 调试器在节点的主入口文件（main.js）下运行相同的代码时；我能够找到“Google 搜索”按钮。

这是 playwright 调试器从 mocha 测试运行中得到的输出：

pw:api => page.goto 开始 +0ms
pw:api 导航到“file:///C:/devel/devspace/js/myAutomation/test/src/sampleApp.html”，等待“加载”[] + 3ms
pw:api 导航到“file:///C:/devel/devspace/js/myAutomation/test/src/sampleApp.html”[] +348ms
pw:api “domcontentloaded”事件触发 [] +7ms
pw:api “加载”事件触发 [] +276ms
pw:api <= page.goto 成功 +6ms
pw:api => elementHandle.click 开始 +364ms
pw:api 尝试 elementHandle.click 操作 [] +2ms
pw:api 等待元素可见、启用且不移动 [] +2ms
pw:api 元素可见、启用且不移动 [] +479ms
pw:api 在需要时滚动到视图中 [] +1ms
pw:api 完成滚动 [] +63ms
pw:api 检查元素在 (358.64,558.1) [] +66ms
pw:api 元素确实接收指针事件 [] +188ms
pw:api 执行 elementHandle.click 操作 [] +2ms
pw:api elementHandle.click 操作完成 [] +83ms
pw:api 等待预定导航完成 [] +3ms
pw:api 导航到“https://www.google.com/” [] +293ms
pw:api 导航已完成 [] +46ms
pw :api <= elementHandle.click succeeded +2ms
sleeping
sleeping finished
element Length:: 0 :: TexToFind:: Google Search
1) 测试超链接上的点击功能

您会注意到元素长度为零，表示未找到“Google 搜索”按钮

mocha 测试是什么使元素不可搜索，或者在超链接单击将您带到新网页后验证元素时是否需要处理与超链接相关的基本问题？

Answer 1

单击第一个链接将导致导航。所以你需要等待页面导航到谷歌。你可以这样做：await&nbsp;Promise.all([elements[0].click(),&nbsp;page.waitForNavigation()]);