chore: add snapshot

This commit is contained in:
Amour1688
2020-09-08 14:12:42 +08:00
parent 4398191f95
commit 45290ca1ee
5 changed files with 456 additions and 375 deletions

View File

@ -41,9 +41,13 @@ export default () => ({
.filter((specifier) => {
if (t.isImportSpecifier(specifier)) {
const { imported, local } = specifier;
specifierNames.add(imported.name);
return local.name !== imported.name;
} if (t.isImportNamespaceSpecifier(specifier)) {
if (local.name === imported.name) {
specifierNames.add(imported.name);
return false;
}
return true;
}
if (t.isImportNamespaceSpecifier(specifier)) {
// should keep when `import * as Vue from 'vue'`
shouldKeep = true;
}

View File

@ -0,0 +1,159 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`MereProps Order: MereProps Order 1`] = `
"import { createTextVNode, mergeProps, createVNode } from \\"vue\\";
createVNode(\\"button\\", mergeProps({
\\"loading\\": true
}, x, {
\\"type\\": \\"submit\\"
}), [createTextVNode(\\"btn\\")], 16, [\\"loading\\"]);"
`;
exports[`Merge class/ style attributes into array: Merge class/ style attributes into array 1`] = `
"import { createVNode } from \\"vue\\";
createVNode(\\"div\\", {
\\"class\\": [\\"a\\", b],
\\"style\\": [\\"color: red\\", s]
}, null, 6);"
`;
exports[`Without JSX should work: Without JSX should work 1`] = `
"import { createVNode } from 'vue';
createVNode('div', null, ['Without JSX should work']);"
`;
exports[`Without props: Without props 1`] = `
"import { createTextVNode, createVNode } from \\"vue\\";
createVNode(\\"a\\", null, [createTextVNode(\\"a\\")]);"
`;
exports[`custom directive: custom directive 1`] = `
"import { resolveComponent, resolveDirective, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(resolveComponent(\\"A\\"), null, null, 512), [[resolveDirective(\\"cus\\"), x]]);"
`;
exports[`dynamic type in input: dynamic type in input 1`] = `
"import { vModelDynamic, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"input\\", {
\\"type\\": type,
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"type\\", \\"onUpdate:modelValue\\"]), [[vModelDynamic, test]]);"
`;
exports[`input[type="checkbox"]: input[type="checkbox"] 1`] = `
"import { vModelCheckbox, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"input\\", {
\\"type\\": \\"checkbox\\",
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelCheckbox, test]]);"
`;
exports[`input[type="radio"]: input[type="radio"] 1`] = `
"import { Fragment, vModelRadio, createVNode, withDirectives } from \\"vue\\";
createVNode(Fragment, null, [withDirectives(createVNode(\\"input\\", {
\\"type\\": \\"radio\\",
\\"value\\": \\"1\\",
\\"onUpdate:modelValue\\": $event => test = $event,
\\"name\\": \\"test\\"
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelRadio, test]]), withDirectives(createVNode(\\"input\\", {
\\"type\\": \\"radio\\",
\\"value\\": \\"2\\",
\\"onUpdate:modelValue\\": $event => test = $event,
\\"name\\": \\"test\\"
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelRadio, test]])]);"
`;
exports[`input[type="text"] .lazy modifier: input[type="text"] .lazy modifier 1`] = `
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"input\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test, void 0, {
lazy: true
}]]);"
`;
exports[`input[type="text"]: input[type="text"] 1`] = `
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"input\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test]]);"
`;
exports[`reassign variable as component: reassign variable as component 1`] = `
"import { defineComponent, createVNode } from \\"vue\\";
let a = 1;
const A = defineComponent({
setup(_, {
slots
}) {
return () => createVNode(\\"span\\", null, [slots.default()]);
}
});
const _a = 1;
const __a = function () {
return a;
}();
a = createVNode(A, null, {
default: () => [__a],
_: 2
});"
`;
exports[`select: select 1`] = `
"import { createTextVNode, createVNode, vModelSelect, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"select\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, [createVNode(\\"option\\", {
\\"value\\": \\"1\\"
}, [createTextVNode(\\"a\\")]), createVNode(\\"option\\", {
\\"value\\": 2
}, [createTextVNode(\\"b\\")]), createVNode(\\"option\\", {
\\"value\\": 3
}, [createTextVNode(\\"c\\")])], 8, [\\"onUpdate:modelValue\\"]), [[vModelSelect, test]]);"
`;
exports[`should keep \`import * as Vue from "vue"\`: should keep \`import * as Vue from "vue"\` 1`] = `
"import { createTextVNode, createVNode } from \\"vue\\";
import * as Vue from 'vue';
createVNode(\\"div\\", null, [createTextVNode(\\"Vue\\")]);"
`;
exports[`single no need for a mergeProps call: single no need for a mergeProps call 1`] = `
"import { createTextVNode, createVNode } from \\"vue\\";
createVNode(\\"div\\", x, [createTextVNode(\\"single\\")], 16);"
`;
exports[`specifiers should be merged into a single importDeclaration: specifiers should be merged into a single importDeclaration 1`] = `
"import { createVNode, vShow } from \\"vue\\";
import { Fragment as _Fragment } from \\"vue\\";
createVNode(_Fragment, null, null);"
`;
exports[`textarea: textarea 1`] = `
"import { vModelText, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"textarea\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[vModelText, test]]);"
`;
exports[`v-show: v-show 1`] = `
"import { createTextVNode, vShow, createVNode, withDirectives } from \\"vue\\";
withDirectives(createVNode(\\"div\\", null, [createTextVNode(\\"vShow\\")], 512), [[vShow, x]]);"
`;
exports[`vHtml: vHtml 1`] = `
"import { createVNode } from \\"vue\\";
createVNode(\\"h1\\", {
\\"innerHTML\\": \\"<div>foo</div>\\"
}, null, 8, [\\"innerHTML\\"]);"
`;
exports[`vText: vText 1`] = `
"import { createVNode } from \\"vue\\";
createVNode(\\"div\\", {
\\"textContent\\": text
}, null, 8, [\\"textContent\\"]);"
`;

View File

@ -1,16 +0,0 @@
import * as fs from 'fs';
import * as path from 'path';
import { transformSync } from '@babel/core';
import preset from '../babel.config.js';
test('coverage', () => {
['index.test.tsx', 'v-model.test.tsx']
.forEach((filename) => {
const mainTest = fs.readFileSync(path.resolve(__dirname, `./${filename}`)).toString();
transformSync(mainTest, {
babelrc: false,
presets: [preset],
filename,
});
});
});

View File

@ -0,0 +1,144 @@
import { transform } from '@babel/core';
import JSX from '../src';
const transpile = (source: string) => new Promise((resolve, reject) => transform(
source,
{
filename: '',
presets: null,
plugins: [[JSX, { optimize: true }]],
configFile: false,
}, (error, result) => {
if (error) {
return reject(error);
}
resolve(result?.code);
},
));
const tests = [
{
name: 'input[type="checkbox"]',
from: '<input type="checkbox" v-model={test} />',
},
{
name: 'input[type="radio"]',
from: `
<>
<input type="radio" value="1" v-model={test} name="test" />
<input type="radio" value="2" v-model={test} name="test" />
</>
`,
},
{
name: 'select',
from: `
<select v-model={test}>
<option value="1">a</option>
<option value={2}>b</option>
<option value={3}>c</option>
</select>
`,
},
{
name: 'textarea',
from: '<textarea v-model={test} />',
},
{
name: 'input[type="text"]',
from: '<input v-model={test} />',
},
{
name: 'dynamic type in input',
from: '<input type={type} v-model={test} />',
},
{
name: 'v-show',
from: '<div v-show={x}>vShow</div>',
},
{
name: 'input[type="text"] .lazy modifier',
from: `
<input v-model={[test, ['lazy']]} />
`,
},
{
name: 'custom directive',
from: '<A vCus={x} />',
},
{
name: 'vHtml',
from: '<h1 v-html="<div>foo</div>"></h1>',
},
{
name: 'vText',
from: '<div v-text={text}></div>',
},
{
name: 'Without props',
from: '<a>a</a>',
},
{
name: 'MereProps Order',
from: '<button loading {...x} type="submit">btn</button>',
},
{
name: 'Merge class/ style attributes into array',
from: '<div class="a" class={b} style="color: red" style={s}></div>',
},
{
name: 'single no need for a mergeProps call',
from: '<div {...x}>single</div>',
},
{
name: 'should keep `import * as Vue from "vue"`',
from: `
import * as Vue from 'vue';
<div>Vue</div>
`,
},
{
name: 'specifiers should be merged into a single importDeclaration',
from: `
import { createVNode, Fragment as _Fragment } from 'vue';
import { vShow } from 'vue'
<_Fragment />
`,
},
{
name: 'Without JSX should work',
from: `
import { createVNode } from 'vue';
createVNode('div', null, ['Without JSX should work']);
`,
},
{
name: 'reassign variable as component',
from: `
import { defineComponent } from 'vue';
let a = 1;
const A = defineComponent({
setup(_, { slots }) {
return () => <span>{slots.default()}</span>;
},
});
const _a = 1;
a = <A>{a}</A>;
`,
},
];
tests.forEach((
{ name, from },
) => {
test(
name,
async () => {
expect(await transpile(from)).toMatchSnapshot(name);
},
);
});