Question

我正在探索是否可以使用cypress进行端到端测试？我是它的初学者。

Cypress有一些XHR的server（）实例。

问题： 假设我正在测试登录页面，以便可以编写用于查询元素的测试用例并进行验证。在此过程中，浏览器将进行一些API调用，是否可以编写测试用例来验证API所捕获的statusCode是什么？什么是XHR API响应等？

Answer 1

当然。使用赛普拉斯，您可以监视请求或模拟请求。我编写了一个简单的示例来向您展示这两种方法：

describe("test", () => {
    it("spy", () => {
        cy.server();
        cy.route("POST", /.*queries.*/).as("request")

        cy.visit("https://docs.cypress.io/")
            .get("#search-input").type("1234567890")
            .wait("@request").then(xhr => {
                expect(xhr.status).to.eq(200)
            })
    })

    it("mock", () => {
        cy.server();

        const obj = JSON.parse(`
        {
            "results": [{
                    "hits": [{
                            "hierarchy": {
                                "lvl2": null,
                                "lvl3": null,
                                "lvl0": "Podcasts",
                                "lvl1": null,
                                "lvl6": null,
                                "lvl4": null,
                                "lvl5": null
                            },
                            "url": "https://stackoverflow.com",
                            "content": "mocked",
                            "anchor": "sidebar",
                            "objectID": "238538711",
                            "_snippetResult": {
                                "content": {
                                    "value": "mocked",
                                    "matchLevel": "full"
                                }
                            },
                            "_highlightResult": {
                                "hierarchy": {
                                    "lvl0": {
                                        "value": "Podcasts",
                                        "matchLevel": "none",
                                        "matchedWords": []
                                    }
                                },
                                "content": {
                                    "value": "mocked",
                                    "matchLevel": "full",
                                    "fullyHighlighted": false,
                                    "matchedWords": ["testt"]
                                }
                            }
                        }
                    ]
                }
            ]
        }

        `);

        cy.route("POST", /.*queries.*/, obj)

        cy.visit("https://docs.cypress.io/")
            .get("#search-input").type("1234567890")
            .get("#algolia-autocomplete-listbox-0").should("contain", "mocked")
    })
})

spy示例接收到原始XHR对象，因此您可以检查状态码等。 mock示例向您展示了如何模拟任何ajax请求。

请注意：当前您无法监视和模拟获取请求。但据我所知，他们正在重写网络层以使之成为可能。让我知道您是否需要进一步的帮助

测试案例中的赛普拉斯XHR API调用验证

1 个答案: