Skip to content

Commit

Permalink
fix: remove unneeded semicolon in the autofix suggestion (biomejs#1638)
Browse files Browse the repository at this point in the history
  • Loading branch information
@togami2864 @ematipico
togami2864 authored and ematipico committed Jan 24, 2024
1 parent 0c12315 commit 74865f0
Show file tree
Hide file tree
Showing 4 changed files with 114 additions and 16 deletions.
7 changes: 6 additions & 1 deletion crates/biome_js_analyze/src/semantic_analyzers/complexity/no_useless_this_alias.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ use biome_js_semantic::ReferencesExtensions;
use biome_js_syntax::{
AnyJsBinding, AnyJsBindingPattern, AnyJsExpression, JsArrowFunctionExpression,
JsAssignmentExpression, JsExpressionStatement, JsIdentifierBinding, JsIdentifierExpression,
JsThisExpression, JsVariableDeclaration, JsVariableDeclarator, T,
JsThisExpression, JsVariableDeclaration, JsVariableDeclarator, JsVariableStatement, T,
};
use biome_rowan::{AstNode, AstSeparatedList, BatchMutationExt};

Expand Down Expand Up @@ -159,6 +159,11 @@ impl Rule for NoUselessThisAlias {
}
let var_declarator_list = var_decl.declarators();
if var_declarator_list.len() == 1 {
if let Some(statement) = JsVariableStatement::cast(var_decl.syntax().parent()?) {
if statement.semicolon_token().is_some() {
mutation.remove_token(statement.semicolon_token()?);
}
}
mutation.remove_node(var_decl);
} else {
let mut deleted_comma = None;
Expand Down
28 changes: 28 additions & 0 deletions crates/biome_js_analyze/tests/specs/complexity/noUselessThisAlias/invalid.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,3 +23,31 @@ function f() {
self.g();
}
}


// https://github.com/biomejs/biome/issues/1633
class FetchServersMetrics extends React.Component {
_fetchServersMetrics() {
const { onStatusChange, appIds, filters, time } = this.props;
const component = this;

fetchServers(appIds, time)
.then(servers => {
const data = isEmpty(filters) ? servers : applyFilters(servers, filters);
component.setState({
timestamp: new Date().getTime(),
isLoading: false,
data: data.filter(identity),
});
})
.catch((err) => {
component.setState({ serverError: throwOrResolve(err) });
})
.then(() => component.setState({ isLoading: false }));
}

render() {
const { children } = this.props;
return children(this._fetchServerMetrics);
}
}
87 changes: 76 additions & 11 deletions crates/biome_js_analyze/tests/specs/complexity/noUselessThisAlias/invalid.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,34 @@ function f() {
}
}


// https://github.com/biomejs/biome/issues/1633
class FetchServersMetrics extends React.Component {
_fetchServersMetrics() {
const { onStatusChange, appIds, filters, time } = this.props;
const component = this;

fetchServers(appIds, time)
.then(servers => {
const data = isEmpty(filters) ? servers : applyFilters(servers, filters);
component.setState({
timestamp: new Date().getTime(),
isLoading: false,
data: data.filter(identity),
});
})
.catch((err) => {
component.setState({ serverError: throwOrResolve(err) });
})
.then(() => component.setState({ isLoading: false }));
}

render() {
const { children } = this.props;
return children(this._fetchServerMetrics);
}
}

```

# Diagnostics
Expand Down Expand Up @@ -87,14 +115,13 @@ invalid.js:5:11 lint/complexity/noUselessThisAlias FIXABLE ━━━━━━
i Safe fix: Use this instead of an alias.
1 1 │ const self = this, v = 0, /*u*/ u = 2, self2 = this;
2 2 │
3 │ - function·f()·{
3 3 │ function f() {
4 │ - ····//·assignment·comment
5 │ - ····const·self·=·this;
3 │ + function·f()·{;
6 4 │ return () => {
6 │ - ····return·()·=>·{
7 │ - ········/*a*/self/*b*/.g();
4 │ + ····return·()·=>·{
5 │ + ········/*a*/this/*b*/.g();
8 6 │ }
9 7 │ }
Expand All @@ -117,13 +144,12 @@ invalid.js:12:9 lint/complexity/noUselessThisAlias FIXABLE ━━━━━━
i Safe fix: Use this instead of an alias.
9 9 │ }
10 10 │
11 │ - function·f()·{
11 11 │ function f() {
12 │ - ····let·self·=·this;
11 │ + function·f()·{;
13 12 │ return () => {
13 │ - ····return·()·=>·{
14 │ - ········self.g();
12 │ + ····return·()·=>·{
13 │ + ········this.g();
15 14 │ }
16 15 │ }
Expand All @@ -146,15 +172,13 @@ invalid.js:19:9 lint/complexity/noUselessThisAlias FIXABLE ━━━━━━
i Safe fix: Use this instead of an alias.
16 16 │ }
17 17 │
18 │ - function·f()·{
18 18 │ function f() {
19 │ - ····var·self;
20 │ - ····self·=·this;
21 │ - ····self·=·this;
22 │ - ····return·()·=>·{
23 │ - ········self.g();
18 │ + function·f()·{;
19 │ + ····return·()·=>·{
20 │ + ········this.g();
24 21 │ }
Expand All @@ -163,4 +187,45 @@ invalid.js:19:9 lint/complexity/noUselessThisAlias FIXABLE ━━━━━━
```

```
invalid.js:32:13 lint/complexity/noUselessThisAlias FIXABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
! This aliasing of this is unnecessary.
30 │ _fetchServersMetrics() {
31 │ const { onStatusChange, appIds, filters, time } = this.props;
> 32 │ const component = this;
│ ^^^^^^^^^^^^^^^^
33 │
34 │ fetchServers(appIds, time)
i Arrow functions inherits `this` from their enclosing scope.
i Safe fix: Use this instead of an alias.
30 30 │ _fetchServersMetrics() {
31 31 │ const { onStatusChange, appIds, filters, time } = this.props;
32 │ - ······const·component·=·this;
33 32 │
34 33 │ fetchServers(appIds, time)
35 34 │ .then(servers => {
36 35 │ const data = isEmpty(filters) ? servers : applyFilters(servers, filters);
37 │ - ··········component.setState({
36 │ + ··········this.setState({
38 37 │ timestamp: new Date().getTime(),
39 38 │ isLoading: false,
····· │
42 41 │ })
43 42 │ .catch((err) => {
44 │ - ··········component.setState({·serverError:·throwOrResolve(err)·});
43 │ + ··········this.setState({·serverError:·throwOrResolve(err)·});
45 44 │ })
46 │ - ········.then(()·=>·component.setState({·isLoading:·false·}));
45 │ + ········.then(()·=>·this.setState({·isLoading:·false·}));
47 46 │ }
48 47 │
```


8 changes: 4 additions & 4 deletions website/src/content/docs/linter/rules/no-useless-this-alias.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,11 +46,11 @@ class A {
<strong><span style="color: lightgreen;"> </span></strong><strong><span style="color: lightgreen;">ℹ</span></strong> <span style="color: lightgreen;">Safe fix</span><span style="color: lightgreen;">: </span><span style="color: lightgreen;">Use </span><span style="color: lightgreen;"><strong>this</strong></span><span style="color: lightgreen;"> instead of an alias.</span>

<strong>1</strong> <strong>1</strong><strong> │ </strong> class A {
<strong>2</strong> <strong> │ </strong><span style="color: Tomato;">-</span> <span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">m</span><span style="color: Tomato;">e</span><span style="color: Tomato;">t</span><span style="color: Tomato;">h</span><span style="color: Tomato;">o</span><span style="color: Tomato;">d</span><span style="color: Tomato;">(</span><span style="color: Tomato;">)</span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">{</span>
<strong>3</strong> <strong> │ </strong><span style="color: Tomato;">-</span> <span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>c</strong></span><span style="color: Tomato;"><strong>o</strong></span><span style="color: Tomato;"><strong>n</strong></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>t</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>e</strong></span><span style="color: Tomato;"><strong>l</strong></span><span style="color: Tomato;"><strong>f</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>=</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>t</strong></span><span style="color: Tomato;"><strong>h</strong></span><span style="color: Tomato;"><strong>i</strong></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;">;</span>
<strong>2</strong><strong> │ </strong><span style="color: MediumSeaGreen;">+</span> <span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">m</span><span style="color: MediumSeaGreen;">e</span><span style="color: MediumSeaGreen;">t</span><span style="color: MediumSeaGreen;">h</span><span style="color: MediumSeaGreen;">o</span><span style="color: MediumSeaGreen;">d</span><span style="color: MediumSeaGreen;">(</span><span style="color: MediumSeaGreen;">)</span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">{</span><span style="color: MediumSeaGreen;">;</span>
<strong>4</strong> <strong>3</strong><strong> │ </strong> return () =&gt; {
<strong>2</strong> <strong>2</strong><strong> │ </strong> method() {
<strong>3</strong> <strong> │ </strong><span style="color: Tomato;">-</span> <span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><strong>c</strong></span><span style="color: Tomato;"><strong>o</strong></span><span style="color: Tomato;"><strong>n</strong></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>t</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>e</strong></span><span style="color: Tomato;"><strong>l</strong></span><span style="color: Tomato;"><strong>f</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>=</strong></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><strong>t</strong></span><span style="color: Tomato;"><strong>h</strong></span><span style="color: Tomato;"><strong>i</strong></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>;</strong></span>
<strong>4</strong> <strong> │ </strong><span style="color: Tomato;">-</span> <span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;"><span style="opacity: 0.8;"><strong>·</strong></span></span><span style="color: Tomato;">r</span><span style="color: Tomato;">e</span><span style="color: Tomato;">t</span><span style="color: Tomato;">u</span><span style="color: Tomato;">r</span><span style="color: Tomato;">n</span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">(</span><span style="color: Tomato;">)</span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">=</span><span style="color: Tomato;">&gt;</span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">{</span>
<strong>5</strong> <strong> │ </strong><span style="color: Tomato;">-</span> <span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;">r</span><span style="color: Tomato;">e</span><span style="color: Tomato;">t</span><span style="color: Tomato;">u</span><span style="color: Tomato;">r</span><span style="color: Tomato;">n</span><span style="color: Tomato;"><span style="opacity: 0.8;">·</span></span><span style="color: Tomato;"><strong>s</strong></span><span style="color: Tomato;"><strong>e</strong></span><span style="color: Tomato;"><strong>l</strong></span><span style="color: Tomato;"><strong>f</strong></span><span style="color: Tomato;">;</span>
<strong>3</strong><strong> │ </strong><span style="color: MediumSeaGreen;">+</span> <span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">r</span><span style="color: MediumSeaGreen;">e</span><span style="color: MediumSeaGreen;">t</span><span style="color: MediumSeaGreen;">u</span><span style="color: MediumSeaGreen;">r</span><span style="color: MediumSeaGreen;">n</span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">(</span><span style="color: MediumSeaGreen;">)</span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">=</span><span style="color: MediumSeaGreen;">&gt;</span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">{</span>
<strong>4</strong><strong> │ </strong><span style="color: MediumSeaGreen;">+</span> <span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;">r</span><span style="color: MediumSeaGreen;">e</span><span style="color: MediumSeaGreen;">t</span><span style="color: MediumSeaGreen;">u</span><span style="color: MediumSeaGreen;">r</span><span style="color: MediumSeaGreen;">n</span><span style="color: MediumSeaGreen;"><span style="opacity: 0.8;">·</span></span><span style="color: MediumSeaGreen;"><strong>t</strong></span><span style="color: MediumSeaGreen;"><strong>h</strong></span><span style="color: MediumSeaGreen;"><strong>i</strong></span><span style="color: MediumSeaGreen;"><strong>s</strong></span><span style="color: MediumSeaGreen;">;</span>
<strong>6</strong> <strong>5</strong><strong> │ </strong> }
<strong>7</strong> <strong>6</strong><strong> │ </strong> }
Expand Down

0 comments on commit 74865f0

Please sign in to comment.