test-bar-stacked-nivo.js

import React from 'react';

import { render, waitFor, screen, act } from '@testing-library/react';
import userEvent from '@testing-library/user-event';

import StackedBar from '~/pages/NewReports/Cards/StackedBar';

import { dashData } from './dashData';

let listener = null;
window.ResizeObserver = class ResizeObserver {
  constructor(ls) {
    listener = ls;
  }

  observe() {
    return this;
  }

  disconnect() {
    return this;
  }
};

describe('Pages', () => {
  describe('StackedBar', () => {
    const initialValues = dashData;
    const mountComponent = props => {
      render(<StackedBar {...props} />);
      act(() => {
        listener([
          {
            contentRect: {
              width: 800,
              height: 400,
            },
          },
        ]);
      });
    };

    it('should render the component StackBar, be able to do the hover in the graph and show up the tooltip', async () => {
      const props = { ...initialValues };
      mountComponent(props);

      await waitFor(() => {
        expect(
          screen.getByTestId('label-stacked-bar-sold')
        ).toBeInTheDocument();
      });

      userEvent.hover(screen.getAllByTestId(/stacked-bar-rect/)[0]);

      await waitFor(() => {
        expect(screen.getByTestId('tooltip-stacked-bar')).toBeInTheDocument();
      });
    });
  });
});

oh nice find, i'll check!

oh nice find, i'll check!
🚀

@ErikGMatos this worked on macOS?