Skip to content

Commit

Permalink
[compiler] Surface unused opt out directives in eslint
Browse files Browse the repository at this point in the history
This PR updates the eslint plugin to report unused opt out directives.
One of the downsides of the opt out directive is that it opts the
component/hook out of compilation forever, even if the underlying issue
was fixed in product code or fixed in the compiler.

ghstack-source-id: e288fff57efb31c4e16ad5d74a0cc1d72bbf78db
Pull Request resolved: #30721
  • Loading branch information
poteto committed Aug 16, 2024
1 parent fd4bb7c commit d931832
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,17 @@ const tests: CompilerTestCases = {
}
`,
},
{
name: "'use no forget' directive is respected when errors are present",
code: normalizeIndent`
let count = 0;
function Component() {
'use no forget';
count++;
return <div>Hello world {count}</div>
}
`,
},
],
invalid: [
{
Expand Down Expand Up @@ -199,6 +210,27 @@ const tests: CompilerTestCases = {
},
],
},
{
name: "Unused 'use no forget' directive is reported when no errors are present",
code: normalizeIndent`
function Component() {
'use no forget';
return <div>Hello world</div>
}
`,
errors: [
{
message: "Unused 'use no forget' directive",
suggestions: [
{
output:
// yuck
'\nfunction Component() {\n \n return <div>Hello world</div>\n}\n',
},
],
},
],
},
],
};

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,12 @@ import BabelPluginReactCompiler, {
ErrorSeverity,
parsePluginOptions,
validateEnvironmentConfig,
OPT_OUT_DIRECTIVES,
type PluginOptions,
} from 'babel-plugin-react-compiler/src';
import {Logger} from 'babel-plugin-react-compiler/src/Entrypoint';
import type {Rule} from 'eslint';
import {Statement} from 'estree';
import * as HermesParser from 'hermes-parser';

type CompilerErrorDetailWithLoc = Omit<CompilerErrorDetailOptions, 'loc'> & {
Expand Down Expand Up @@ -146,6 +148,7 @@ const rule: Rule.RuleModule = {
userOpts['__unstable_donotuse_reportAllBailouts'];
}

let shouldReportUnusedOptOutDirective = true;
const options: PluginOptions = {
...parsePluginOptions(userOpts),
...COMPILER_OPTIONS,
Expand All @@ -155,6 +158,7 @@ const rule: Rule.RuleModule = {
logEvent: (filename, event): void => {
userLogger?.logEvent(filename, event);
if (event.kind === 'CompileError') {
shouldReportUnusedOptOutDirective = false;
const detail = event.detail;
const suggest = makeSuggestions(detail);
if (__unstable_donotuse_reportAllBailouts && event.fnLoc != null) {
Expand Down Expand Up @@ -269,7 +273,52 @@ const rule: Rule.RuleModule = {
/* errors handled by injected logger */
}
}
return {};

function reportUnusedOptOutDirective(stmt: Statement) {
if (
stmt.type === 'ExpressionStatement' &&
stmt.expression.type === 'Literal' &&
typeof stmt.expression.value === 'string' &&
OPT_OUT_DIRECTIVES.has(stmt.expression.value) &&
stmt.loc != null
) {
context.report({
message: `Unused '${stmt.expression.value}' directive`,
loc: stmt.loc,
suggest: [
{
desc: 'Remove the directive',
fix(fixer) {
return fixer.remove(stmt);
},
},
],
});
}
}
if (shouldReportUnusedOptOutDirective) {
return {
FunctionDeclaration(fnDecl) {
for (const stmt of fnDecl.body.body) {
reportUnusedOptOutDirective(stmt);
}
},
ArrowFunctionExpression(fnExpr) {
if (fnExpr.body.type === 'BlockStatement') {
for (const stmt of fnExpr.body.body) {
reportUnusedOptOutDirective(stmt);
}
}
},
FunctionExpression(fnExpr) {
for (const stmt of fnExpr.body.body) {
reportUnusedOptOutDirective(stmt);
}
},
};
} else {
return {};
}
},
};

Expand Down

0 comments on commit d931832

Please sign in to comment.