Тест реакции для вложенных асинхронных вызовов в эффекте использования

Я новичок в тестировании реагирования и пытаюсь имитировать реагирующие хуки, но я где-то терплю неудачу. Я не могу понять где.

У меня есть простой компонент 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();
    });

});


0 ответов

Другие вопросы по тегам