我正在尝试配置react app的CI e2e自动化。
在我的应用程序中,我具有 ProtectedRoute 组件,该组件将非登录用户重定向到“登录”页面:
import React from "react";
import { Route, Redirect } from "react-router-dom";
export const ProtectedRoute = ({ component: Component, ...rest }) => (
<Route
{...rest}
render={props =>
localStorage.getItem("user") ? (// here it checks if localstorage has "user" key
<Component {...props} />
) : (
<Redirect
to={{ pathname: "/login", state: { from: props.location } }}
/>
)
}
/>
);
在我的测试中,我试图访问一些“受保护的”路由并在页面上进行一些检查。
正如赛普拉斯文档中所建议-我不是使用UI登录,而是使用我创建的一些命令以编程方式登录:
beforeEach(() => {
cy.login(); // the command call
})
describe('dashboard', () => {
it('should show dashboard page', () => {
cy.url().should('include', 'dashboard');
})
})
这是命令,它只是在localStorage中创建“用户”键:
Cypress.Commands.add('login', () => {
const user = {"UserName": "Francisco","UserLastName": "DeAssisy"}
localStorage.setItem('user', JSON.stringify(user))
}
在我的本地环境中,我可以看到测试通过。
但是,在travis-CI运行时,我看到测试连续失败,原因是url为“登录”
这是我的travis配置文件:
language: node_js
node_js:
- 10.13
addons:
apt:
packages:
# Ubuntu 16+ does not install this dependency by default, so we need to install it ourselves
- libgconf-2-4
cache:
# cache both npm modules and Cypress binary
directories:
- ~/.npm
- ~/.cache
script:
- npm run format:check
- npm run lint
- npm test
- node fake-server/server &
- npm run test:all
有趣的事实:当我在“仪表板”之前运行“登录”页面测试时,测试通过了(因为已经设置了localStorage'user'键)
请帮助
谢谢