Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[compiler] Surface unused opt out directives in eslint #30721

Merged
merged 10 commits into from
Aug 16, 2024
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
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);
}
},
Comment on lines +304 to +320
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This won't necessarily match 1:1 with functions that the compiler attempted to compile, in particular it might find more functions. But I guess that's okay, if you have a "use no memo" in a component that isn't being recognized as a component/hook that's also an error.

};
} else {
return {};
}
},
};

Expand Down
Loading