fix(compiler): use globalThis.Symbol to prevent shadowing by user components

[gowthamrdyy]

Summary

Fixes a bug where React Compiler generates code that uses Symbol.for() without qualifying it with globalThis, causing runtime errors when a user-defined component is named Symbol.

The Problem:
When a user defines a component named Symbol, it shadows the global built-in Symbol. The compiler-generated code (e.g., for memo cache sentinels) tries to call Symbol.for() but instead accesses the user's component, resulting in "Symbol.for is not a function".

Playground repro: Link

The Fix:
Updated CodegenReactiveFunction.ts to use globalThis.Symbol.for() instead of bare Symbol.for() references. This ensures the built-in global is always used, regardless of local variable names.

How did you test this change?

1. Added a new test fixture (component-named-symbol-shadows-global.js) that defines a component named Symbol.
   • Verified that this test case previously failed (or would produce broken code) and now compiles to correct code using globalThis.Symbol.
2. Verified generated output: checked that the compiled output for cache sentinels and early return sentinels now explicitly uses globalThis.Symbol.
3. Manual verification: Confirmed the fix addresses the issue reported in the playground.

[Copilot]

Pull request overview

This PR fixes a critical bug in the React Compiler where generated code uses Symbol.for() without qualifying it with globalThis, which causes runtime errors when a user-defined component is named Symbol, shadowing the global built-in.

Key Changes:

• Updated CodegenReactiveFunction.ts to use globalThis.Symbol.for() instead of bare Symbol.for() in two locations (memo cache sentinels and early return sentinels)
• Added a test fixture component-named-symbol-shadows-global.js to prevent regression

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/component-named-symbol-shadows-global.js	Adds a regression test with a component named Symbol that shadows the global, ensuring the compiler generates code that explicitly uses globalThis.Symbol.for()
compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts	Fixes two locations where Symbol.for() is generated by qualifying it with globalThis.Symbol.for() to prevent shadowing issues

The fix is well-targeted and addresses the specific issue described in the PR. The test fixture follows the existing pattern used in the codebase, and the changes to CodegenReactiveFunction.ts are minimal and consistent with how globalThis is already used elsewhere in the codebase (e.g., in Globals.ts).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[github-actions]

This pull request has been automatically marked as stale. If this pull request is still relevant, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize reviewing it yet. Your contribution is very much appreciated.

[github-actions]

Closing this pull request after a prolonged period of inactivity. If this issue is still present in the latest release, please ask for this pull request to be reopened. Thank you!