Skip to content

Commit 45290ca

Browse files
Amour1688Amour1688
committed
chore: add snapshot
1 parent 4398191 commit 45290ca

File tree

5 files changed

+456
-375
lines changed

5 files changed

+456
-375
lines changed

‎packages/babel-plugin-jsx/src/index.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,9 +41,13 @@ export default () => ({
4141
.filter((specifier) => {
4242
if (t.isImportSpecifier(specifier)) {
4343
const { imported, local } = specifier;
44-
specifierNames.add(imported.name);
45-
return local.name !== imported.name;
46-
} if (t.isImportNamespaceSpecifier(specifier)) {
44+
if (local.name === imported.name) {
45+
specifierNames.add(imported.name);
46+
return false;
47+
}
48+
return true;
49+
}
50+
if (t.isImportNamespaceSpecifier(specifier)) {
4751
// should keep when `import * as Vue from 'vue'`
4852
shouldKeep = true;
4953
}

‎packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap

Lines changed: 159 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,159 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`MereProps Order: MereProps Order 1`] = `
4+
"import { createTextVNode, mergeProps, createVNode } from \\"vue\\";
5+
createVNode(\\"button\\", mergeProps({
6+
\\"loading\\": true
7+
}, x, {
8+
\\"type\\": \\"submit\\"
9+
}), [createTextVNode(\\"btn\\")], 16, [\\"loading\\"]);"
10+
`;
11+
12+
exports[`Merge class/ style attributes into array: Merge class/ style attributes into array 1`] = `
13+
"import { createVNode } from \\"vue\\";
14+
createVNode(\\"div\\", {
15+
\\"class\\": [\\"a\\", b],
16+
\\"style\\": [\\"color: red\\", s]
17+
}, null, 6);"
18+
`;
19+
20+
exports[`Without JSX should work: Without JSX should work 1`] = `
21+
"import { createVNode } from 'vue';
22+
createVNode('div', null, ['Without JSX should work']);"
23+
`;
24+
25+
exports[`Without props: Without props 1`] = `
26+
"import { createTextVNode, createVNode } from \\"vue\\";
27+
createVNode(\\"a\\", null, [createTextVNode(\\"a\\")]);"
28+
`;
29+
30+
exports[`custom directive: custom directive 1`] = `
31+
"import { resolveComponent, resolveDirective, createVNode, withDirectives } from \\"vue\\";
32+
withDirectives(createVNode(resolveComponent(\\"A\\"), null, null, 512), [[resolveDirective(\\"cus\\"), x]]);"
33+
`;
34+
35+
exports[`dynamic type in input: dynamic type in input 1`] = `
36+
"import { vModelDynamic, createVNode, withDirectives } from \\"vue\\";
37+
withDirectives(createVNode(\\"input\\", {
38+
\\"type\\": type,
39+
\\"onUpdate:modelValue\\": $event => test = $event
40+
}, null, 8, [\\"type\\", \\"onUpdate:modelValue\\"]), [[vModelDynamic, test]]);"
41+
`;
42+
43+
exports[`input[type="checkbox"]: input[type="checkbox"] 1`] = `
44+
"import { vModelCheckbox, createVNode, withDirectives } from \\"vue\\";
45+
withDirectives(createVNode(\\"input\\", {
46+
\\"type\\": \\"checkbox\\",
47+
\\"onUpdate:modelValue\\": $event => test = $event
48+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelCheckbox, test]]);"
49+
`;
50+
51+
exports[`input[type="radio"]: input[type="radio"] 1`] = `
52+
"import { Fragment, vModelRadio, createVNode, withDirectives } from \\"vue\\";
53+
createVNode(Fragment, null, [withDirectives(createVNode(\\"input\\", {
54+
\\"type\\": \\"radio\\",
55+
\\"value\\": \\"1\\",
56+
\\"onUpdate:modelValue\\": $event => test = $event,
57+
\\"name\\": \\"test\\"
58+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelRadio, test]]), withDirectives(createVNode(\\"input\\", {
59+
\\"type\\": \\"radio\\",
60+
\\"value\\": \\"2\\",
61+
\\"onUpdate:modelValue\\": $event => test = $event,
62+
\\"name\\": \\"test\\"
63+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelRadio, test]])]);"
64+
`;
65+
66+
exports[`input[type="text"] .lazy modifier: input[type="text"] .lazy modifier 1`] = `
67+
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
68+
withDirectives(createVNode(\\"input\\", {
69+
\\"onUpdate:modelValue\\": $event => test = $event
70+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test, void 0, {
71+
lazy: true
72+
}]]);"
73+
`;
74+
75+
exports[`input[type="text"]: input[type="text"] 1`] = `
76+
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
77+
withDirectives(createVNode(\\"input\\", {
78+
\\"onUpdate:modelValue\\": $event => test = $event
79+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test]]);"
80+
`;
81+
82+
exports[`reassign variable as component: reassign variable as component 1`] = `
83+
"import { defineComponent, createVNode } from \\"vue\\";
84+
let a = 1;
85+
const A = defineComponent({
86+
setup(_, {
87+
slots
88+
}) {
89+
return () => createVNode(\\"span\\", null, [slots.default()]);
90+
}
91+
92+
});
93+
const _a = 1;
94+
95+
const __a = function () {
96+
return a;
97+
}();
98+
99+
a = createVNode(A, null, {
100+
default: () => [__a],
101+
_: 2
102+
});"
103+
`;
104+
105+
exports[`select: select 1`] = `
106+
"import { createTextVNode, createVNode, vModelSelect, withDirectives } from \\"vue\\";
107+
withDirectives(createVNode(\\"select\\", {
108+
\\"onUpdate:modelValue\\": $event => test = $event
109+
}, [createVNode(\\"option\\", {
110+
\\"value\\": \\"1\\"
111+
}, [createTextVNode(\\"a\\")]), createVNode(\\"option\\", {
112+
\\"value\\": 2
113+
}, [createTextVNode(\\"b\\")]), createVNode(\\"option\\", {
114+
\\"value\\": 3
115+
}, [createTextVNode(\\"c\\")])], 8, [\\"onUpdate:modelValue\\"]), [[vModelSelect, test]]);"
116+
`;
117+
118+
exports[`should keep \`import * as Vue from "vue"\`: should keep \`import * as Vue from "vue"\` 1`] = `
119+
"import { createTextVNode, createVNode } from \\"vue\\";
120+
import * as Vue from 'vue';
121+
createVNode(\\"div\\", null, [createTextVNode(\\"Vue\\")]);"
122+
`;
123+
124+
exports[`single no need for a mergeProps call: single no need for a mergeProps call 1`] = `
125+
"import { createTextVNode, createVNode } from \\"vue\\";
126+
createVNode(\\"div\\", x, [createTextVNode(\\"single\\")], 16);"
127+
`;
128+
129+
exports[`specifiers should be merged into a single importDeclaration: specifiers should be merged into a single importDeclaration 1`] = `
130+
"import { createVNode, vShow } from \\"vue\\";
131+
import { Fragment as _Fragment } from \\"vue\\";
132+
createVNode(_Fragment, null, null);"
133+
`;
134+
135+
exports[`textarea: textarea 1`] = `
136+
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
137+
withDirectives(createVNode(\\"textarea\\", {
138+
\\"onUpdate:modelValue\\": $event => test = $event
139+
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test]]);"
140+
`;
141+
142+
exports[`v-show: v-show 1`] = `
143+
"import { createTextVNode, vShow, createVNode, withDirectives } from \\"vue\\";
144+
withDirectives(createVNode(\\"div\\", null, [createTextVNode(\\"vShow\\")], 512), [[vShow, x]]);"
145+
`;
146+
147+
exports[`vHtml: vHtml 1`] = `
148+
"import { createVNode } from \\"vue\\";
149+
createVNode(\\"h1\\", {
150+
\\"innerHTML\\": \\"<div>foo</div>\\"
151+
}, null, 8, [\\"innerHTML\\"]);"
152+
`;
153+
154+
exports[`vText: vText 1`] = `
155+
"import { createVNode } from \\"vue\\";
156+
createVNode(\\"div\\", {
157+
\\"textContent\\": text
158+
}, null, 8, [\\"textContent\\"]);"
159+
`;

‎packages/babel-plugin-jsx/test/coverage.test.ts

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎packages/babel-plugin-jsx/test/snapshot.test.ts

Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
import { transform } from '@babel/core';
2+
import JSX from '../src';
3+
4+
const transpile = (source: string) => new Promise((resolve, reject) => transform(
5+
source,
6+
{
7+
filename: '',
8+
presets: null,
9+
plugins: [[JSX, { optimize: true }]],
10+
configFile: false,
11+
}, (error, result) => {
12+
if (error) {
13+
return reject(error);
14+
}
15+
resolve(result?.code);
16+
},
17+
));
18+
19+
const tests = [
20+
{
21+
name: 'input[type="checkbox"]',
22+
from: '<input type="checkbox" v-model={test} />',
23+
},
24+
{
25+
name: 'input[type="radio"]',
26+
from: `
27+
<>
28+
<input type="radio" value="1" v-model={test} name="test" />
29+
<input type="radio" value="2" v-model={test} name="test" />
30+
</>
31+
`,
32+
},
33+
{
34+
name: 'select',
35+
from: `
36+
<select v-model={test}>
37+
<option value="1">a</option>
38+
<option value={2}>b</option>
39+
<option value={3}>c</option>
40+
</select>
41+
`,
42+
},
43+
{
44+
name: 'textarea',
45+
from: '<textarea v-model={test} />',
46+
},
47+
{
48+
name: 'input[type="text"]',
49+
from: '<input v-model={test} />',
50+
},
51+
{
52+
name: 'dynamic type in input',
53+
from: '<input type={type} v-model={test} />',
54+
},
55+
{
56+
name: 'v-show',
57+
from: '<div v-show={x}>vShow</div>',
58+
},
59+
{
60+
name: 'input[type="text"] .lazy modifier',
61+
from: `
62+
<input v-model={[test, ['lazy']]} />
63+
`,
64+
},
65+
{
66+
name: 'custom directive',
67+
from: '<A vCus={x} />',
68+
},
69+
{
70+
name: 'vHtml',
71+
from: '<h1 v-html="<div>foo</div>"></h1>',
72+
},
73+
{
74+
name: 'vText',
75+
from: '<div v-text={text}></div>',
76+
},
77+
{
78+
name: 'Without props',
79+
from: '<a>a</a>',
80+
},
81+
{
82+
name: 'MereProps Order',
83+
from: '<button loading {...x} type="submit">btn</button>',
84+
},
85+
{
86+
name: 'Merge class/ style attributes into array',
87+
from: '<div class="a" class={b} style="color: red" style={s}></div>',
88+
},
89+
{
90+
name: 'single no need for a mergeProps call',
91+
from: '<div {...x}>single</div>',
92+
},
93+
{
94+
name: 'should keep `import * as Vue from "vue"`',
95+
from: `
96+
import * as Vue from 'vue';
97+
98+
<div>Vue</div>
99+
`,
100+
},
101+
{
102+
name: 'specifiers should be merged into a single importDeclaration',
103+
from: `
104+
import { createVNode, Fragment as _Fragment } from 'vue';
105+
import { vShow } from 'vue'
106+
107+
<_Fragment />
108+
`,
109+
},
110+
{
111+
name: 'Without JSX should work',
112+
from: `
113+
import { createVNode } from 'vue';
114+
createVNode('div', null, ['Without JSX should work']);
115+
`,
116+
},
117+
{
118+
name: 'reassign variable as component',
119+
from: `
120+
import { defineComponent } from 'vue';
121+
let a = 1;
122+
const A = defineComponent({
123+
setup(_, { slots }) {
124+
return () => <span>{slots.default()}</span>;
125+
},
126+
});
127+
128+
const _a = 1;
129+
130+
a = <A>{a}</A>;
131+
`,
132+
},
133+
];
134+
135+
tests.forEach((
136+
{ name, from },
137+
) => {
138+
test(
139+
name,
140+
async () => {
141+
expect(await transpile(from)).toMatchSnapshot(name);
142+
},
143+
);
144+
});

0 commit comments

Comments
 (0)