在 TestCafe 中切换到 iframe 上下文后找不到元素

Question

原问题：

使用

browser.switchToFrame(iframeEl);

我可以切换到特定的 iframe window，没关系 - 单击元素等可以正常工作。

但是，无论出于何种原因，当 iframe 是当前上下文时使用 Selector 是行不通的。我怀疑这是因为 switchToFrame 是浏览器实例上的一个方法，我正在使用以这种方式导入的 Selector 函数：

import { Selector } from 'testcafe';

我的问题是 - 如果我想使用 testcafe select iframe 中的特定元素（例如读取其 HTML 属性） - 我应该如何处理它？我错过了什么吗？

来自 GitHub 线程的更多详细信息：

更多详细信息：我正在使用远程 src 创建一个 iframe，稍后我会向该 iframe 注入一些 HTML、CSS 和 JavaScript。我 100% 确定 iframe 将具有与我请求的 select 匹配的 DOM 元素或 - 但我仍然收到错误消息：Cannot obtain information about the node because the specified selector does not match any node in the DOM tree.

我的代码大致如下所示：

const iframeEl = await Selector('a-iframe_inner[name="something"]');
    if (await iframeEl.count === 0) {
      await this.fBrowser.switchToMainWindow();
    } else {
      await this.fBrowser.switchToIframe(iframeEl);
    }

const something = await Selector('.something');

并且在 await Selector 行代码中断。在我的其他测试中，我也在访问 iframe 并使用 await browser.click(someOtherThing); 单击某个元素，它可以完美运行。我也可以毫不费力地读取 iframe 的控制台状态。

我怀疑 iframe 元素的内容可能还没有准备好，但我想知道如何才能等到它准备好？我试过为 Selector 调用设置 timeout 选项，但它没有改变任何东西。您能否分享有关如何延迟获取 select 或切换到 iframe 上下文后的任何提示？

解决方案：

事实证明，这确实是我的一个错误。对不起。对于未来一代：Iframe 切换和使用 select 应该可以正常工作，至少在 TestCafe v0.20.1 中是这样。只需确保您的 selectors 匹配并且您确实在 iframe 上下文中，而不仅仅是认为您在那里

Answer 1

无需执行任何特殊操作即可使 Selectors 在 iframe 中工作。它应该按预期工作。如果他们不希望使用此 form 在官方存储库中创建错误报告，请提供一个演示该问题的示例，我将不胜感激。至于你的问题，我无法在一个简单的例子中重现这个问题。测试页：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<h1>Click me</h1>

<iframe id="frame" src="http://example.com" style="width: 500px; height: 500px;"></iframe>

</body>
</html>

测试代码：

import { Selector } from 'testcafe';

fixture `Selector in iframe`
    .page `../pages/index.html`;

const selector = Selector('h1');

test('test', async t => {
    await t.click(selector);

    console.log(await selector.innerText);

    await t.switchToIframe('#frame');

    await t.click(selector);

    console.log(await selector.innerText);
});

所有点击都按预期工作，我能够成功获得 Selector 的 innerText。此外，我建议您检查页面上真正存在的元素，Selector 指的是现有元素，并且该元素的宽度和高度大于零。

在 TestCafe 中切换到 iframe 上下文后找不到元素

Elements not found after switching to iframe context in TestCafe

testing

iframe

automated-tests

e2e-testing

testcafe

原问题：

来自 GitHub 线程的更多详细信息：

解决方案：