From 12facf2c19a0a3d042dea801b2398c2694ce7685 Mon Sep 17 00:00:00 2001 From: Lauren Tan Date: Wed, 9 Apr 2025 13:39:58 -0400 Subject: [PATCH] [eprh] Temporarily disable ref access in render validation This rule currently has a few false positives, so let's disable it for now (just in the eslint rule, it's still enabled in the compiler) while we iterate on it. --- .../src/Entrypoint/Options.ts | 4 +-- .../src/Entrypoint/Program.ts | 8 ++++-- .../__tests__/ReactCompilerRule-test.ts | 28 ------------------- .../src/rules/ReactCompilerRule.ts | 3 ++ .../__tests__/ReactCompilerRule-test.ts | 28 ------------------- .../src/rules/ReactCompiler.ts | 3 ++ 6 files changed, 14 insertions(+), 60 deletions(-) diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts index e0c670c564..2b6cd3b161 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts @@ -9,9 +9,9 @@ import * as t from '@babel/types'; import {z} from 'zod'; import {CompilerError, CompilerErrorDetailOptions} from '../CompilerError'; import { - EnvironmentConfig, ExternalFunction, parseEnvironmentConfig, + PartialEnvironmentConfig, tryParseExternalFunction, } from '../HIR/Environment'; import {hasOwnProperty} from '../Utils/utils'; @@ -39,7 +39,7 @@ const PanicThresholdOptionsSchema = z.enum([ export type PanicThresholdOptions = z.infer; export type PluginOptions = { - environment: EnvironmentConfig; + environment: PartialEnvironmentConfig; logger: Logger | null; diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts index 622b7f72da..1afda9d821 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts @@ -12,7 +12,11 @@ import { CompilerErrorDetail, ErrorSeverity, } from '../CompilerError'; -import {EnvironmentConfig, ReactFunctionType} from '../HIR/Environment'; +import { + EnvironmentConfig, + ReactFunctionType, + validateEnvironmentConfig, +} from '../HIR/Environment'; import {CodegenFunction} from '../ReactiveScopes'; import {isComponentDeclaration} from '../Utils/ComponentDeclaration'; import {isHookDeclaration} from '../Utils/HookDeclaration'; @@ -291,7 +295,7 @@ export function compileProgram( return null; } - const environment = pass.opts.environment; + const environment = validateEnvironmentConfig(pass.opts.environment); const restrictedImportsErr = validateRestrictedImports(program, environment); if (restrictedImportsErr) { handleError(restrictedImportsErr, pass, null); diff --git a/compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts b/compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts index ea5c30d5b2..8f1612f20e 100644 --- a/compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts +++ b/compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts @@ -92,36 +92,8 @@ const tests: CompilerTestCases = { } `, }, - { - // Don't report the issue if Flow already has - name: '[InvalidInput] Ref access during render', - code: normalizeIndent` - function Component(props) { - const ref = useRef(null); - // $FlowFixMe[react-rule-unsafe-ref] - const value = ref.current; - return value; - } - `, - }, ], invalid: [ - { - name: '[InvalidInput] Ref access during render', - code: normalizeIndent` - function Component(props) { - const ref = useRef(null); - const value = ref.current; - return value; - } - `, - errors: [ - { - message: - 'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)', - }, - ], - }, { name: 'Reportable levels can be configured', options: [{reportableLevels: new Set([ErrorSeverity.Todo])}], diff --git a/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts b/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts index 3f778deee4..d64a5d84c0 100644 --- a/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts +++ b/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts @@ -105,6 +105,9 @@ const COMPILER_OPTIONS: Partial = { panicThreshold: 'none', // Don't emit errors on Flow suppressions--Flow already gave a signal flowSuppressions: false, + environment: { + validateRefAccessDuringRender: false, + }, }; const rule: Rule.RuleModule = { diff --git a/packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts b/packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts index f0d14494b9..30762e5819 100644 --- a/packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts +++ b/packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts @@ -94,36 +94,8 @@ const tests: CompilerTestCases = { } `, }, - { - // Don't report the issue if Flow already has - name: '[InvalidInput] Ref access during render', - code: normalizeIndent` - function Component(props) { - const ref = useRef(null); - // $FlowFixMe[react-rule-unsafe-ref] - const value = ref.current; - return value; - } - `, - }, ], invalid: [ - { - name: '[InvalidInput] Ref access during render', - code: normalizeIndent` - function Component(props) { - const ref = useRef(null); - const value = ref.current; - return value; - } - `, - errors: [ - { - message: - 'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)', - }, - ], - }, { name: 'Reportable levels can be configured', options: [{reportableLevels: new Set([ErrorSeverity.Todo])}], diff --git a/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts b/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts index c2f9d3a103..22de4f44c0 100644 --- a/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts +++ b/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts @@ -107,6 +107,9 @@ const COMPILER_OPTIONS: Partial = { panicThreshold: 'none', // Don't emit errors on Flow suppressions--Flow already gave a signal flowSuppressions: false, + environment: { + validateRefAccessDuringRender: false, + }, }; const rule: Rule.RuleModule = {