Skip to content

Commit fc97534

Browse files
author
Armando Aguirre
committed
Added jsx to singleLineComment
1 parent 97de811 commit fc97534

13 files changed

Lines changed: 198 additions & 77 deletions

‎src/services/services.ts‎

Lines changed: 30 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1997,43 +1997,67 @@ namespace ts {
19971997
let leftMostPosition = Number.MAX_VALUE;
19981998
let lineTextStarts = new Map<number>();
19991999
const whiteSpaceRegex = new RegExp(/\S/);
2000+
const isJsx = isInsideJsxElement(sourceFile, lineStarts[firstLine])
2001+
const openComment = isJsx ? "{/*" : "//";
2002+
const closeComment = "*/}";
20002003

20012004
// First check the lines before any text changes.
20022005
for (let i = firstLine; i <= lastLine; i++) {
2003-
const lineText = sourceFile.text.substring(lineStarts[i], lineStarts[i + 1]); // TODO: Validate the end of line it might go outside of range.
2006+
const lineText = sourceFile.text.substring(lineStarts[i], sourceFile.getLineEndOfPosition(lineStarts[i]));
20042007

20052008
// Find the start of text and the left-most character. No-op on empty lines.
20062009
const regExec = whiteSpaceRegex.exec(lineText);
20072010
if (regExec) {
20082011
leftMostPosition = Math.min(leftMostPosition, regExec.index);
20092012
lineTextStarts.set(i.toString(), regExec.index);
2010-
// let sourceFilePosition = lineStarts[i] + leftMostPosition;
2011-
if (lineText.substr(regExec.index, 3) !== "// ") { // TODO: Validate when it is inside a comment. It can only uncomment if it's inside a comment. // TODO: Check when not finishing on empty space.
2013+
2014+
if (lineText.substr(regExec.index, openComment.length) !== openComment) { // TODO: Validate when it is inside a comment. It can only uncomment if it's inside a comment. // TODO: Check when not finishing on empty space.
20122015
isCommenting = true;
20132016
}
20142017
}
20152018
}
20162019

2020+
// Push all text changes.
20172021
for (let i = firstLine; i <= lastLine; i++) {
20182022
const lineTextStart = lineTextStarts.get(i.toString());
20192023
// If the line is not an empty line; otherwise no-op;
20202024
if (lineTextStart !== undefined) {
20212025
if (isCommenting) {
20222026
textChanges.push({
2023-
newText: "// ",
2027+
newText: openComment,
20242028
span: {
20252029
length: 0,
20262030
start: lineStarts[i] + leftMostPosition
20272031
}
20282032
});
2033+
2034+
if (isJsx) {
2035+
textChanges.push({
2036+
newText: closeComment,
2037+
span: {
2038+
length: 0,
2039+
start: sourceFile.getLineEndOfPosition(lineStarts[i])
2040+
}
2041+
});
2042+
}
20292043
} else {
20302044
textChanges.push({
20312045
newText: "",
20322046
span: {
2033-
length: 3,
2047+
length: openComment.length,
20342048
start: lineStarts[i] + lineTextStart
20352049
}
20362050
});
2051+
2052+
if (isJsx) {
2053+
textChanges.push({
2054+
newText: "",
2055+
span: {
2056+
length: closeComment.length,
2057+
start: sourceFile.getLineEndOfPosition(lineStarts[i]) - closeComment.length
2058+
}
2059+
});
2060+
}
20372061
}
20382062
}
20392063
}
@@ -2052,7 +2076,7 @@ namespace ts {
20522076
const positions = [] as number[] as SortedArray<number>;
20532077

20542078
let pos = textRange.pos;
2055-
const isJsx = isInsideJsxTags(sourceFile, pos);
2079+
const isJsx = isInsideJsxElement(sourceFile, pos);
20562080

20572081
const openMultiline = isJsx ? "{/*" : "/*";
20582082
const closeMultiline = isJsx ? "*/}" : "*/";

‎src/services/utilities.ts‎

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1320,23 +1320,29 @@ namespace ts {
13201320
return false;
13211321
}
13221322

1323-
export function isInsideJsxTags(sourceFile: SourceFile, position: number) {
1324-
const token = getTokenAtPosition(sourceFile, position);
1323+
export function isInsideJsxElement(sourceFile: SourceFile, position: number): boolean {
1324+
function isInsideJsxElementRecursion(node: Node): boolean {
1325+
while (node) {
1326+
if (node.kind >= SyntaxKind.JsxSelfClosingElement && node.kind <= SyntaxKind.JsxExpression
1327+
|| node.kind === SyntaxKind.JsxText
1328+
|| node.kind === SyntaxKind.LessThanToken
1329+
|| node.kind === SyntaxKind.GreaterThanToken
1330+
|| node.kind === SyntaxKind.Identifier
1331+
|| node.kind === SyntaxKind.CloseBraceToken
1332+
|| node.kind === SyntaxKind.OpenBraceToken
1333+
|| node.kind === SyntaxKind.SlashToken) {
1334+
node = node.parent;
1335+
} else if (node.kind === SyntaxKind.JsxElement) {
1336+
return position > node.getStart(sourceFile) || isInsideJsxElementRecursion(node.parent);
1337+
} else {
1338+
return false;
1339+
}
1340+
}
13251341

1326-
switch (token.kind) {
1327-
case SyntaxKind.JsxText:
1328-
return true;
1329-
case SyntaxKind.LessThanToken:
1330-
case SyntaxKind.Identifier:
1331-
return token.parent.kind === SyntaxKind.JsxText // <div>Hello |</div>
1332-
|| token.parent.kind === SyntaxKind.JsxClosingElement // <div>|</div>
1333-
|| isJsxOpeningLikeElement(token.parent) && isJsxElement(token.parent.parent) // <div>|<component /></div> or <div><comp|onent /></div>
1334-
case SyntaxKind.CloseBraceToken:
1335-
case SyntaxKind.OpenBraceToken:
1336-
return isJsxExpression(token.parent) && isJsxElement(token.parent.parent); // <div>{|}</div> or <div>|{}</div>
1342+
return false;
13371343
}
13381344

1339-
return false;
1345+
return isInsideJsxElementRecursion(getTokenAtPosition(sourceFile, position));
13401346
}
13411347

13421348
export function findPrecedingMatchingToken(token: Node, matchingTokenKind: SyntaxKind, sourceFile: SourceFile) {

‎tests/cases/fourslash/toggleLineComment1.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@
44
//// let var2 = 2;
55
//// let var3 |]= 3;
66
////
7-
//// // let var4[| = 1;
8-
//// // let var5 = 2;
9-
//// // let var6 |]= 3;
7+
//// //let var4[| = 1;
8+
//// //let var5 = 2;
9+
//// //let var6 |]= 3;
1010

1111
verify.toggleLineComment(
12-
`// let var1 = 1;
13-
// let var2 = 2;
14-
// let var3 = 3;
12+
`//let var1 = 1;
13+
//let var2 = 2;
14+
//let var3 = 3;
1515
1616
let var4 = 1;
1717
let var5 = 2;

‎tests/cases/fourslash/toggleLineComment2.ts‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,15 @@
66
//// let var2 = 2;
77
//// let var3 |]= 3;
88
////
9-
//// // let var4[| = 1;
10-
//// // let var5 = 2;
11-
//// // let var6 |]= 3;
9+
//// // let var4[| = 1;
10+
//// //let var5 = 2;
11+
//// // let var6 |]= 3;
1212

1313
verify.toggleLineComment(
14-
`// let var1 = 1;
15-
// let var2 = 2;
16-
// let var3 = 3;
14+
` // let var1 = 1;
15+
//let var2 = 2;
16+
// let var3 = 3;
1717
18-
let var4 = 1;
19-
let var5 = 2;
20-
let var6 = 3;`);
18+
let var4 = 1;
19+
let var5 = 2;
20+
let var6 = 3;`);

‎tests/cases/fourslash/toggleLineComment3.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,18 +6,18 @@
66
////
77
//// let var3 |]= 3;
88
////
9-
//// // let var4[| = 1;
9+
//// //let var4[| = 1;
1010
////
11-
//// // let var5 = 2;
11+
//// //let var5 = 2;
1212
////
13-
//// // let var6 |]= 3;
13+
//// //let var6 |]= 3;
1414

1515
verify.toggleLineComment(
16-
`// let var1 = 1;
16+
`//let var1 = 1;
1717
18-
// let var2 = 2;
18+
//let var2 = 2;
1919
20-
// let var3 = 3;
20+
//let var3 = 3;
2121
2222
let var4 = 1;
2323

‎tests/cases/fourslash/toggleLineComment4.ts‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
// If at least one line is uncomment then comment all lines again.
22

3-
//// // let var1[| = 1;
4-
//// let var2 = 2;
5-
//// // let var3 |]= 3;
3+
//// //const a[| = 1;
4+
//// const b = 2
5+
//// //const c =|] 3;
66
////
7-
//// // // let var4[| = 1;
8-
//// // let var5 = 2;
9-
//// // // let var6 |]= 3;
7+
//// ////const d[| = 4;
8+
//// //const e = 5;
9+
//// ////const e =|] 6;
1010

1111
verify.toggleLineComment(
12-
`// // let var1 = 1;
13-
// let var2 = 2;
14-
// // let var3 = 3;
12+
`// //const a = 1;
13+
//const b = 2
14+
// //const c = 3;
1515
16-
// let var4 = 1;
17-
let var5 = 2;
18-
// let var6 = 3;`);
16+
//const d = 4;
17+
const e = 5;
18+
//const e = 6;`);

‎tests/cases/fourslash/toggleLineComment5.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
// Comments inside strings are still considered comments.
22

33
//// let var1 = `
4-
//// // some stri[|ng
5-
//// // some other|] string
4+
//// //some stri[|ng
5+
//// //some other|] string
66
//// `;
77
////
88
//// let var2 = `
@@ -17,6 +17,6 @@ some other string
1717
\`;
1818
1919
let var2 = \`
20-
// some string
21-
// some other string
20+
//some string
21+
//some other string
2222
\`;`);

‎tests/cases/fourslash/toggleLineComment6.ts‎

Lines changed: 12 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,15 @@
1-
// Selection is at the start of jsx it's still considered js.
1+
// Selection is at the start of jsx its still js.
22

3-
//// function a() {
4-
//// let foo = "bar";
5-
//// return (
6-
//// [|<div>
7-
//// {foo}|]
8-
//// </div>
9-
//// );
10-
//// }
3+
//@Filename: file.tsx
4+
//// let a = (
5+
//// [|<div>
6+
//// some text|]
7+
//// </div>
8+
//// );
119

1210
verify.toggleLineComment(
13-
`function a() {
14-
let foo = "bar";
15-
return (
16-
// <div>
17-
// {foo}
18-
</div>
19-
);
20-
}`);
11+
`let a = (
12+
//<div>
13+
// some text
14+
</div>
15+
);`);

‎tests/cases/fourslash/toggleLineComment7.ts‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
// Common comment line cases.
2+
3+
//@Filename: file.tsx
4+
//// const a = <MyContainer>
5+
//// [|<MyFirstComponent />
6+
//// <MySecondComponent />|]
7+
//// </MyContainer>;
8+
//// const b = <MyContainer>
9+
//// {/*<MyF[|irstComponent />*/}
10+
//// {/*<MySec|]ondComponent />*/}
11+
//// </MyContainer>;
12+
//// const c = <MyContainer>[|
13+
//// <MyFirstComponent />
14+
//// <MySecondCompo|]nent />
15+
//// </MyContainer>;
16+
17+
verify.toggleLineComment(
18+
`const a = <MyContainer>
19+
{/*<MyFirstComponent />*/}
20+
{/*<MySecondComponent />*/}
21+
</MyContainer>;
22+
const b = <MyContainer>
23+
<MyFirstComponent />
24+
<MySecondComponent />
25+
</MyContainer>;
26+
//const c = <MyContainer>
27+
// <MyFirstComponent />
28+
// <MySecondComponent />
29+
</MyContainer>;`);

‎tests/cases/fourslash/toggleLineComment8.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
// When indentation is different between lines it should get the left most indentation
2+
// and use that for all lines.
3+
// When uncommeting, doesn't matter what indentation the line has.
4+
5+
//@Filename: file.tsx
6+
//// const a = <div>
7+
//// [|<div>
8+
//// SomeText
9+
//// </div>|]
10+
//// </div>;
11+
////
12+
//// const b = <div>
13+
//// {/*[|<div>*/}
14+
//// {/* SomeText*/}
15+
//// {/*</div>|]*/}
16+
//// </div>;
17+
18+
19+
verify.toggleLineComment(
20+
`const a = <div>
21+
{/*<div>*/}
22+
{/* SomeText*/}
23+
{/*</div>*/}
24+
</div>;
25+
26+
const b = <div>
27+
<div>
28+
SomeText
29+
</div>
30+
</div>;`);

0 commit comments

Comments
 (0)