map.test.js

import React from 'react';
import { mount } from 'enzyme';
import { MapContainer } from 'react-leaflet';
import { Map } from './Map';
import * as mapService from '../../../../services/map.service';

const streamingAPISpy = jest.spyOn(mapService, 'streamingAPI');

describe('<Map />', () => {
  let component;
  let useEffect;

  const mockUseEffect = () => {
    useEffect.mockImplementationOnce((f) => f());
  };

  beforeEach(() => {
    useEffect = jest.spyOn(React, 'useEffect');
    // useEffect = jest.spyOn(React, "useEffect").mockImplementation(f => f());{
    jest.restoreAllMocks();
    jest.resetAllMocks();

    mockUseEffect();

    component = mount(
      <MapContainer>
        <Map />
      </MapContainer>,
    );
  });

  afterEach(() => {
    streamingAPISpy.mockClear();
  });

  test('It should mount', () => {
    expect(component.length).toBe(1);
  });

  test('should render from stream', async () => {
    streamingAPISpy.mockImplementationOnce(() =>
      Promise.resolve({
        e: { data: '/fleettrack/realtime/' },
      }),
    );
    await streamingAPISpy('/api');
    component.update();
    expect(component.length).toBe(1);

    expect(streamingAPISpy).toHaveBeenCalledWith('/api');
  });

  test('should listen', () => {
    const onmessage = jest.fn().mockReturnValue({
      e: { data: '/fleettrack/realtime/' },
    });

    const useRefSpy = jest.spyOn(React, 'useRef').mockReturnValue({
      current: {
        sse: {
          onmessage,
        },
      },
    });
    expect(useRefSpy).toBeCalledTimes('1');
  });
});