Skip to content

Commit 832564d

Browse files
committed
fix(syntaxes): Adjust block syntax highlighting to require ( or { on same line
While our parser allows for a block name to be defined on a separate line from the expression or brace, the syntax highlighting will not. Because the extension may be used for older versions of Angular and we cannot turn highlighting on and off dynamically like we can the parser, we make the highlighting more restrictive. This should cover a majority of use-cases where `@` is used in older versions of Angular like in emails and _not_ begin block highlighting. Partially addresses #1958. Will need another change to detect Angular version and disable block parsing.
1 parent e17fc5c commit 832564d

File tree

4 files changed

+39
-14
lines changed

4 files changed

+39
-14
lines changed

syntaxes/src/template-blocks.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,12 @@ export const TemplateBlocks: GrammarDefinition = {
2222
},
2323

2424
block: {
25-
begin: /(@)((?:\w+\s*)+)/,
25+
// @ followed by words and spaces. Also require a { or ( on the same line but don't capture
26+
// it.
27+
// The parser doesn't require this but we do for syntax highlighting to be more exclusive
28+
// since
29+
// the extension can be used for older versions of Angular.
30+
begin: /(@)((?:\w+\s*)+)(?=\(|\{)/,
2631
beginCaptures: {
2732
1: {
2833
patterns: [

syntaxes/template-blocks.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"name": "keyword.control.block.transition.ng"
1313
},
1414
"block": {
15-
"begin": "(@)((?:\\w+\\s*)+)",
15+
"begin": "(@)((?:\\w+\\s*)+)(?=\\(|\\{)",
1616
"beginCaptures": {
1717
"1": {
1818
"patterns": [

syntaxes/test/data/template-blocks.html

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
goodbye
2727
}
2828

29-
@for (let item of items; as thing; track: $index) {
29+
@for (let item of items; track $index) {
3030
bla
3131
}
3232

@@ -37,3 +37,12 @@
3737
) {
3838
{{o}}
3939
}
40+
41+
<!-- Should not highlight -->
42+
@if
43+
(items) {}
44+
45+
46+
47+
@for
48+
(let item of items; track $index) { }

syntaxes/test/data/template-blocks.html.snap

Lines changed: 22 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,7 @@
129129
>}
130130
#^ template.blocks.ng control.block.ng punctuation.definition.block.ts
131131
>
132-
>@for (let item of items; as thing; track: $index) {
132+
>@for (let item of items; track $index) {
133133
#^ template.blocks.ng keyword.control.block.transition.ng
134134
# ^^^^ template.blocks.ng keyword.control.block.kind.ng
135135
# ^ template.blocks.ng control.block.ng meta.brace.round.ts
@@ -141,16 +141,12 @@
141141
# ^ template.blocks.ng control.block.ng control.block.expression.ng
142142
# ^^^^^ template.blocks.ng control.block.ng control.block.expression.ng variable.other.readwrite.ts
143143
# ^^ template.blocks.ng control.block.ng control.block.expression.ng
144-
# ^^ template.blocks.ng control.block.ng control.block.expression.ng storage.type.as.ts
145-
# ^ template.blocks.ng control.block.ng control.block.expression.ng
146-
# ^^^^^ template.blocks.ng control.block.ng control.block.expression.ng entity.name.type.ts
147-
# ^^ template.blocks.ng control.block.ng control.block.expression.ng
148-
# ^^^^^ template.blocks.ng control.block.ng control.block.expression.ng variable.other.readwrite.ts
149-
# ^^ template.blocks.ng control.block.ng control.block.expression.ng
150-
# ^^^^^^ template.blocks.ng control.block.ng control.block.expression.ng variable.other.readwrite.ts
151-
# ^ template.blocks.ng control.block.ng meta.brace.round.ts
152-
# ^ template.blocks.ng control.block.ng
153-
# ^ template.blocks.ng control.block.ng punctuation.definition.block.ts
144+
# ^^^^^ template.blocks.ng control.block.ng control.block.expression.ng variable.other.readwrite.ts
145+
# ^ template.blocks.ng control.block.ng control.block.expression.ng
146+
# ^^^^^^ template.blocks.ng control.block.ng control.block.expression.ng variable.other.readwrite.ts
147+
# ^ template.blocks.ng control.block.ng meta.brace.round.ts
148+
# ^ template.blocks.ng control.block.ng
149+
# ^ template.blocks.ng control.block.ng punctuation.definition.block.ts
154150
> bla
155151
#^^^^^^^^ template.blocks.ng control.block.ng control.block.body.ng
156152
>}
@@ -190,4 +186,19 @@
190186
# ^^ template.blocks.ng control.block.ng control.block.body.ng punctuation.definition.block.ts
191187
>}
192188
#^ template.blocks.ng control.block.ng punctuation.definition.block.ts
189+
>
190+
><!-- Should not highlight -->
191+
#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.blocks.ng
192+
>@if
193+
#^^^^^ template.blocks.ng
194+
>(items) {}
195+
#^^^^^^^^^^^ template.blocks.ng
196+
>
197+
>some.email@google.com ({}) {}
198+
#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.blocks.ng
199+
>
200+
>@for
201+
#^^^^^^ template.blocks.ng
202+
>(let item of items; track $index) { }
203+
#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ template.blocks.ng
193204
>

0 commit comments

Comments
 (0)