react-lazyload breaks jest snapshots? - reactjs

Question

I've been working on optimising my react project and today I implemented lazy loading of all my images using react-lazyload (https://github.com/jasonslyvia/react-lazyload).
The package works just fine but as soon as I tried to update my snapshot tests they all failed!
The error I'm getting is:
Uncaught [TypeError: Cannot read property 'position' of undefined]
I tried seeing what I could find on google but nothing came up.
Here is an example of one of my snapshot tests (they're about as basic as can be):
import React from 'react';
import renderer from 'react-test-renderer';
import App from './App';
describe('App', () => {
describe('Component Snapshot', () => {
it('should render correctly', () => {
const componentSnapshot = renderer.create(<App />).toJSON();
expect(componentSnapshot).toMatchSnapshot();
});
});
});
Do I need to mock the lazy load package? If so does anyone have any advice of how I would go about doing that?
Any help is greatly appreciated.

Answer 1

Incase anyone runs into this issue, I solved it by using 'enzyme-to-json' instead of 'react-test-renderer' in conjunction with enzymes own 'render' function.
Here is the updated test so you can see what I mean.
import React from 'react';
import { render } from 'enzyme';
import toJson from 'enzyme-to-json';
import App from './App';
describe('App', () => {
describe('Component Snapshot', () => {
it('should render correctly', () => {
const componentRender = render(<App />);
expect(toJson(componentRender)).toMatchSnapshot();
});
});
});
I don't know the exact reasons why react-test-renderer was bugging out, my gut is telling me that because there isn't a window within node for my lazy-load placeholders to populate there isn't a 'position' to define. I would guess that enzyme has some clever stuff going on behind the scenes to get around that?
If anyone has a more definitive explanation I'd love to hear it, but for now at least the problem is fixed :)