Skip to content

Commit b5423b0

Browse files
JeanMecheJeanMeche
committed
refactor(vscode-extension): allow toggle attributes via LS.
This change allows to toggle attributes that are on their own line and have a 1+ leading space. This change doesn't suffer from the issue that was reverted in #68067. Also this change fixes another regression that messed up highlighting if an attribute value included a '//', like in an href.
1 parent e95d846 commit b5423b0

File tree

5 files changed

+37
-70
lines changed

5 files changed

+37
-70
lines changed

‎vscode-ng-language-service/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -363,7 +363,8 @@
363363
"source.ts"
364364
],
365365
"embeddedLanguages": {
366-
"template.tag.ng": "angular-tag-comment"
366+
"template.tag.ng": "angular-tag-comment",
367+
"template.tag.leading-space": "angular-tag-comment"
367368
}
368369
},
369370
{

‎vscode-ng-language-service/syntaxes/src/template-tag.ts‎

Lines changed: 5 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -10,30 +10,19 @@ import {GrammarDefinition} from './types';
1010

1111
export const TemplateTag: GrammarDefinition = {
1212
scopeName: 'template.tag.ng',
13-
injectionSelector: 'L:text.html#meta.tag -comment',
13+
injectionSelector: 'L:text.html#meta.tag -comment -string',
1414
patterns: [
1515
{include: '#inlineComments'},
16+
{include: '#leadingSpace'},
1617
{include: '#twoWayBinding'},
1718
{include: '#propertyBinding'},
1819
{include: '#eventBinding'},
1920
{include: '#templateBinding'},
20-
{include: '#standardAttribute'},
2121
],
2222
repository: {
23-
standardAttribute: {
24-
begin: /([-_a-zA-Z0-9.$:]+)(=)(["'])/,
25-
beginCaptures: {
26-
1: {name: 'entity.other.attribute-name.html'},
27-
2: {name: 'punctuation.separator.key-value.html'},
28-
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
29-
},
30-
// @ts-ignore
31-
end: /\3/,
32-
endCaptures: {
33-
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
34-
},
35-
name: 'meta.attribute.standard.html',
36-
patterns: [{include: 'expression.ng'}],
23+
leadingSpace: {
24+
match: /^\s+/,
25+
name: 'template.tag.leading-space',
3726
},
3827
propertyBinding: {
3928
begin: /(\[\s*@?(?:[-_a-zA-Z0-9.$]+|\[[^\[\]]*]|\([^()]*\))*%?\s*])(=)(["'])/,

‎vscode-ng-language-service/syntaxes/template-tag.json‎

Lines changed: 7 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
{
22
"scopeName": "template.tag.ng",
3-
"injectionSelector": "L:text.html#meta.tag -comment",
3+
"injectionSelector": "L:text.html#meta.tag -comment -string",
44
"patterns": [
55
{
66
"include": "#inlineComments"
77
},
8+
{
9+
"include": "#leadingSpace"
10+
},
811
{
912
"include": "#twoWayBinding"
1013
},
@@ -16,37 +19,12 @@
1619
},
1720
{
1821
"include": "#templateBinding"
19-
},
20-
{
21-
"include": "#standardAttribute"
2222
}
2323
],
2424
"repository": {
25-
"standardAttribute": {
26-
"begin": "([-_a-zA-Z0-9.$:]+)(=)([\"'])",
27-
"beginCaptures": {
28-
"1": {
29-
"name": "entity.other.attribute-name.html"
30-
},
31-
"2": {
32-
"name": "punctuation.separator.key-value.html"
33-
},
34-
"3": {
35-
"name": "string.quoted.html punctuation.definition.string.begin.html"
36-
}
37-
},
38-
"end": "\\3",
39-
"endCaptures": {
40-
"0": {
41-
"name": "string.quoted.html punctuation.definition.string.end.html"
42-
}
43-
},
44-
"name": "meta.attribute.standard.html",
45-
"patterns": [
46-
{
47-
"include": "expression.ng"
48-
}
49-
]
25+
"leadingSpace": {
26+
"match": "^\\s+",
27+
"name": "template.tag.leading-space"
5028
},
5129
"propertyBinding": {
5230
"begin": "(\\[\\s*@?(?:[-_a-zA-Z0-9.$]+|\\[[^\\[\\]]*]|\\([^()]*\\))*%?\\s*])(=)([\"'])",

‎vscode-ng-language-service/syntaxes/test/data/template-tag.html‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,4 +88,7 @@
8888
spanning multiple lines
8989
*/
9090
attr2="value2"
91-
></div>
91+
></div>
92+
93+
<a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">Click me</a>
94+
<a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Click me too</a><a href="https://example.com" //inline-comment>

‎vscode-ng-language-service/syntaxes/test/data/template-tag.html.snap‎

Lines changed: 19 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -438,13 +438,7 @@
438438
# ^ template.tag.ng meta.ng-binding.template.html string.quoted.html punctuation.definition.string.end.html
439439
# ^^^^^^^^^^^^^^^^^ template.tag.ng
440440
><my-component *%invalid="expr"></my-component>
441-
#^^^^^^^^^^^^^^^^ template.tag.ng
442-
# ^^^^^^^ template.tag.ng meta.attribute.standard.html entity.other.attribute-name.html
443-
# ^ template.tag.ng meta.attribute.standard.html punctuation.separator.key-value.html
444-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.begin.html
445-
# ^^^^ template.tag.ng meta.attribute.standard.html variable.other.readwrite.ts
446-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.end.html
447-
# ^^^^^^^^^^^^^^^^^ template.tag.ng
441+
#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.tag.ng
448442
>
449443
><!-- Microsyntax -->
450444
#^^^^^^^^^^^^^^^^^^^^^ template.tag.ng
@@ -801,23 +795,19 @@
801795
><div
802796
#^^^^^ template.tag.ng
803797
> // comment 0
804-
#^^ template.tag.ng
798+
#^^ template.tag.ng template.tag.leading-space
805799
# ^^ template.tag.ng comment.line.double-slash.ts punctuation.definition.comment.ts
806800
# ^^^^^^^^^^ template.tag.ng comment.line.double-slash.ts
807801
> /* comment 1 */
808-
#^^ template.tag.ng
802+
#^^ template.tag.ng template.tag.leading-space
809803
# ^^ template.tag.ng comment.block.ts punctuation.definition.comment.ts
810804
# ^^^^^^^^^^^ template.tag.ng comment.block.ts
811805
# ^^ template.tag.ng comment.block.ts punctuation.definition.comment.ts
812806
> attr1="value1"
813-
#^^ template.tag.ng
814-
# ^^^^^ template.tag.ng meta.attribute.standard.html entity.other.attribute-name.html
815-
# ^ template.tag.ng meta.attribute.standard.html punctuation.separator.key-value.html
816-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.begin.html
817-
# ^^^^^^ template.tag.ng meta.attribute.standard.html variable.other.readwrite.ts
818-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.end.html
807+
#^^ template.tag.ng template.tag.leading-space
808+
# ^^^^^^^^^^^^^^^ template.tag.ng
819809
> /*
820-
#^^ template.tag.ng
810+
#^^ template.tag.ng template.tag.leading-space
821811
# ^^ template.tag.ng comment.block.ts punctuation.definition.comment.ts
822812
> comment 2
823813
#^^^^^^^^^^^^^^^ template.tag.ng comment.block.ts
@@ -827,11 +817,17 @@
827817
#^^ template.tag.ng comment.block.ts
828818
# ^^ template.tag.ng comment.block.ts punctuation.definition.comment.ts
829819
> attr2="value2"
830-
#^^ template.tag.ng
831-
# ^^^^^ template.tag.ng meta.attribute.standard.html entity.other.attribute-name.html
832-
# ^ template.tag.ng meta.attribute.standard.html punctuation.separator.key-value.html
833-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.begin.html
834-
# ^^^^^^ template.tag.ng meta.attribute.standard.html variable.other.readwrite.ts
835-
# ^ template.tag.ng meta.attribute.standard.html string.quoted.html punctuation.definition.string.end.html
820+
#^^ template.tag.ng template.tag.leading-space
821+
# ^^^^^^^^^^^^^^^ template.tag.ng
836822
>></div>
837-
#^^^^^^^^ template.tag.ng
823+
#^^^^^^^^ template.tag.ng
824+
>
825+
><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">Click me</a>
826+
#^^^^^^^^^^^^^^^ template.tag.ng
827+
# ^^ template.tag.ng comment.line.double-slash.ts punctuation.definition.comment.ts
828+
# ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.tag.ng comment.line.double-slash.ts
829+
><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank">Click me too</a><a href="https://example.com" //inline-comment>
830+
#^^^^^^^^^^^^^^^ template.tag.ng
831+
# ^^ template.tag.ng comment.line.double-slash.ts punctuation.definition.comment.ts
832+
# ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.tag.ng comment.line.double-slash.ts
833+
>

0 commit comments

Comments
 (0)