我正在尝试测试我的重定向路由器酶,但我不确定如何做到。
下面是我到目前为止编写的测试,但是我不确定为什么它不能正常工作。谁能给我示范并写作,我应该如何测试?非常感谢
import React, { Fragment } from 'react';
import {
BrowserRouter as Router,
Route,
Switch,
Redirect,
} from 'react-router-dom';
// Import Containers
import SettingsPage from 'containers/SettingsPage/Loadable';
import PaymentPage from 'containers/PaymentPage/Loadable';
import RegisterPage from 'containers/RegisterPage/Loadable';
import LoginPage from 'containers/LoginPage/Loadable';
import HomePage from 'containers/HomePage/Loadable';
import DashboardPage from 'containers/DashboardPage/Loadable';
import NotFoundPage from 'containers/NotFoundPage/Loadable';
// Import Components
import Header from '../../components/App/Header';
// Import Styles
import GlobalStyle from '../../global-styles';
export default function App() {
return (
<Fragment>
<Router>
<Switch>
<Route exact path="/" component={HomePage} />
<Route path="/login" component={LoginPage} />
<Route path="/register" component={RegisterPage} />
<Route path="/404" component={NotFoundPage} />
<Header>
<Switch>
<Route path="/dashboard" component={DashboardPage} />
<Route path="/payment" component={PaymentPage} />
<Route path="/settings" component={SettingsPage} />
<Route render={() => <Redirect to="/404" />} /> // test this line
</Switch>
</Header>
</Switch>
</Router>
<GlobalStyle />
</Fragment>
);
}
我的测试:
test('invalid path should redirect to 404', () => {
const wrapper = mount(
<Route initialEntries={['/foo']}>
<App />
</Route>,
);
expect(wrapper.find(LoginPage)).toHaveLength(0);
expect(wrapper.find(NotFoundPage)).toHaveLength(1);
});
test('valid path should not redirect to 404', () => {
const wrapper = mount(
<Route initialEntries={['/login']}>
<App />
</Route>,
);
expect(wrapper.find(LoginPage)).toHaveLength(1);
expect(wrapper.find(NotFoundPage)).toHaveLength(0);
});
xxxxxxxxxxxxxxxx