Тест реакции для вложенных асинхронных вызовов в эффекте использования
Я новичок в тестировании реагирования и пытаюсь имитировать реагирующие хуки, но я где-то терплю неудачу. Я не могу понять где.
У меня есть простой компонент React, который использует React UseEffect. Я не могу проверить это с помощью насмешек async. Где мне не хватает подхода?
// my Componenet.tsx
const DImage = ({
fetchImage,
style,
isDiv,
defaultImage,
...props
}: CompProps) => {
const [image, setImage] = useState<any>(defaultImage);
useEffect(() => {
fetchImage()
.then((response: any) => response.blob())
.then((data: any) => {
try {
const objectURL = URL.createObjectURL(data);
setImage(objectURL);
} catch (ex) {}
});
}, []);
if (isDiv) {
return (
<div
style={{ ...style, backgroundImage: `url('${image}')` }}
{...props}
/>
);
}
return <img src={image} style={style} {...props} />;
};
export default DImage;
// test.tsx
import React from 'react';
import DImage from './DynamicImage';
import { mount, ReactWrapper } from 'enzyme';
let dImage: ReactWrapper<any>;
describe('Button', () => {
beforeAll(() => {
fetchImage = jest.fn(async () => jest.fn(() => 'someValue'))
dImage = mount(
<DImage fetchImage={fetchImage} />
);
});
it('should be defined', () => {
expect(dImage).toBeDefined();
});
});