reactjs - 使用 React 测试库提交后测试重定向
问题描述
我正在尝试测试登录组件。特别是它在成功登录时重定向。手动测试时效果很好。但在我的测试中,它从不进行重定向,因此找不到“注销”链接:
test('successfully logs the in the user', async () => {
const fakeUserResponse = {success: true, token: 'fake_user_token'}
jest.spyOn(window, 'fetch').mockImplementationOnce(() => {
return Promise.resolve({
json: () => Promise.resolve(fakeUserResponse),
})
})
const { getByText, getByLabelText, findByTestId } = render(<Router><Login /></Router>)
fireEvent.change(getByLabelText(/email/i), {target: {value: 'dan@example.com'}})
fireEvent.change(getByLabelText(/password/i), {target: {value: 'password1234'}})
fireEvent.click(getByText(/submit/i))
await waitForElement(() => getByText(/logout/i));
})
我正在使用react-router
版本 4 进行重定向,如下所示:
{state.resolved ? <Redirect to="/" /> : null}
我会以错误的方式解决这个问题吗?
解决方案
您可以模拟Redirect
组件的实现以显示一些包含路径的文本,而不是重定向到它:
jest.mock('react-router-dom', () => {
return {
Redirect: jest.fn(({ to }) => `Redirected to ${to}`),
};
});
并期望您的组件以正确的路径显示文本:
expect(screen.getByText('Redirected to /')).toBeInTheDocument();
推荐阅读
- c++ - 字符串中元音的数量 C++
- visual-studio-code - 如何在 Visual Studio Code 中关闭信息弹出窗口
- javascript - 如何在现有的 Javascript 对象中添加具有值的动态键?
- python - 在 Odoo 9 的编辑模式下,复选框上使用 Onchange 装饰器的方法无法正常工作
- python - 在评估多个列表的 for 循环中返回布尔值
- javascript - 如何使用移动 gps 让 Dark Sky API 工作
- javascript - 如何在 React-navigation/react-native 中隐藏后退按钮
- r - data.table shift 返回错误的值
- python - 带有计数聚合的 Pandas groupby
- c++ - 尝试构造 std::thread 时出现奇怪的编译器错误: