I tried to set up a working Jest environment inside a Wordpress plugin. Gutenberg blocks are split between an edit.jsx component and a save.jsx component. My issue stands when I try to create a snapshot test for such blocks.
For example I tried to create a test file like so:
import renderer from 'react-test-renderer';
import edit from '../../blocks/myblock/edit.jsx';
it('comparing with block snapshot', () => {
const tree = renderer
.create(<edit/>)
.toJSON();
expect(tree).toMatchSnapshot();
});
but the snapshot that Jest creates is this one
exports[`comparing with block snapshot 1`] = `<edit />`;
the block has a return statement with much HTML inside.
How do I make jest render all the HTML in edit.jsx?
Why am I getting only that <edit />
tag in the snapshot?