当 500 个 xhr 请求发生时,cypress 测试失败

Con*_*tin 5 e2e-testing cypress

我正在 cypress 中为 Web 应用程序编写端到端测试,如果应用程序发送任何带有 http 500 错误响应的请求,我希望 cypress 测试失败。

我使用的是 cypress 3.1.5 版本。我已经尝试过以下操作,但出现承诺错误。

    cy.server();
    cy.route({
      url: '**',
      onResponse: (xhr) => {
        cy.log(xhr);
      }
    });
Run Code Online (Sandbox Code Playgroud)

我希望找到一个更优雅的解决方案来解决这个问题,因为这对我来说听起来像是一个非常标准的用例。

dwe*_*lle 1

不确定是否有一些规范的方法,但您可以对XMLHttpRequestAPI 进行猴子修补并抛出>= 500状态响应。

如果您的应用程序使用 Fetch API、SendBeacon 或其他功能,您可以执行类似的操作。

// put this in support/index.js
Cypress.on('window:before:load', win => {
    const origSend = win.XMLHttpRequest.prototype.send;
    win.XMLHttpRequest.prototype.send = function () {
        // deferring because your app may be using an abstraction (jquery),
        // which may set this handler *after* it sets the `send` handler
        setTimeout(() => {
            const origHandler = this.onreadystatechange;
            this.onreadystatechange = function () {
                if ( this.readyState === 4 && this.status >= 500 ) {
                    throw new Error(`Server responded to "${this.url}" with ${this.status}`);
                }
                if ( origHandler ) {
                    return origHandler.apply(this, arguments);
                }
            };
            return origSend.apply(this, arguments);
        });
    };
});
Run Code Online (Sandbox Code Playgroud)

WTBS,这不会很有用,因为您的应用程序可能想要处理它500,而这会阻止它。

更好的解决方案是确保您的应用程序仅抛出未处理的 500 响应。