Summary

react-refresh uses an unsafe heuristic to recognize React components.

If the input is a Proxy instance that throws in its handler, react-refresh will crash. In my case, I've been using react-refresh through react-refresh-webpack-plugin.

Steps to reproduce

Export this, and set up react-refresh-webpack-plugin:

export default new Proxy({}, {
  get(target, property) {
    throw new Error();
  }
});

Why this happens

Currently, react-refresh attempts to access type.$$typeof directly (in isLikelyComponentType):

https://github.com/facebook/react/blob/d95c4938df670a8f0a13267bd89173737bb185e4/packages/react-refresh/src/ReactFreshRuntime.js#L677-L687

Accessing $$typeof like that is dangerous and should be wrapped in a try-catch block.

I would like to fix this in a PR, but in doing so, I found yet another instance where the same unsafe heuristic is used (in register):

https://github.com/facebook/react/blob/d95c4938df670a8f0a13267bd89173737bb185e4/packages/react-refresh/src/ReactFreshRuntime.js#L323-L333

I'm unsure if the occurrence in the register function should have the same safety check, or if checking in isLikelyComponentType suffices.

@gaearon: Would you happen to know?