Cześć, chcę przetestować swój komponent React. Korzysta on z funkcji fetcher() do pobierania danych z REST API. Funkcja ta znajduje się w innym pliku, więc testując ten komponent chciałem po prostu zmockować ten plik w taki sposób, aby dla każdego testu zwrócił inną wartość.
Najlepiej, aby były zwracane promise, ponieważ dla jednego z testów chciałbym zwrócić Promise.reject().
Póki co napisałem taki test:
jest.mock('../../utils/fetcher', () => ({
fetcher: jest
.fn()
.mockReturnValueOnce('first call')
.mockReturnValueOnce('second call')
.mockReturnValue('default'),
readData: jest.fn(),
}));
test('Basic render. fetch pending - the loading', async () => {
const component = render(<Courses />);
await waitForElementToBeRemoved(() => component.getByTitle('loader'));
});
test('Basic render, fetch success', async () => {
const component = render(<Courses />);
await waitFor(() => component.findByText('CollapsibleTable'));
expect(component.baseElement).toMatchSnapshot();
});
test('Basic render, fetch error', async () => {
const component = render(<Courses />);
//await waitFor(() => component.findByText('Something went wrong.'));
expect(component.baseElement).toMatchSnapshot();
});
I już na tym etapie pojawia się problem, ponieważ nie potrafię dojść dlaczego dla każdego z testów fetcher() mimo wszystko zwraca 'first call.
Komponent:
const Courses: React.FC = () => {
const { data, error } = useSWR(
'https://some-api.pl',
fetcher
);
console.log(data, error);
if (error) {
return (
<CoursesContainer>
<Error>Something went wrong.</Error>
</CoursesContainer>
);
}
if (!data) return <Loader title="loader" />;
return (
<CoursesContainer>
<CollapsibleTable courses={data} />
</CoursesContainer>
);
};
export default Courses;
fetcher:
const fetcher = (url: string) => {
return fetch(url)
.then((response) => response.json())
.then((data: Array<IFetchData>) => readData(data));
};
Funkcja readData() bierze tablicę data i trochę ją przerabia, zwracając inną tablicę tylko z tymi danymi, których potrzbuje. Nie ma tam żadnych asynchronicznych działań.
biblioteka do wykonywania zapytań - swr