赛普拉斯阻止 API 调用完成

Question

我有一个奇怪的问题。我有一个正在发送 API 的页面（我同时使用 async/await 和 $.ajax().then 进行测试）。

就其本身而言，它工作得非常好，在await 和then 触发之后的代码。但是，它在通过 Cypress 运行时不起作用。尽管网络选项卡显示 API 已成功，但没有代码继续运行，这意味着 console.log 永远不会被调用。

最初，我正在拦截 API，所以我认为这是问题所在，但现在，删除 .intercept 也无济于事。我应该从哪里开始寻找？

一些相关代码：

//testing
describe('The feature', () => {
before(() => {
    cy.loginAsAdmin();
    // 01-Aug-2021
    cy.clock(1627740000000);
    cy.visit('/dataChecking');
});

beforeEach(() => {
    Cypress.Cookies.preserveOnce('PHPSESSID');
    cy.reload();
});

after(() => {
    cy.clearCookies();
});

describe.only('when no data is return', () => {
    it('will show no error box', () => {
        cy.intercept(
            'POST',
            '/dataChecking/forStore',
            // {
            //  body: {
            //      data: [],
            //  },
            //  delay: 5000,
            // },
        ).as('api');

        cy.get('#store-id').type('1');
        cy.get('#submitBtn').click();

        cy.wait('@api').then(() => {
            cy.get('#no-error-message').should('be.visible');
        });
    });
});

});

// Page code
$.ajax({
        url: '/dataChecking/forStore',
        method: 'POST',
        data: {
            storeId,
            from: from.toString(),
            to: to.toString(),
        },
    }).then((msg) => {
        console.log(msg);
    });

    const { data } = await $.ajax({
            url: '/dataChecking/forStore',
            method: 'POST',
            data: {
                storeId,
                from: from.toString(),
                to: to.toString(),
            },
        });
    console.log('hello');

网络标签中的 API

Answer 1

拦截需要url匹配

it('will show no error box', () => {

  cy.intercept('POST', '/dataChecking/forStore').as('api')

  cy.get('#store-id').type('1');
  cy.get('#submitBtn').click();

  cy.wait('@api').then(() => {
    cy.get('#no-error-message').should('be.visible');
  });
});

或者你可能需要

cy.intercept('POST', '**/dataChecking/forStore').as('api')