Jest/Enzyme w/ React - "Target container is not a DOM element."

Question

I'm trying to test that a button in a certain react component triggers a function in its parent component. I stumble upon my issue right when I import the component in my test file, so the test hasn't even run yet.

The component I import is a regular react component and is exported as:

export default connect(mapStateToProps, mapDispatchToProps)(Manager);

And in my test file I import it as:

import Manager from '../index.js';

When I run the test I get:

Target container is not a DOM element.

I know this is very little information to give but there is literally nothing else relevant as far as I can see. The component I'm testing does a bunch of things and has a render function. After a lot of reading I read that some people had a similar issue because they exported something in the same file that does ReactDOM.render. Unfortunately, this does not apply to my problem.

Any ideas?

Are you sure your index.js doesn't try to call `ReactDOM.render`? — Icepickle, Aug 06 '18 at 07:44
Does this answer help you with your problem: https://stackoverflow.com/a/42611909/1695393 ? — dubes, Aug 06 '18 at 08:42
Possible duplicate of [Testing React: Target Container is not a DOM element](https://stackoverflow.com/questions/39986178/testing-react-target-container-is-not-a-dom-element) — dubes, Aug 06 '18 at 08:43

score 2 · Answer 1 · answered Aug 06 '18 at 07:47

2

Might have a render call somewhere in your index.js file.

answered Aug 06 '18 at 07:47

Nithin Thampi

3,579
1
13
13

This is a comment, not an answer, please refrain from these answers, till you have the possibility (ie enough reputation) to comment on posts... – Icepickle Aug 06 '18 at 07:54

score 0 · Accepted Answer · answered Aug 06 '18 at 08:39

You can set an additional export without connect in your Manager and then you'll be able to import it in your test file and test its behavior:

export default connect(mapStateToProps, mapDispatchToProps)(Manager);
export { Manager };

Then in your test file:

import { Manager } from 'your-path'; // now a named import without Connect

Jest/Enzyme w/ React - "Target container is not a DOM element."

2 Answers2