Snapshots should not contain internal React instances

[gaearon]

Sorry if this is the wrong place to file it.
I changed something internal in React and saw snapshot change on www:

These are React internal instances. Oops! How did this happen?

An object passed as a prop contained a reference to React element. That element contained _owner field pointing to an internal React instance. That React instance contains references to all its children recursively.

We should find a way to exclude any React internal instances.
A reasonable heuristic these days may be to exclude any object that has _currentElement property.

[cpojer]

I'm assuming you didn't call toJSON()? There isn't anything we can do to guard against this – snapshots can be any serializable data structure.

[gaearon]

I'm assuming you didn't call toJSON()?

I don’t know, how can I check? I just updated React in www and existing snapshot tests failed because they encoded React internal objects.

[gaearon]

I’m not sure why _owner is enumerable on React elements but for now you could check $$typeof and if it’s Symbol(react.element), exclude _owner from the pretty print.

[cpojer]

How do you think we should print these? Just like any other React component using tag, props and children or should it be <InternalReactElement />?

[gaearon]

To be clear, element itself is fine. It's just that _owner links to an internal object which is necessary for React warnings to show the owner component name. So if you print elements nicely (with JSX syntax) the problem should be avoided altogether. Actually I'm surprised the pretty printer didn't recognise it's dealing with an element.

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.