Skip to content

Commit 28739e4

Browse files
a-stewartatscott
andauthored
Experiments injecting bindings into meta.tag separately (#1993)
* fix(syntaxes): Do not highlight bindings outside element tags Currently we inject all the syntaxes into text.html, causing #1725 Rather than doing this, we should separate this into two injects, one injecting interpolation into the base html, and another which injects bindings, but only into meta.tag. fixes #1725 * fixup! fix(syntaxes): Do not highlight bindings outside element tags --------- Co-authored-by: Andrew Scott <[email protected]>
1 parent 49ebaca commit 28739e4

17 files changed

+1166
-1170
lines changed

.aspect/rules/external_repository_action_cache/npm_translate_lock_LTE4Nzc1MDcwNjU=

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,5 @@
44
.npmrc=974837034
55
pnpm-lock.yaml=1983086970
66
yarn.lock=-1186674637
7-
package.json=836271005
7+
package.json=-1401673343
88
pnpm-workspace.yaml=1711114604

package.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,14 @@
185185
"expression.ng": "javascript"
186186
}
187187
},
188+
{
189+
"path": "./syntaxes/template-tag.json",
190+
"scopeName": "template.tag.ng",
191+
"injectTo": [
192+
"text.html.derivative",
193+
"source.ts"
194+
]
195+
},
188196
{
189197
"path": "./syntaxes/expression.json",
190198
"scopeName": "expression.ng"

syntaxes/BUILD.bazel

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ js_run_binary(
1414
"_inline-template.json",
1515
"_template.json",
1616
"_template-blocks.json",
17+
"_template-tag.json",
1718
]
1819
)
1920

@@ -25,6 +26,7 @@ write_source_files(
2526
"inline-template.json": "_inline-template.json",
2627
"template.json": "_template.json",
2728
"template-blocks.json": "_template-blocks.json",
29+
"template-tag.json": "_template-tag.json",
2830
}
2931
)
3032

syntaxes/src/build.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import {InlineStyles} from './inline-styles';
1313
import {InlineTemplate} from './inline-template';
1414
import {Template} from './template';
1515
import {TemplateBlocks} from './template-blocks';
16+
import {TemplateTag} from './template-tag';
1617
import {GrammarDefinition, JsonObject} from './types';
1718

1819
// Recursively transforms a TypeScript grammar definition into an object which can be processed by
@@ -55,3 +56,4 @@ build(Template, 'template');
5556
build(InlineTemplate, 'inline-template');
5657
build(InlineStyles, 'inline-styles');
5758
build(TemplateBlocks, 'template-blocks');
59+
build(TemplateTag, 'template-tag');

syntaxes/src/template-tag.ts

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
/**
2+
* @license
3+
* Copyright Google Inc. All Rights Reserved.
4+
*
5+
* Use of this source code is governed by an MIT-style license that can be
6+
* found in the LICENSE file at https://angular.io/license
7+
*/
8+
9+
import {GrammarDefinition} from './types';
10+
11+
export const TemplateTag: GrammarDefinition = {
12+
scopeName: 'template.tag.ng',
13+
injectionSelector: 'L:text.html#meta.tag -comment',
14+
patterns: [
15+
{include: '#propertyBinding'},
16+
{include: '#eventBinding'},
17+
{include: '#twoWayBinding'},
18+
{include: '#templateBinding'},
19+
],
20+
repository: {
21+
22+
propertyBinding: {
23+
begin: /(\[\s*@?[-_a-zA-Z0-9.$]*%?\s*])(=)(["'])/,
24+
beginCaptures: {
25+
1: {
26+
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.property.html',
27+
patterns: [
28+
{include: '#bindingKey'},
29+
],
30+
},
31+
2: {name: 'punctuation.separator.key-value.html'},
32+
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
33+
},
34+
end: /\3/,
35+
endCaptures: {
36+
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
37+
},
38+
name: 'meta.ng-binding.property.html',
39+
contentName: 'expression.ng',
40+
patterns: [
41+
{include: 'expression.ng'},
42+
],
43+
},
44+
45+
eventBinding: {
46+
begin: /(\(\s*@?[-_a-zA-Z0-9.$]*\s*\))(=)(["'])/,
47+
beginCaptures: {
48+
1: {
49+
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.event.html',
50+
patterns: [
51+
{include: '#bindingKey'},
52+
],
53+
},
54+
2: {name: 'punctuation.separator.key-value.html'},
55+
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
56+
},
57+
end: /\3/,
58+
endCaptures: {
59+
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
60+
},
61+
name: 'meta.ng-binding.event.html',
62+
contentName: 'expression.ng',
63+
patterns: [
64+
{include: 'expression.ng'},
65+
],
66+
},
67+
68+
twoWayBinding: {
69+
begin: /(\[\s*\(\s*@?[-_a-zA-Z0-9.$]*\s*\)\s*\])(=)(["'])/,
70+
beginCaptures: {
71+
1: {
72+
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.two-way.html',
73+
patterns: [
74+
{include: '#bindingKey'},
75+
],
76+
},
77+
2: {name: 'punctuation.separator.key-value.html'},
78+
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
79+
},
80+
end: /\3/,
81+
endCaptures: {
82+
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
83+
},
84+
name: 'meta.ng-binding.two-way.html',
85+
contentName: 'expression.ng',
86+
patterns: [
87+
{include: 'expression.ng'},
88+
],
89+
},
90+
91+
templateBinding: {
92+
begin: /(\*[-_a-zA-Z0-9.$]*)(=)(["'])/,
93+
beginCaptures: {
94+
1: {
95+
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.template.html',
96+
patterns: [
97+
{include: '#bindingKey'},
98+
],
99+
},
100+
2: {name: 'punctuation.separator.key-value.html'},
101+
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
102+
},
103+
end: /\3/,
104+
endCaptures: {
105+
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
106+
},
107+
name: 'meta.ng-binding.template.html',
108+
contentName: 'expression.ng',
109+
patterns: [
110+
{include: 'expression.ng'},
111+
],
112+
},
113+
114+
bindingKey: {
115+
patterns: [
116+
{
117+
match: /([\[\(]{1,2}|\*)(?:\s*)(@?[-_a-zA-Z0-9.$]*%?)(?:\s*)([\]\)]{1,2})?/,
118+
captures: {
119+
1: {name: 'punctuation.definition.ng-binding-name.begin.html'},
120+
2: {
121+
name: 'entity.other.ng-binding-name.$2.html',
122+
patterns: [
123+
{
124+
match: /\./,
125+
name: 'punctuation.accessor.html',
126+
},
127+
],
128+
},
129+
3: {name: 'punctuation.definition.ng-binding-name.end.html'},
130+
},
131+
},
132+
],
133+
},
134+
},
135+
};

syntaxes/src/template.ts

Lines changed: 0 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,6 @@ export const Template: GrammarDefinition = {
1313
injectionSelector: 'L:text.html -comment',
1414
patterns: [
1515
{include: '#interpolation'},
16-
{include: '#propertyBinding'},
17-
{include: '#eventBinding'},
18-
{include: '#twoWayBinding'},
19-
{include: '#templateBinding'},
2016
],
2117
repository: {
2218

@@ -35,117 +31,5 @@ export const Template: GrammarDefinition = {
3531
],
3632
},
3733

38-
propertyBinding: {
39-
begin: /(\[\s*@?[-_a-zA-Z0-9.$]*%?\s*])(=)(["'])/,
40-
beginCaptures: {
41-
1: {
42-
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.property.html',
43-
patterns: [
44-
{include: '#bindingKey'},
45-
],
46-
},
47-
2: {name: 'punctuation.separator.key-value.html'},
48-
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
49-
},
50-
end: /\3/,
51-
endCaptures: {
52-
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
53-
},
54-
name: 'meta.ng-binding.property.html',
55-
contentName: 'expression.ng',
56-
patterns: [
57-
{include: 'expression.ng'},
58-
],
59-
},
60-
61-
eventBinding: {
62-
begin: /(\(\s*@?[-_a-zA-Z0-9.$]*\s*\))(=)(["'])/,
63-
beginCaptures: {
64-
1: {
65-
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.event.html',
66-
patterns: [
67-
{include: '#bindingKey'},
68-
],
69-
},
70-
2: {name: 'punctuation.separator.key-value.html'},
71-
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
72-
},
73-
end: /\3/,
74-
endCaptures: {
75-
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
76-
},
77-
name: 'meta.ng-binding.event.html',
78-
contentName: 'expression.ng',
79-
patterns: [
80-
{include: 'expression.ng'},
81-
],
82-
},
83-
84-
twoWayBinding: {
85-
begin: /(\[\s*\(\s*@?[-_a-zA-Z0-9.$]*\s*\)\s*\])(=)(["'])/,
86-
beginCaptures: {
87-
1: {
88-
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.two-way.html',
89-
patterns: [
90-
{include: '#bindingKey'},
91-
],
92-
},
93-
2: {name: 'punctuation.separator.key-value.html'},
94-
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
95-
},
96-
end: /\3/,
97-
endCaptures: {
98-
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
99-
},
100-
name: 'meta.ng-binding.two-way.html',
101-
contentName: 'expression.ng',
102-
patterns: [
103-
{include: 'expression.ng'},
104-
],
105-
},
106-
107-
templateBinding: {
108-
begin: /(\*[-_a-zA-Z0-9.$]*)(=)(["'])/,
109-
beginCaptures: {
110-
1: {
111-
name: 'entity.other.attribute-name.html entity.other.ng-binding-name.template.html',
112-
patterns: [
113-
{include: '#bindingKey'},
114-
],
115-
},
116-
2: {name: 'punctuation.separator.key-value.html'},
117-
3: {name: 'string.quoted.html punctuation.definition.string.begin.html'},
118-
},
119-
end: /\3/,
120-
endCaptures: {
121-
0: {name: 'string.quoted.html punctuation.definition.string.end.html'},
122-
},
123-
name: 'meta.ng-binding.template.html',
124-
contentName: 'expression.ng',
125-
patterns: [
126-
{include: 'expression.ng'},
127-
],
128-
},
129-
130-
bindingKey: {
131-
patterns: [
132-
{
133-
match: /([\[\(]{1,2}|\*)(?:\s*)(@?[-_a-zA-Z0-9.$]*%?)(?:\s*)([\]\)]{1,2})?/,
134-
captures: {
135-
1: {name: 'punctuation.definition.ng-binding-name.begin.html'},
136-
2: {
137-
name: 'entity.other.ng-binding-name.$2.html',
138-
patterns: [
139-
{
140-
match: /\./,
141-
name: 'punctuation.accessor.html',
142-
},
143-
],
144-
},
145-
3: {name: 'punctuation.definition.ng-binding-name.end.html'},
146-
},
147-
},
148-
],
149-
},
15034
},
15135
};

0 commit comments

Comments
 (0)