如何在 TestCafe 中单击 jQuery 对话框按钮

Question

我正在使用 TestCafe 创建一个自动化测试，并且需要使用“确定”按钮关闭一个 jQuery 对话框。

由 jQuery Dialog 生成的 HTML（包含 OK 按钮）：

<div tabindex="-1" role="dialog" class="ui-dialog ui-corner-all ui-widget ui-widget-content ui-front ui-dialog-buttons information-dialog" aria-describedby="alert-dialog" aria-labelledby="ui-id-2" style="height: auto; width: 300px; top: 325.046px; left: 645.5px;">
<div class="ui-dialog-titlebar ui-corner-all ui-widget-header ui-helper-clearfix">
<span id="ui-id-2" class="ui-dialog-title">Information</span>
<button type="button" class="ui-dialog-titlebar-close" style="display: none;"></button>
</div>
<div id="alert-dialog" class="ui-dialog-content ui-widget-content" style="width: auto; min-height: 30.062px; max-height: none; height: auto;">Record created. Visit ID is 10008444</div>
<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
<div class="ui-dialog-buttonset"><button type="button" class="ui-button ui-corner-all ui-widget">OK</button></div>
</div>
</div>

TestCafe 脚本：

import { Selector } from 'testcafe';

 fixture `My Test`
.page ('http://localhost/');

test('LOBO PS test', async t => {
    await t
        .click('#btnPRSave')
        .click(Selector("button").withText("OK"));
});

上面的脚本将在“.click(Selector...”行中“找到”按钮，但是光标悬停在它上面而不点击。我错过了一步吗？

更新：

我创建了一个fiddle 来进一步测试它......它在那里工作正常。 TestCafe 脚本是：

import { Selector } from 'testcafe';

 fixture `My Test`
.page ('https://jsfiddle.net/gcass/63fbm8ns/8/');

test('LOBO PS test', async t => {
    await t
    .switchToIframe('[name="result"]')
    .click(Selector("button").withText("OK"))
});

jsfiddle 和实际版本的区别是：

1. 小提琴使用 iFrame - 可能无关紧要；
2. 现实世界的对话框出现在 Bootstrap Modal 上...我怀疑这可能是相关的。

Answer 1

原来是IE问题。我在 Edge 和 Chrome 中运行了相同的测试，它点击了 jQuery 对话框按钮没问题。