Test error using inview IntersectionObserver is not defined

[sam987best]

Hi,

Im new here and my first time using this package. So my component uses the plain children of implementation and similar to the example in the documentation
import { InView } from 'react-intersection-observer'; const Component = () => ( <InView as="div" onChange={(inView, entry) => console.log('Inview:', inView)}> <h2>Plain children are always rendered. Use onChange to monitor state.</h2> </InView> ); export default Component;

Now im my test we use jest and we have something like this going on
const contentSectionComponent = mount( <MemoryRouter> <ThemeProvider theme={theme}> <MySection {...props} /> </ThemeProvider> </MemoryRouter> );

The inView element is inside the MySection component. Now in my test when i do this
it('should match its snapshot', () => { expect(mySectionComponent.html()).toMatchSnapshot(); });

I get this error
ReferenceError: IntersectionObserver is not defined

Now i already imported there packages into my test file,
import { mockAllIsIntersecting } from 'react-intersection-observer/test-utils';
import { InView } from 'react-intersection-observer';

Im unsure how to proceed from here. Can anyone help when what needs to be done?

TIA

[thebuilder]

It could be because you are use the component in another file that's not using the test-utils?

Consider importing it globally: https://github.com/thebuilder/react-intersection-observer#global-intersection-observer-behavior