TestCafe是否支持多tab测试

Question

我有一个场景，点击一个按钮会打开一个新标签，但是当我尝试使用 testCafe 时，它会在一个新的 window 而不是新的 tab.Why 中打开，这是吗？ testCafe不支持新tab场景吗？

Answer 1

我认为没有必要使用多个选项卡。通常人们会尝试测试 link 在新标签页中打开，但为什么呢？

<a class="c-cookie-bar__text-link" target="_blank" href="/private-data-info">More information</a>

您知道带有 target="_blank" 的 link 将在新选项卡中打开。这不是您的团队可以编程的，这就是浏览器的工作方式。如果在 link 中遇到此属性，几乎所有可以想象的浏览器都会表现相同。已经过测试，您无需在您的网站上重新测试它。

但是，您可能仍需要测试目标内容是否已加载或 link 是否符合您的要求。没关系，但您不需要多个选项卡。以下场景有意义：

检查 link 是否具有 target="_blank" 属性：

test             
    ('Check Target Attr', async t => {
        
        await t
            .expect(Selector('.c-cookie-bar__text-link').withAttribute('target', '_blank').exists)
                .ok();
});

检查 href 属性是否正确：

test             
    ('Check Href Attr', async t => {
        
        await t
            .expect(Selector('.c-cookie-bar__text-link').getAttribute('href'))
                .eql('/private-data-info');
});

检查内容是否在同一个选项卡中加载：

import getBaseUrl from '../Helpers/baseUrl';
import { Selector } from 'testcafe';

const baseUrl = getBaseUrl();

fixture `Link Handling`    
    .page(baseUrl); 

test             
    ('Go To Resource', async t => {
        
        const resource = await Selector('.c-cookie-bar__text-link')
            .getAttribute('href');
        await t
            .navigateTo(baseUrl + resource);
            // possibly some other assertions follow
});

检查http状态码（我这里用的是axios，但是在我的例子中并不是全部可见）：

import getBaseUrl from '../Helpers/baseUrl';
import { Selector } from 'testcafe';
import request from '../Helpers/networkRequest';

const baseUrl = getBaseUrl();

fixture `Link Handling`    
    .page(baseUrl);   

test             
    ('Check Status Code', async t => {
        
        const resource = await Selector('.c-cookie-bar__text-link')
            .getAttribute('href');
        const networkReq = await request({
            method: 'GET',
            url: baseUrl + resource
        });

        await t
            .expect(networkReq.status).eql(200);
});

如果你真的忽略了这一切，只需点击 TestCafe 中的link：

await t
    .click(Selector('.c-cookie-bar__text-link'));

它将在新的 window 中打开，如下所示：

TestCafe是否支持多tab测试

Does TestCafe support multiple tab testing

testing

automation

automated-tests

e2e-testing

testcafe