Skip to content

Commit 6222a18

Browse files
committed
Fix how jsx tag and children are scoped
Fixes #161
1 parent f01053f commit 6222a18

File tree

6 files changed

+260
-90
lines changed

6 files changed

+260
-90
lines changed

TypeScriptReact.YAML-tmLanguage

Lines changed: 28 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1368,35 +1368,39 @@ repository:
13681368
patterns:
13691369
- include: '#jsx-children'
13701370

1371-
jsx-tag-open:
1372-
name: meta.tag.open.tsx
1371+
jsx-tag:
13731372
begin: >-
13741373
(?x)
13751374
(<)
13761375
([_$a-zA-Z][-$\w.]*(?<!\.|-))
13771376
(?=\s+(?!\?)|/?>)
1378-
end: (/?>)
13791377
beginCaptures:
1380-
'1': {name: punctuation.definition.tag.begin.tsx}
1381-
'2': {name: entity.name.tag.tsx}
1378+
'0': { name: meta.tag.open.tsx }
1379+
'1': { name: punctuation.definition.tag.begin.tsx }
1380+
'2': { name: entity.name.tag.tsx }
1381+
end: (/>)|(?:(</)([_$a-zA-Z][-$\w.]*(?<!\.|-))\s*(>))
13821382
endCaptures:
1383-
'1': {name: punctuation.definition.tag.end.tsx}
1384-
patterns:
1385-
- include: '#comment'
1386-
- include: '#jsx-tag-attributes'
1387-
- include: '#jsx-tag-attributes-illegal'
1388-
1389-
jsx-tag-close:
1390-
name: meta.tag.close.tsx
1391-
begin: (</)([_$a-zA-Z][-$\w.]*(?<!\.|-))
1392-
end: (>)
1393-
beginCaptures:
1394-
'1': {name: punctuation.definition.tag.begin.tsx}
1395-
'2': {name: entity.name.tag.tsx}
1396-
endCaptures:
1397-
'1': {name: punctuation.definition.tag.end.tsx}
1398-
patterns:
1399-
- include: '#comment'
1383+
'0': { name: meta.tag.close.tsx }
1384+
'1': { name: punctuation.definition.tag.end.tsx }
1385+
'2': { name: punctuation.definition.tag.begin.tsx }
1386+
'3': { name: entity.name.tag.tsx }
1387+
'4': { name: punctuation.definition.tag.end.tsx }
1388+
patterns:
1389+
- name: meta.tag.open.tsx
1390+
begin: \G
1391+
end: (?=[/]?>)
1392+
patterns:
1393+
- include: '#comment'
1394+
- include: '#jsx-tag-attributes'
1395+
- include: '#jsx-tag-attributes-illegal'
1396+
- begin: (>)
1397+
beginCaptures:
1398+
'0': { name: meta.tag.open.tsx }
1399+
'1': { name: punctuation.definition.tag.end.tsx }
1400+
end: (?=</)
1401+
contentName: meta.jsx.children.tsx
1402+
patterns:
1403+
- include: '#jsx-children'
14001404

14011405
jsx-tag-invalid:
14021406
name: invalid.illegal.tag.incomplete.tsx
@@ -1405,8 +1409,7 @@ repository:
14051409
jsx-children:
14061410
patterns:
14071411
- include: '#jsx-tag-without-attributes'
1408-
- include: '#jsx-tag-open'
1409-
- include: '#jsx-tag-close'
1412+
- include: '#jsx-tag'
14101413
- include: '#jsx-tag-invalid'
14111414
- include: '#jsx-evaluated-code'
14121415
- include: '#jsx-entities'
@@ -1415,14 +1418,7 @@ repository:
14151418
name: meta.jsx.tsx
14161419
patterns:
14171420
- include: '#jsx-tag-without-attributes'
1418-
- include: '#jsx-tag-open'
1419-
- include: '#jsx-tag-close'
1421+
- include: '#jsx-tag'
14201422
- include: '#jsx-tag-invalid'
14211423

1422-
- name: meta.jsx.children.tsx
1423-
begin: (?<=(?:'|"|})>)
1424-
end: (?=</)
1425-
patterns:
1426-
- include: '#jsx-children'
1427-
14281424
...

TypeScriptReact.tmLanguage

Lines changed: 112 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1877,31 +1877,12 @@
18771877
</dict>
18781878
<dict>
18791879
<key>include</key>
1880-
<string>#jsx-tag-open</string>
1881-
</dict>
1882-
<dict>
1883-
<key>include</key>
1884-
<string>#jsx-tag-close</string>
1880+
<string>#jsx-tag</string>
18851881
</dict>
18861882
<dict>
18871883
<key>include</key>
18881884
<string>#jsx-tag-invalid</string>
18891885
</dict>
1890-
<dict>
1891-
<key>begin</key>
1892-
<string>(?&lt;=(?:'|"|})&gt;)</string>
1893-
<key>end</key>
1894-
<string>(?=&lt;/)</string>
1895-
<key>name</key>
1896-
<string>meta.jsx.children.tsx</string>
1897-
<key>patterns</key>
1898-
<array>
1899-
<dict>
1900-
<key>include</key>
1901-
<string>#jsx-children</string>
1902-
</dict>
1903-
</array>
1904-
</dict>
19051886
</array>
19061887
</dict>
19071888
<key>jsx-attributeValue-entities</key>
@@ -1945,11 +1926,7 @@
19451926
</dict>
19461927
<dict>
19471928
<key>include</key>
1948-
<string>#jsx-tag-open</string>
1949-
</dict>
1950-
<dict>
1951-
<key>include</key>
1952-
<string>#jsx-tag-close</string>
1929+
<string>#jsx-tag</string>
19531930
</dict>
19541931
<dict>
19551932
<key>include</key>
@@ -2092,6 +2069,116 @@
20922069
</dict>
20932070
</array>
20942071
</dict>
2072+
<key>jsx-tag</key>
2073+
<dict>
2074+
<key>begin</key>
2075+
<string>(?x)
2076+
(&lt;)
2077+
([_$a-zA-Z][-$\w.]*(?&lt;!\.|-))
2078+
(?=\s+(?!\?)|/?&gt;)</string>
2079+
<key>beginCaptures</key>
2080+
<dict>
2081+
<key>0</key>
2082+
<dict>
2083+
<key>name</key>
2084+
<string>meta.tag.open.tsx</string>
2085+
</dict>
2086+
<key>1</key>
2087+
<dict>
2088+
<key>name</key>
2089+
<string>punctuation.definition.tag.begin.tsx</string>
2090+
</dict>
2091+
<key>2</key>
2092+
<dict>
2093+
<key>name</key>
2094+
<string>entity.name.tag.tsx</string>
2095+
</dict>
2096+
</dict>
2097+
<key>end</key>
2098+
<string>(/&gt;)|(?:(&lt;/)([_$a-zA-Z][-$\w.]*(?&lt;!\.|-))\s*(&gt;))</string>
2099+
<key>endCaptures</key>
2100+
<dict>
2101+
<key>0</key>
2102+
<dict>
2103+
<key>name</key>
2104+
<string>meta.tag.close.tsx</string>
2105+
</dict>
2106+
<key>1</key>
2107+
<dict>
2108+
<key>name</key>
2109+
<string>punctuation.definition.tag.end.tsx</string>
2110+
</dict>
2111+
<key>2</key>
2112+
<dict>
2113+
<key>name</key>
2114+
<string>punctuation.definition.tag.begin.tsx</string>
2115+
</dict>
2116+
<key>3</key>
2117+
<dict>
2118+
<key>name</key>
2119+
<string>entity.name.tag.tsx</string>
2120+
</dict>
2121+
<key>4</key>
2122+
<dict>
2123+
<key>name</key>
2124+
<string>punctuation.definition.tag.end.tsx</string>
2125+
</dict>
2126+
</dict>
2127+
<key>patterns</key>
2128+
<array>
2129+
<dict>
2130+
<key>begin</key>
2131+
<string>\G</string>
2132+
<key>end</key>
2133+
<string>(?=[/]?&gt;)</string>
2134+
<key>name</key>
2135+
<string>meta.tag.open.tsx</string>
2136+
<key>patterns</key>
2137+
<array>
2138+
<dict>
2139+
<key>include</key>
2140+
<string>#comment</string>
2141+
</dict>
2142+
<dict>
2143+
<key>include</key>
2144+
<string>#jsx-tag-attributes</string>
2145+
</dict>
2146+
<dict>
2147+
<key>include</key>
2148+
<string>#jsx-tag-attributes-illegal</string>
2149+
</dict>
2150+
</array>
2151+
</dict>
2152+
<dict>
2153+
<key>begin</key>
2154+
<string>(&gt;)</string>
2155+
<key>beginCaptures</key>
2156+
<dict>
2157+
<key>0</key>
2158+
<dict>
2159+
<key>name</key>
2160+
<string>meta.tag.open.tsx</string>
2161+
</dict>
2162+
<key>1</key>
2163+
<dict>
2164+
<key>name</key>
2165+
<string>punctuation.definition.tag.end.tsx</string>
2166+
</dict>
2167+
</dict>
2168+
<key>contentName</key>
2169+
<string>meta.jsx.children.tsx</string>
2170+
<key>end</key>
2171+
<string>(?=&lt;/)</string>
2172+
<key>patterns</key>
2173+
<array>
2174+
<dict>
2175+
<key>include</key>
2176+
<string>#jsx-children</string>
2177+
</dict>
2178+
</array>
2179+
</dict>
2180+
</array>
2181+
</dict>
20952182
<key>jsx-tag-attribute-assignment</key>
20962183
<dict>
20972184
<key>match</key>
@@ -2201,29 +2288,8 @@
22012288
(&lt;)
22022289
([_$a-zA-Z][-$\w.]*(?&lt;!\.|-))
22032290
(?=\s+(?!\?)|/?&gt;)</string>
2204-
<key>beginCaptures</key>
2205-
<dict>
2206-
<key>1</key>
2207-
<dict>
2208-
<key>name</key>
2209-
<string>punctuation.definition.tag.begin.tsx</string>
2210-
</dict>
2211-
<key>2</key>
2212-
<dict>
2213-
<key>name</key>
2214-
<string>entity.name.tag.tsx</string>
2215-
</dict>
2216-
</dict>
22172291
<key>end</key>
22182292
<string>(/?&gt;)</string>
2219-
<key>endCaptures</key>
2220-
<dict>
2221-
<key>1</key>
2222-
<dict>
2223-
<key>name</key>
2224-
<string>punctuation.definition.tag.end.tsx</string>
2225-
</dict>
2226-
</dict>
22272293
<key>name</key>
22282294
<string>meta.tag.open.tsx</string>
22292295
<key>patterns</key>

tests/baselines/Issue161.baseline.txt

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
original file
2+
-----------------------------------
3+
let root: React.ReactElement<{}>;
4+
let page: PageName;
5+
if (isViaPage) {
6+
root = <ViaView/>;
7+
page = 'via';
8+
}
9+
-----------------------------------
10+
11+
>let root: React.ReactElement<{}>;
12+
^^^
13+
source.tsx meta.var.expr.tsx storage.type.tsx
14+
^
15+
source.tsx meta.var.expr.tsx
16+
^^^^
17+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx variable.other.readwrite.tsx
18+
^
19+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx
20+
^
21+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx
22+
^^^^^
23+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx entity.name.type.module.tsx
24+
^
25+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx punctuation.accessor.tsx
26+
^^^^^^^^^^^^
27+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx meta.type.parameters.tsx entity.name.type.tsx
28+
^
29+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx meta.type.parameters.tsx punctuation.definition.typeparameters.begin.tsx
30+
^
31+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx meta.type.parameters.tsx meta.object.type.tsx punctuation.definition.block.tsx
32+
^
33+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx meta.type.parameters.tsx meta.object.type.tsx punctuation.definition.block.tsx
34+
^
35+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx meta.type.parameters.tsx punctuation.definition.typeparameters.end.tsx
36+
^^^
37+
source.tsx
38+
>let page: PageName;
39+
^^^
40+
source.tsx meta.var.expr.tsx storage.type.tsx
41+
^
42+
source.tsx meta.var.expr.tsx
43+
^^^^
44+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx variable.other.readwrite.tsx
45+
^
46+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx
47+
^
48+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx
49+
^^^^^^^^
50+
source.tsx meta.var.expr.tsx meta.var-single-variable.expr.tsx meta.type.annotation.tsx entity.name.type.tsx
51+
^^^
52+
source.tsx
53+
>if (isViaPage) {
54+
^^
55+
source.tsx keyword.control.conditional.tsx
56+
^
57+
source.tsx
58+
^
59+
source.tsx meta.brace.round.tsx
60+
^^^^^^^^^
61+
source.tsx
62+
^
63+
source.tsx meta.brace.round.tsx
64+
^
65+
source.tsx
66+
^
67+
source.tsx meta.block.tsx punctuation.definition.block.tsx
68+
^^
69+
source.tsx meta.block.tsx
70+
> root = <ViaView/>;
71+
^^^^^^^
72+
source.tsx meta.block.tsx
73+
^
74+
source.tsx meta.block.tsx keyword.operator.assignment.tsx
75+
^
76+
source.tsx meta.block.tsx
77+
^
78+
source.tsx meta.block.tsx meta.tag.open.tsx punctuation.definition.tag.begin.tsx
79+
^^^^^^^
80+
source.tsx meta.block.tsx meta.tag.open.tsx entity.name.tag.tsx
81+
^^
82+
source.tsx meta.block.tsx meta.tag.close.tsx punctuation.definition.tag.end.tsx
83+
^^^
84+
source.tsx meta.block.tsx
85+
> page = 'via';
86+
^^^^^^^
87+
source.tsx meta.block.tsx
88+
^
89+
source.tsx meta.block.tsx keyword.operator.assignment.tsx
90+
^
91+
source.tsx meta.block.tsx
92+
^
93+
source.tsx meta.block.tsx string.quoted.single.tsx punctuation.definition.string.begin.tsx
94+
^^^
95+
source.tsx meta.block.tsx string.quoted.single.tsx
96+
^
97+
source.tsx meta.block.tsx string.quoted.single.tsx punctuation.definition.string.end.tsx
98+
^^^
99+
source.tsx meta.block.tsx
100+
>}
101+
^
102+
source.tsx meta.block.tsx punctuation.definition.block.tsx

0 commit comments

Comments
 (0)