Invalid variable access _jsxFileName

[renatoagds]

🐛 Bug Report

After upgrading to new JSX transform, started to receive an error in my mocks that's returning a React Component/Element, saying about the _jsxFileName variable being outside of scope and could not be accessed.

To Reproduce

Just mock a React Component/Element and start using the new JSX Transform

jest.mock('./MyComponent', () => () => <div id="my-component" />)

[SimenB]

PR welcome 👍 Error is in babel-plugin-jest-hoist somewhere.

[SimenB]

That said, I'm not 100% certain what the solution is. We could add it to the whitelist, but that feels like it's addressing the symptom rather than the cause. @nicolo-ribaudo what do you think?

[renatoagds]

@SimenB For sure ... Will work on this one 👍

[renatoagds]

We could add it to the whitelist, but that feels like it's addressing the symptom rather than the cause.

I was thinking doing that (adding into the whitelist), do you have other solution?

[SimenB]

Currently the whitelist is globals and known symbols that jest controls, just adding stuff that "random" babel plugins inject seems like a slippery slope. I'm hoping we can solve it more generically via some babel magic. Might not be possible though! @rickhanlonii on the react team is gonna take a look, so let's wait and see what he says 🙂

If it proves difficult we should just add it to the whitelist to unblock, tho 👍

[FezVrasta]

Would (yet) another configuration option make sense? Today is React who needs this variable, tomorrow may be framework x that needs another one.

[SimenB]

Right, which is why I wanna solve it more generically than adding to the whitelist, and hopefully without the user having to specify any config