You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Playwright 1.27.1:iframe中可点击输入框却无法点击按钮问题

问题:Playwright无法点击iframe内的按钮(元素提示在视口外但实际可见)

我安装了PlayWright 1.27.1版本,正在编写简单测试做概念验证。我的网站大量使用包含React代码的iframe,想验证能否和这些frame交互,但遇到了按钮点击失败的问题。用data-testid定位元素时,输入框可以正常点击填充,但按钮点击始终超时,试过多种定位方式都没用。

以下两行代码中,第一行能正常运行,第二行超时:

await page.frameLocator('#managementv2-iframe').getByTestId('searchCustomers').click();
await page.frameLocator('#managementv2-iframe').getByTestId('AddProfile').click();

更新1:调整代码后确认已经找到按钮,但点击操作还是超时。提示元素在视口外,但按钮实际是可见的。

更新2:测试按钮的可见性和文本都正常,只有点击操作异常。按钮在页面中清晰可见,采用flex布局,没有浮动。

追踪日志:

locator.click: Element is outside of the viewport
=========================== logs ===========================
  waiting for frame "#managementv2-iframe"
  selector resolved to visible <iframe width="100%" height="100%" allow="camera *;" id=…>↵⇆<meta http-equiv="Pragma" content="no-cache">↵⇆…</iframe>
waiting for selector "#managementv2-iframe >> internal:control=enter-frame >> internal:attr=[data-testid="AddProfile"]"
  selector resolved to visible <button type="button" class="jss54 primary" data-testid=…>…</button>
attempting click action
  waiting for element to be visible, enabled and stable
    forcing action
  element is visible, enabled and stable
  scrolling into view if needed
  done scrolling
============================================================

  41 |  await expect(addButton).toBeVisible();
  42 |  await expect(addButton).toHaveText('Add Profile');
> 43 |  await addButton.click({force: true});
     |                  ^
  44 |  await expect(page).toHaveURL('https://2249.whatever');
  45 |
  46 |  // await v2Frame?.getByTestId('AddProfile').click();

    at c:\asp.net\pw\tests\CustomersV2.spec.ts:43:18
    at c:\asp.net\pw\node_modules\@playwright\test\lib\workerRunner.js:426:9
    at TestInfoImpl._runFn (c:\asp.net\pw\node_modules\@playwright\test\lib\testInfo.js:166:7)
    at c:\asp.net\pw\node_modules\@playwright\test\lib\workerRunner.js:376:26
    at TimeoutManager.runWithTimeout (c:\asp.net\pw\node_modules\@playwright\test\lib\timeoutManager.js:73:7)
    at TestInfoImpl._runWithTimeout (c:\asp.net\pw\node_modules\@playwright\test\lib\testInfo.js:154:26)
    at WorkerRunner._runTest (c:\asp.net\pw\node_modules\@playwright\test\lib\workerRunner.js:356:5)
    at WorkerRunner.runTestGroup (c:\asp.net\pw\node_modules\@playwright\test\lib\workerRunner.js:218:11)
    at process.<anonymous> (c:\asp.net\pw\node_modules\@playwright\test\lib\worker.js:88:5)

内容的提问来源于stack exchange,提问作者Tom

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.13 01:50:33