Cypress 请求默认等待？答案

【问题标题】：Cypress request wait by default?Cypress 请求默认等待？
【发布时间】：2019-02-19 12:52:28
【问题描述】：

默认情况下，我需要 Cypress 等待任何 xhr 请求完成，然后再执行任何操作。由于我正在测试的应用程序很慢并且会进行大量 api 调用，因此有什么方法可以将其设为默认值或任何其他替代方案？

编辑：为每个 api 请求编写一个语句会变得混乱和不必要的工作。需要一种方法来简化此操作。

【问题讨论】：

标签： javascript angular automation e2e-testing cypress

【解决方案1】：

如果您想要等待特定的 xhr，您可以使用 cy.route() 来完成。我在某些情况下使用它，它真的很有用。使用它的一般步骤是：

cy.server()
cy.route('GET','**/api/my-call/**').as('myXHR');
在 UI 中执行操作，例如单击将触发此类 api 调用的按钮
cy.wait(@myXHR)

这样，如果没有触发此类调用，您的测试将失败。您可以找到有关此here 的大量文档

【讨论】：

我不想等待特定的电话。默认情况下，我需要一种等待所有 xhr 请求的方法，为每个调用编写等待语句变得太混乱且工作量很大。
这里的问题是如果你需要等待 45 个 api 调用。如何以简单的方式做到这一点？

【解决方案2】：

在这里找到适合我的东西https://github.com/PinkyJie/cypress-auto-stub-example

寻找 cy.waitUntilAllAPIFinished

【讨论】：

【解决方案3】：

我部分解决了在 support 文件夹中添加 waitAll 命令并覆盖 route 命令的问题：

const routeCallArr = [];
Cypress.Commands.overwrite('route', (route, ...params) => {
    const localRoute = route(...params);
    if (localRoute.alias === undefined) return; 
    localRoute.onRequest = function() {
        routeCallArr.push({alias: `@${localRoute.alias}`, starTime: Date.now()});
    }
    localRoute.onResponse = function() {
        clearCall(`@${localRoute.alias}`);
    }
})
const waitAll = (timeOut = 50000, options = {verbose: false, waitNested: false}) => {
    const filterRouteCallArr = [];
    const date = Date.now();
    for (const routeCall of routeCallArr) {
        if ((date - routeCall.starTime) > timeOut) continue;
        filterRouteCallArr.push(routeCall.alias);
    }
    if (options.verbose ){
        console.table(routeCallArr.map(routeCall => ({
            deltaTime: date - routeCall.starTime,
            alias: routeCall.alias,
            starTime: routeCall.starTime,
        })));
        console.log(routeCallArr, filterRouteCallArr)
    };
    routeCallArr.length = [];
    if (filterRouteCallArr.length > 0) {
        const waiter = cy.wait(filterRouteCallArr, {timeout: timeOut});
        options.waitNested && waiter.then(() => {
            if (routeCallArr.length > 0) {
                waitAll(timeOut, options);
            }
        });
    }
}
Cypress.Commands.add('waitAll', waitAll)

在测试中我使用cy.wait(['@call01',..., '@callN']);而不是cy.waitAll();

当嵌套调用与原始调用相对独立的时间间隔时，就会出现此实现的问题。在这种情况下，您可以使用递归等待 cy.waitAll(50000, {waitNested: true});

【讨论】：