我正在用 Jest 撰寫測驗，并想測驗一個簡單的按鈕，該按鈕用作注銷并將您重定向到“/login”onClick。
import {loginService} from "../../utils/loginService";
import React from "react";
import {useNavigate} from "react-router-dom";
const Logout = () => {
const navigate = useNavigate()
const logout = e => {
loginService.logout();
navigate("/login");
}
return (
<button className={'logout'} onClick={logout}>Logout</button>
)
}
export default Logout
我能夠撰寫第一個測驗來呈現按鈕并檢查它是否存在。第二個測驗應該檢查，單擊瀏覽器會將您重定向到“/login”。
import Logout from "../../components/navbar/Logout";
import {BrowserRouter} from "react-router-dom";
import {fireEvent, render} from "@testing-library/react";
import {screen} from '@testing-library/react';
describe('Test Logout Button', () => {
it('it is rendered', () => {
render(
<BrowserRouter>
<Logout/>
</BrowserRouter>
)
expect(screen.getByText(/logout/i)).toBeInTheDocument()
})
it('it redirects after click', () => {
const mockedUsedNavigate = jest.fn();
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useNavigate: () => mockedUsedNavigate,
}));
render(
<BrowserRouter>
<Logout/>
</BrowserRouter>
)
const logout = screen.getByText(/logout/i);
fireEvent.click(logout);
// TODO something something check useNavigate
// https://blog.logrocket.com/testing-react-router-usenavigate-hook-react-testing-library/
expect(mockedUsedNavigate).toBeCalledTimes(1);
})
})
然而這失敗了：
expect(jest.fn()).toBeCalledTimes(expected)
Expected number of calls: 1
Received number of calls: 0
我會假設我必須以某種方式將模擬傳遞給我的組件。我該怎么做，或者我什至必須這樣做？我如何檢查 useNavigate 是否已重定向到“/ login”，就我而言<BrowserRouter />，它沒有歷史屬性
uj5u.com熱心網友回復：
jest.mock應該在您的單元測驗之外完成，因為它需要在您要測驗的代碼評估它之前模擬一個依賴項。在您的示例中，react-router-dom庫首先由Logout組件評估，然后您的代碼嘗試模擬它，但為時已晚。因此，您應該將以下代碼移出describe：
const mockedUsedNavigate = jest.fn();
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useNavigate: () => mockedUsedNavigate,
}));
當然，您的所有測驗都將使用相同的實體，mockedUsedNavigate該實體可能容易出錯，因此您應該在每個單元測驗之前通過將其添加到 beforeEach 中來重置它，如下所示：
beforeEach(() => {
mockedUsedNavigate.mockReset();
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/475028.html