Skip to content

Commit 60a9e7f

Browse files
occar421occar421
committed
Add failing tests with computed property name
1 parent 7a28eab commit 60a9e7f

File tree

5 files changed

+334
-34
lines changed

5 files changed

+334
-34
lines changed

‎test/emotion.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ describe('javascript tests', () => {
1616
code = code.toString();
1717

1818
expect(document.toString()).to.equal(code);
19-
expect(document.nodes).to.lengthOf(4);
19+
expect(document.nodes).to.lengthOf(5);
2020

2121
document.nodes.forEach((root) => {
2222
expect(root.last.toString()).to.be.a('string');
@@ -51,7 +51,7 @@ describe('javascript tests', () => {
5151
code = code.toString();
5252

5353
expect(document.toString()).to.equal(code);
54-
expect(document.nodes).to.lengthOf(6);
54+
expect(document.nodes).to.lengthOf(7);
5555

5656
document.nodes.forEach((root) => {
5757
expect(root.last.toString()).to.be.a('string');

‎test/fixtures/emotion-10.jsx‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,18 @@ const SomeComponent = styled.div`
88
background-color: ${props => props.color};
99
`;
1010

11+
const YetAnotherComponent = styled.p(
12+
{
13+
backgroundColor: "black",
14+
}
15+
);
16+
1117
const AnotherComponent = styled.h1(
1218
{
1319
color: "hotpink",
20+
[YetAnotherComponent]: {
21+
color: "white",
22+
},
1423
},
1524
props => ({ flex: props.flex })
1625
);
@@ -28,6 +37,7 @@ render(
2837
}}>
2938
Some other text.
3039
</span>
40+
<YetAnotherComponent>Yet another text.</YetAnotherComponent>
3141
</AnotherComponent>
3242
</SomeComponent>
3343
);

‎test/fixtures/emotion-10.jsx.json‎

Lines changed: 160 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -112,6 +112,81 @@
112112
"syntax": {}
113113
},
114114
"type": "root",
115+
"nodes": [
116+
{
117+
"raws": {
118+
"after": "\n\t",
119+
"semicolon": true,
120+
"before": "\t"
121+
},
122+
"type": "object",
123+
"nodes": [
124+
{
125+
"raws": {
126+
"prop": {
127+
"prefix": "",
128+
"suffix": "",
129+
"raw": "backgroundColor",
130+
"value": "background-color"
131+
},
132+
"value": {
133+
"prefix": "\"",
134+
"suffix": "\"",
135+
"raw": "black",
136+
"value": "black"
137+
},
138+
"between": ": ",
139+
"before": "\n\t\t"
140+
},
141+
"prop": "background-color",
142+
"value": "black",
143+
"type": "decl",
144+
"source": {
145+
"input": {
146+
"file": "emotion-10.jsx"
147+
},
148+
"start": {
149+
"line": 13,
150+
"column": 2
151+
},
152+
"end": {
153+
"line": 13,
154+
"column": 26
155+
}
156+
}
157+
}
158+
],
159+
"source": {
160+
"input": {
161+
"file": "emotion-10.jsx"
162+
},
163+
"start": {
164+
"line": 12,
165+
"column": 1
166+
},
167+
"end": {
168+
"line": 14,
169+
"column": 2
170+
}
171+
}
172+
}
173+
]
174+
},
175+
{
176+
"raws": {},
177+
"source": {
178+
"input": {
179+
"file": "emotion-10.jsx"
180+
},
181+
"start": {
182+
"line": 18,
183+
"column": 1
184+
},
185+
"inline": false,
186+
"lang": "object-literal",
187+
"syntax": {}
188+
},
189+
"type": "root",
115190
"nodes": [
116191
{
117192
"raws": {
@@ -146,26 +221,91 @@
146221
"file": "emotion-10.jsx"
147222
},
148223
"start": {
149-
"line": 13,
224+
"line": 19,
150225
"column": 2
151226
},
152227
"end": {
153-
"line": 13,
228+
"line": 19,
154229
"column": 18
155230
}
156231
}
232+
},
233+
{
234+
"raws": {
235+
"selector": {
236+
"prefix": "[",
237+
"suffix": "]",
238+
"raw": "YetAnotherComponent",
239+
"value": "YetAnotherComponent"
240+
},
241+
"between": ": ",
242+
"after": "\n\t\t",
243+
"semicolon": true,
244+
"before": "\n\t\t"
245+
},
246+
"selector": "YetAnotherComponent",
247+
"type": "rule",
248+
"nodes": [
249+
{
250+
"raws": {
251+
"prop": {
252+
"prefix": "",
253+
"suffix": "",
254+
"raw": "color",
255+
"value": "color"
256+
},
257+
"value": {
258+
"prefix": "\"",
259+
"suffix": "\"",
260+
"raw": "white",
261+
"value": "white"
262+
},
263+
"between": ": ",
264+
"before": "\n\t\t\t"
265+
},
266+
"prop": "color",
267+
"value": "white",
268+
"type": "decl",
269+
"source": {
270+
"input": {
271+
"file": "emotion-10.jsx"
272+
},
273+
"start": {
274+
"line": 21,
275+
"column": 3
276+
},
277+
"end": {
278+
"line": 21,
279+
"column": 17
280+
}
281+
}
282+
}
283+
],
284+
"source": {
285+
"input": {
286+
"file": "emotion-10.jsx"
287+
},
288+
"start": {
289+
"line": 20,
290+
"column": 2
291+
},
292+
"end": {
293+
"line": 22,
294+
"column": 3
295+
}
296+
}
157297
}
158298
],
159299
"source": {
160300
"input": {
161301
"file": "emotion-10.jsx"
162302
},
163303
"start": {
164-
"line": 12,
304+
"line": 18,
165305
"column": 1
166306
},
167307
"end": {
168-
"line": 14,
308+
"line": 23,
169309
"column": 2
170310
}
171311
}
@@ -179,7 +319,7 @@
179319
"file": "emotion-10.jsx"
180320
},
181321
"start": {
182-
"line": 15,
322+
"line": 24,
183323
"column": 11
184324
},
185325
"inline": false,
@@ -221,11 +361,11 @@
221361
"file": "emotion-10.jsx"
222362
},
223363
"start": {
224-
"line": 15,
364+
"line": 24,
225365
"column": 13
226366
},
227367
"end": {
228-
"line": 15,
368+
"line": 24,
229369
"column": 29
230370
}
231371
}
@@ -236,11 +376,11 @@
236376
"file": "emotion-10.jsx"
237377
},
238378
"start": {
239-
"line": 15,
379+
"line": 24,
240380
"column": 11
241381
},
242382
"end": {
243-
"line": 15,
383+
"line": 24,
244384
"column": 31
245385
}
246386
}
@@ -262,14 +402,14 @@
262402
"type": "decl",
263403
"source": {
264404
"start": {
265-
"line": 22,
405+
"line": 31,
266406
"column": 5
267407
},
268408
"input": {
269409
"file": "emotion-10.jsx"
270410
},
271411
"end": {
272-
"line": 22,
412+
"line": 31,
273413
"column": 22
274414
}
275415
},
@@ -282,7 +422,7 @@
282422
"file": "emotion-10.jsx"
283423
},
284424
"start": {
285-
"line": 21,
425+
"line": 30,
286426
"column": 19
287427
},
288428
"inline": false,
@@ -297,7 +437,7 @@
297437
"file": "emotion-10.jsx"
298438
},
299439
"start": {
300-
"line": 26,
440+
"line": 35,
301441
"column": 14
302442
},
303443
"inline": false,
@@ -339,11 +479,11 @@
339479
"file": "emotion-10.jsx"
340480
},
341481
"start": {
342-
"line": 27,
482+
"line": 36,
343483
"column": 4
344484
},
345485
"end": {
346-
"line": 27,
486+
"line": 36,
347487
"column": 23
348488
}
349489
}
@@ -354,11 +494,11 @@
354494
"file": "emotion-10.jsx"
355495
},
356496
"start": {
357-
"line": 26,
497+
"line": 35,
358498
"column": 14
359499
},
360500
"end": {
361-
"line": 28,
501+
"line": 37,
362502
"column": 4
363503
}
364504
}
@@ -380,14 +520,14 @@
380520
"type": "decl",
381521
"source": {
382522
"start": {
383-
"line": 36,
523+
"line": 46,
384524
"column": 2
385525
},
386526
"input": {
387527
"file": "emotion-10.jsx"
388528
},
389529
"end": {
390-
"line": 36,
530+
"line": 46,
391531
"column": 22
392532
}
393533
},
@@ -400,7 +540,7 @@
400540
"file": "emotion-10.jsx"
401541
},
402542
"start": {
403-
"line": 35,
543+
"line": 45,
404544
"column": 21
405545
},
406546
"inline": false,

‎test/fixtures/react-emotion.jsx‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,18 @@ const SomeComponent = styled("div")`
66
background-color: ${props => props.color};
77
`;
88

9+
const YetAnotherComponent = styled.p(
10+
{
11+
backgroundColor: "black",
12+
},
13+
);
14+
915
const AnotherComponent = styled("h1")(
1016
{
1117
color: "hotpink",
18+
[YetAnotherComponent]: {
19+
color: "white",
20+
},
1221
},
1322
props => ({ flex: props.flex })
1423
);
@@ -18,6 +27,7 @@ render(
1827
<AnotherComponent flex={1}>
1928
Some text.
2029
</AnotherComponent>
30+
<YetAnotherComponent>Yet another text.</YetAnotherComponent>
2131
</SomeComponent>
2232
);
2333
const app = document.getElementById("root");

0 commit comments

Comments
 (0)