Meu teste está assim:
const navigationMock = jest.fn();
jest.mock('react-router-dom', () => {
return {
useNavigate: () => navigationMock,
}
});
describe('Footer behavior when there are participants', () => {
beforeEach(() => {
(useParticipantsList as jest.Mock).mockReturnValue(['Anna', 'Markus', 'John']);
});
test('Raffle can be started', () => {
render(
<RecoilRoot>
<Footer />
</RecoilRoot>
);
const button = screen.getByRole('button');
expect(button).not.toBeDisabled();
});
test('Navigate to raffle page', () => {
render(
<RecoilRoot>
<Footer />
</RecoilRoot>
);
const button = screen.getByRole('button');
fireEvent.click(button);
expect(navigationMock).toHaveBeenCalledTimes(1);
});
});
Footer.tsx
export default function Footer() {
const participants = useParticipantsList();
const navigate = useNavigate();
const startRaffle = () => {
navigate('/sorteio');
}
return (
<footer>
<button disabled={participants.length < 3} onClick={startRaffle}>Iniciar brincadeira</button>
</footer>
);
}
E estou recebendo o seguinte erro:
The module factory of `jest.mock()` is not allowed to reference any out-of-scope variables.
Invalid variable access: navigationMock
9 | jest.mock('react-router-dom', () => {
10 | return {
> 11 | useNavigate: () => navigationMock,
| ^^^^^^^^^^^^^^
12 | }
13 | });
14 |