我决定使用Vite,Chakra-UI和TypeScript构建一个React应用程序,并在Cypress中进行测试。目标是更多地了解其中的一些技术。巧合的是,这是我第一次使用Cypress。
不幸的是,我在E2 E测试中遇到了关于测试.wait()
的问题。该错误具体如下:CypressError: Timed out retrying after 5000ms:
周期等待()timed out waiting
5000 ms for the 1st request to the route:
getGames . No request ever occurred.
我看到过很多关于先存根后访问页面再等待调用的建议。然而,经过多次尝试,我似乎不能让wait调用不超时。我最近的尝试是在beforeEach-ing访问函数调用之前拦截before调用。从我上传的图片中可以看到,拦截似乎已经注册,但从未增加。
有没有人遇到过这种情况,并有一个潜在的解决方案?提前感谢!
Cypress控制台:
我有一个定义为games.json
的fixture,它包含以下内容:
[
{
"id": 1,
"name": "The Witcher 3: Wild Hunt",
"background_image": "https://media.rawg.io/media/crop/600/400/games/618/618c2031a07bbff6b4f611f10b6bcdbc.jpg",
"parent_platforms": [
{ "id": 1, "name": "PC", "slug": "pc" },
{ "id": 2, "name": "PlayStation", "slug": "playstation" },
{ "id": 3, "name": "Xbox", "slug": "xbox" },
{ "id": 7, "name": "Nintendo", "slug": "nintendo" }
],
"metacritic": "92"
},
{
"id": 2,
"name": "BioShock Infinite",
"background_image": "https://media.rawg.io/media/crop/600/400/games/fc1/fc1307a2774506b5bd65d7e8424664a7.jpg",
"parent_platforms": [
{ "id": 1, "name": "PC", "slug": "pc" },
{ "id": 2, "name": "PlayStation", "slug": "playstation" },
{ "id": 3, "name": "Xbox", "slug": "xbox" },
{ "id": 6, "name": "Linux", "slug": "linux" },
{ "id": 7, "name": "Nintendo", "slug": "nintendo" }
],
"metacritic": "94"
}
]
../support/commands.ts
:
const baseURL = "**http://api.rawg.io/api*";
Cypress.Commands.add("landing", () => {
cy.intercept("GET", `${baseURL}/games`, { fixture: "games.json" }).as(
"getGames"
);
});
我的测试文件:
describe("The Home Page", () => {
before(() => {
cy.landing();
});
beforeEach(() => {
cy.visit("/");
});
it("successfully loads", () => {
cy.wait("@getGames");
});
});
1条答案
按热度按时间kcrjzv8t1#
首先,您应该使用正确的协议-
https://api.rawg.io/api
。其次,
https://api.rawg.io/api
之前没有任何内容,因此使用通配符**
是不正确的。第三,在路径分隔符
/
或//
之前或之后放置通配符。最后,不要将截取放在
before()
中,因为它在测试之间会被清除。