Skip to content

Commit ff697fc

Browse files
authored
[eprh] Temporarily disable ref access in render validation (facebook#32839)
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.
1 parent 096dd73 commit ff697fc

File tree

4 files changed

+20
-62
lines changed

4 files changed

+20
-62
lines changed

compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -92,36 +92,8 @@ const tests: CompilerTestCases = {
9292
}
9393
`,
9494
},
95-
{
96-
// Don't report the issue if Flow already has
97-
name: '[InvalidInput] Ref access during render',
98-
code: normalizeIndent`
99-
function Component(props) {
100-
const ref = useRef(null);
101-
// $FlowFixMe[react-rule-unsafe-ref]
102-
const value = ref.current;
103-
return value;
104-
}
105-
`,
106-
},
10795
],
10896
invalid: [
109-
{
110-
name: '[InvalidInput] Ref access during render',
111-
code: normalizeIndent`
112-
function Component(props) {
113-
const ref = useRef(null);
114-
const value = ref.current;
115-
return value;
116-
}
117-
`,
118-
errors: [
119-
{
120-
message:
121-
'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)',
122-
},
123-
],
124-
},
12597
{
12698
name: 'Reportable levels can be configured',
12799
options: [{reportableLevels: new Set([ErrorSeverity.Todo])}],

compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,9 @@ const COMPILER_OPTIONS: Partial<PluginOptions> = {
105105
panicThreshold: 'none',
106106
// Don't emit errors on Flow suppressions--Flow already gave a signal
107107
flowSuppressions: false,
108+
environment: validateEnvironmentConfig({
109+
validateRefAccessDuringRender: false,
110+
}),
108111
};
109112

110113
const rule: Rule.RuleModule = {
@@ -149,10 +152,14 @@ const rule: Rule.RuleModule = {
149152
}
150153

151154
let shouldReportUnusedOptOutDirective = true;
152-
const options: PluginOptions = {
153-
...parsePluginOptions(userOpts),
155+
const options: PluginOptions = parsePluginOptions({
154156
...COMPILER_OPTIONS,
155-
};
157+
...userOpts,
158+
environment: {
159+
...COMPILER_OPTIONS.environment,
160+
...userOpts.environment,
161+
},
162+
});
156163
const userLogger: Logger | null = options.logger;
157164
options.logger = {
158165
logEvent: (filename, event): void => {

packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -94,36 +94,8 @@ const tests: CompilerTestCases = {
9494
}
9595
`,
9696
},
97-
{
98-
// Don't report the issue if Flow already has
99-
name: '[InvalidInput] Ref access during render',
100-
code: normalizeIndent`
101-
function Component(props) {
102-
const ref = useRef(null);
103-
// $FlowFixMe[react-rule-unsafe-ref]
104-
const value = ref.current;
105-
return value;
106-
}
107-
`,
108-
},
10997
],
11098
invalid: [
111-
{
112-
name: '[InvalidInput] Ref access during render',
113-
code: normalizeIndent`
114-
function Component(props) {
115-
const ref = useRef(null);
116-
const value = ref.current;
117-
return value;
118-
}
119-
`,
120-
errors: [
121-
{
122-
message:
123-
'Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)',
124-
},
125-
],
126-
},
12799
{
128100
name: 'Reportable levels can be configured',
129101
options: [{reportableLevels: new Set([ErrorSeverity.Todo])}],

packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,9 @@ const COMPILER_OPTIONS: Partial<PluginOptions> = {
107107
panicThreshold: 'none',
108108
// Don't emit errors on Flow suppressions--Flow already gave a signal
109109
flowSuppressions: false,
110+
environment: validateEnvironmentConfig({
111+
validateRefAccessDuringRender: false,
112+
}),
110113
};
111114

112115
const rule: Rule.RuleModule = {
@@ -151,10 +154,14 @@ const rule: Rule.RuleModule = {
151154
}
152155

153156
let shouldReportUnusedOptOutDirective = true;
154-
const options: PluginOptions = {
155-
...parsePluginOptions(userOpts),
157+
const options: PluginOptions = parsePluginOptions({
156158
...COMPILER_OPTIONS,
157-
};
159+
...userOpts,
160+
environment: {
161+
...COMPILER_OPTIONS.environment,
162+
...userOpts.environment,
163+
},
164+
});
158165
const userLogger: Logger | null = options.logger;
159166
options.logger = {
160167
logEvent: (eventFilename, event): void => {

0 commit comments

Comments
 (0)