3

我有以下测试：

fixture('Minimal reproduction')
  .page('http://www.sport-conrad.com/');


test('Navigate to item-details', async t => {
  await t
    .click('.dropdown-toggle')
    .click('.productData:first-of-type a')
  });

当我运行它时， testcafe chrome test.js 它按预期工作。

如果我这样做了，testcafe nightmare test.js我会得到错误The element that matches the specified selector is not visible.。

我追踪到这一事实，显然电子浏览器的噩梦使用打开了带有视口的页面，导致桌面导航消失，因此.dropdown-toggle不再可见。所以我通过添加手动调整大小来解决这个问题：

fixture('Minimal reproduction')
  .page('http://www.sport-conrad.com/');


test('Navigate to item-details', async t => {
  await t
    .resizeWindow(1024, 900)
    .click('.dropdown-toggle')
    .click('.productData:first-of-type a')
  });

所以我的第一个问题：虽然这可行，但是否有另一种方法可以提供 testcafe 在噩梦模式下打开浏览器的维度？

...但是：现在.dropdown-toggle又回来了，我希望测试再次通过，就像以前一样。

不幸的是，现在我遇到了另一个错误：The specified selector does not match any element in the DOM tree....这似乎与第二个选择器有关。我不确定为什么。

所以我的第二个问题：这里的噩梦浏览器有什么不同？我在另一个页面上尝试了一个类似的测试用例，它似乎可以像 chrome 一样正常加载页面。

我还尝试了一些解决方法，例如强制浏览器等待一段时间，但没有任何效果。

也许有人可以在这里为我指明正确的方向？:)

4

2 回答 2

3

1）目前，在您的情况下设置浏览器大小的唯一方法是使用t.resizeWindow命令。为避免代码重复，您可以在fixture.beforeEach挂钩中执行此操作（请参阅testcafe 文档）。

同时，Nightmare 允许通过其构造函数选项设置浏览器大小。但是有必要在插件中为此添加API testcafe-browser-provider-nightmare。

2) 我nightmare以可视模式（没有 TestCafe）打开了您的网站，并尝试点击该.dropdown-toggle链接。但不会发生重定向到新页面。经过一些调试后，我看到event.preventDefault()在脚本中调用了 click 事件。（在 chrome 中，这不会被调用并且会发生重定向）。脚本被缩小，因此很难确定调用 preventDefault 的真正原因。我认为这是电子浏览器特有的事情，有必要调查它为什么会发生。这是我如何运行它的脚本：

var Nightmare = require('nightmare');       
var nightmare = Nightmare({
    show: true,
    width: 1024,
    height: 600,
    webPreferences: { devTools: true },
    executionTimeout: 1000000,
    waitTimeout: 1000000
});

nightmare
  .goto('http://www.sport-conrad.com/')
  .wait(1000000)
  .end();
于 2017-04-10T10:01:18.080 回答
1

因此，在 Alexander 的帮助下（非常感谢！）我能够将这个错误的根源追溯到 jQuery。

以下几行似乎导致了这种行为：

    // Determine handlers
    handlerQueue = jQuery.event.handlers.call( this, event, handlers );

    // Run delegates first; they may want to stop propagation beneath us
    i = 0;
    while ( ( matched = handlerQueue[ i++ ] ) && !event.isPropagationStopped() ) {
        event.currentTarget = matched.elem;

        j = 0;
        while ( ( handleObj = matched.handlers[ j++ ] ) &&
            !event.isImmediatePropagationStopped() ) {

            // Triggered event must either 1) have no namespace, or 2) have namespace(s)
            // a subset or equal to those in the bound event (both can have no namespace).
            if ( !event.rnamespace || event.rnamespace.test( handleObj.namespace ) ) {

                event.handleObj = handleObj;
                event.data = handleObj.data;

                ret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle ||
                    handleObj.handler ).apply( matched.elem, args );

                if ( ret !== undefined ) {
                    if ( ( event.result = ret ) === false ) {
                        event.preventDefault();
                        event.stopPropagation();
                    }
                }
            }
        }
    }

    // Call the postDispatch hook for the mapped type
    if ( special.postDispatch ) {
        special.postDispatch.call( this, event );
    }

我不确定为什么会发生这种情况。尤其是为什么它只发生在测试与噩梦一起运行时，而其他浏览器似乎做得很好......

于 2017-04-10T15:17:39.893 回答