Fix createNodeMock doc to avoid Invariant Violation

[BDav24]

Hi, when I try to mock refs for snapshot testing (described here: https://facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html), I get the error:

Invariant Violation: Element appears to be neither ReactComponent nor DOMNode

I made use of this line of code to make it work: https://github.com/facebook/react/blob/master/src/renderers/dom/shared/findDOMNode.js#L46

I'm using react@15.4.2, react-test-renderer@15.4.2, and jest@18.1.0

[facebook-github-bot]

Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla - and if you have received this in error or have any questions, please drop us a line at cla@fb.com. Thanks!

If you are contributing on behalf of someone else (eg your employer): the individual CLA is not sufficient - use https://developers.facebook.com/opensource/cla?type=company instead. Contact cla@fb.com if you have any questions.

[facebook-github-bot]

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks!

[gaearon]

Good catch, thanks.

[gaearon]

Hmm.. Now that I think of it, the problem is that you're calling findDOMNode() on a DOM node in the first place. This is just unnecessary. Remove the findDOMNode() call, and use the DOM node (in this case, a mock) directly.

Test renderer doesn't support findDOMNode() for custom components anyway, so there's no reason for trying to fix this case. You need to fix the callsite instead.

[gaearon]

I reverted the change since I think it wasn't necessary. I hope this helps!

[BDav24]

@gaearon Thanks for your answer!

You mean declaring ref={node => this.element = node}?

The problem is that I use a lib: https://github.com/balloob/react-sidebar/blob/master/src/sidebar.js#L183
which declares react as peer dependency. This one uses "react >= 0.14.0", so I can make a PR to remove findDOMNode, but what if I use another one with "react < 0.13" dependency?

[gaearon]

Whether you use a string or a callback ref there is irrelevant (although callback refs are better).

My point is that you can safely replace ReactDOM.findDOMNode(this.refs.sidebar).offsetWidth; with this.refs.sidebar.offsetWidth; because React 0.14 (and later versions) don’t have wrapper objects around DOM refs.

but what if I use another one with "react < 0.13" dependency?

Same as usual when React changes. Either ask them to release a new version, or fork. React 0.13 was released about two years ago, I think it’s reasonable that some things change in two years.

[BDav24]

@gaearon Yes you're right, better not make the doc confusing for old versions.