From 1ab6a179b2b566447a3214fc41887356d421a4b7 Mon Sep 17 00:00:00 2001 From: Ryota Watanabe <43837308+wattanx@users.noreply.github.com> Date: Fri, 10 May 2024 22:19:28 +0900 Subject: [PATCH] refactor(vue-script-setup-converter): change to inline snapshot (#55) * test: change to inline snapshot * test: change to inline snapshot * test: change to inline snapshot * test: change to inline snapshot * test: change to inline snapshot --- .../src/lib/converter/emitsConverter.test.ts | 38 ++--- .../importDeclarationConverter.test.ts | 21 +-- .../lib/converter/pageMetaConverter.test.ts | 35 ++--- .../src/lib/converter/propsConverter.test.ts | 140 +++++++----------- .../src/lib/converter/setupConverter.test.ts | 19 +-- 5 files changed, 91 insertions(+), 162 deletions(-) diff --git a/packages/vue-script-setup-converter/src/lib/converter/emitsConverter.test.ts b/packages/vue-script-setup-converter/src/lib/converter/emitsConverter.test.ts index 4b5f0af..2d373c8 100644 --- a/packages/vue-script-setup-converter/src/lib/converter/emitsConverter.test.ts +++ b/packages/vue-script-setup-converter/src/lib/converter/emitsConverter.test.ts @@ -1,8 +1,6 @@ import { expect, test } from "vitest"; import { CallExpression, ScriptTarget, SyntaxKind, Project } from "ts-morph"; import { parse } from "@vue/compiler-sfc"; -import prettier from "prettier"; -import parserTypeScript from "prettier/parser-typescript"; import { getNodeByKind } from "../helpers/node"; import { convertEmits } from "./emitsConverter"; @@ -24,12 +22,7 @@ const parseScript = (input: string, lang: "js" | "ts" = "js") => { const emits = convertEmits(callexpression as CallExpression, lang); - const formatedText = prettier.format(emits, { - parser: "typescript", - plugins: [parserTypeScript], - }); - - return formatedText; + return emits; }; const source = ``; const output = parseScript(source, "ts"); - const expected = `const emit = defineEmits<{ (e: "change", value: number): void }>(); -`; - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot( + `"const emit = defineEmits<{(e: 'change', value: number): void}>();"` + ); }); test("string array", () => { @@ -101,7 +93,9 @@ export default defineComponent({ const expected = `const emit = defineEmits(["change"]); `; - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot( + `"const emit = defineEmits(['change']);"` + ); }); test("validation", () => { @@ -125,11 +119,9 @@ export default defineComponent({ `; const output = parseScript(source, "ts"); - const expected = `const emit = defineEmits({ - change: (value: number) => { - return value !== 0; - }, -}); -`; - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "const emit = defineEmits({change: (value: number) => { + return value !== 0; + }});" + `); }); diff --git a/packages/vue-script-setup-converter/src/lib/converter/importDeclarationConverter.test.ts b/packages/vue-script-setup-converter/src/lib/converter/importDeclarationConverter.test.ts index 58acd52..bde6ca2 100644 --- a/packages/vue-script-setup-converter/src/lib/converter/importDeclarationConverter.test.ts +++ b/packages/vue-script-setup-converter/src/lib/converter/importDeclarationConverter.test.ts @@ -1,8 +1,6 @@ import { expect, describe, it } from "vitest"; import { ScriptTarget, Project } from "ts-morph"; import { parse } from "@vue/compiler-sfc"; -import prettier from "prettier"; -import parserTypeScript from "prettier/parser-typescript"; import { convertImportDeclaration } from "./importDeclarationConverter"; const parseScript = (input: string) => { @@ -20,12 +18,7 @@ const parseScript = (input: string) => { const sourceFile = project.createSourceFile("s.tsx", script?.content ?? ""); const convertedImportDeclarationText = convertImportDeclaration(sourceFile); - const formatedText = prettier.format(convertedImportDeclarationText, { - parser: "typescript", - plugins: [parserTypeScript], - }); - - return formatedText; + return convertedImportDeclarationText; }; describe("convertImportDeclaration", () => { @@ -40,9 +33,8 @@ describe("convertImportDeclaration", () => { it("returns import declaration text removed defineComponent", () => { const output = parseScript(source); - const expected = 'import { ref } from "vue";\n'; - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(`"import { ref } from 'vue';"`); }); }); @@ -57,9 +49,8 @@ describe("convertImportDeclaration", () => { it("returns blank", () => { const output = parseScript(source); - const expected = ""; - expect(output).toBe(expected); + expect(output).toBe(""); }); }); @@ -74,9 +65,8 @@ describe("convertImportDeclaration", () => { it("returns import declaration text removed defineNuxtComponent", () => { const output = parseScript(source); - const expected = 'import { ref } from "#imports";\n'; - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(`"import { ref } from '#imports';"`); }); }); @@ -91,9 +81,8 @@ describe("convertImportDeclaration", () => { it("returns blank", () => { const output = parseScript(source); - const expected = ""; - expect(output).toBe(expected); + expect(output).toBe(""); }); }); }); diff --git a/packages/vue-script-setup-converter/src/lib/converter/pageMetaConverter.test.ts b/packages/vue-script-setup-converter/src/lib/converter/pageMetaConverter.test.ts index a63815d..2b056ac 100644 --- a/packages/vue-script-setup-converter/src/lib/converter/pageMetaConverter.test.ts +++ b/packages/vue-script-setup-converter/src/lib/converter/pageMetaConverter.test.ts @@ -1,8 +1,6 @@ import { expect, describe, it } from "vitest"; import { CallExpression, ScriptTarget, SyntaxKind, Project } from "ts-morph"; import { parse } from "@vue/compiler-sfc"; -import prettier from "prettier"; -import parserTypeScript from "prettier/parser-typescript"; import { getNodeByKind } from "../helpers/node"; import { convertPageMeta } from "./pageMetaConverter"; @@ -24,12 +22,7 @@ const parseScript = (input: string, lang: "js" | "ts" = "js") => { const pageMeta = convertPageMeta(callExpression as CallExpression, lang); - const formatedText = prettier.format(pageMeta, { - parser: "typescript", - plugins: [parserTypeScript], - }); - - return formatedText; + return pageMeta; }; describe("convertPageMeta", () => { @@ -47,14 +40,11 @@ describe("convertPageMeta", () => { it("returns text including definePageMeta", () => { const output = parseScript(source); - const expected = `definePageMeta({ - name: "HelloWorld", - layout: "test-layout", - middleware: "test-middleware", -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "definePageMeta({ + name: 'HelloWorld',layout: 'test-layout',middleware: 'test-middleware' + });" + `); }); }); @@ -72,14 +62,11 @@ describe("convertPageMeta", () => { it("returns text including definePageMeta", () => { const output = parseScript(source); - const expected = `definePageMeta({ - name: "HelloWorld", - layout: "test-layout", - middleware: ["test-middleware-1", "test-middleware-2"], -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "definePageMeta({ + name: 'HelloWorld',layout: 'test-layout',middleware: ['test-middleware-1', 'test-middleware-2'] + });" + `); }); }); }); diff --git a/packages/vue-script-setup-converter/src/lib/converter/propsConverter.test.ts b/packages/vue-script-setup-converter/src/lib/converter/propsConverter.test.ts index 524a484..a98940a 100644 --- a/packages/vue-script-setup-converter/src/lib/converter/propsConverter.test.ts +++ b/packages/vue-script-setup-converter/src/lib/converter/propsConverter.test.ts @@ -1,8 +1,6 @@ import { expect, describe, it } from "vitest"; import { CallExpression, ScriptTarget, SyntaxKind, Project } from "ts-morph"; import { parse } from "@vue/compiler-sfc"; -import prettier from "prettier"; -import parserTypeScript from "prettier/parser-typescript"; import { getNodeByKind } from "../helpers/node"; import { convertProps } from "./propsConverter"; @@ -24,12 +22,7 @@ const parseScript = (input: string, lang: "js" | "ts" = "js") => { const props = convertProps(callexpression as CallExpression, lang); - const formatedText = prettier.format(props, { - parser: "typescript", - plugins: [parserTypeScript], - }); - - return formatedText; + return props; }; const source = ``; const output = parseScript(source); - const expected = `const props = defineProps({ - msg: { - type: String, - default: "HelloWorld", - }, - foo: { - type: String, - required: true, - validator(value) { - return ["success", "warning", "danger"].includes(value); - }, - }, -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "const props = defineProps({msg: { + type: String, + default: 'HelloWorld' + },foo: { + type: String, + required: true, + validator(value) { + return ["success", "warning", "danger"].includes(value) + } + }});" + `); }); }); @@ -143,11 +127,10 @@ describe("type-based", () => { `; const output = parseScript(source, "ts"); - const expected = `type Props = { msg?: string; foo: string }; -const props = withDefaults(defineProps(), { msg: "HelloWorld" }); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {msg?: string; + foo: string;};const props = withDefaults(defineProps(), { msg: 'HelloWorld' });" + `); }); it("default function", () => { @@ -174,14 +157,10 @@ const props = withDefaults(defineProps(), { msg: "HelloWorld" }); `; const output = parseScript(source, "ts"); - const expected = `type Props = { foo?: { msg: string }; bar?: string[] }; -const props = withDefaults(defineProps(), { - foo: () => ({ msg: "Hello World" }), - bar: () => ["foo", "bar"], -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {foo?: { msg: string; }; + bar?: string[];};const props = withDefaults(defineProps(), { foo: () => ({ msg: "Hello World" }),bar: () => (["foo", "bar"]) });" + `); }); it("default arrow function", () => { @@ -204,14 +183,10 @@ const props = withDefaults(defineProps(), { `; const output = parseScript(source, "ts"); - const expected = `type Props = { foo?: { msg: string }; bar?: string[] }; -const props = withDefaults(defineProps(), { - foo: () => ({ msg: "Hello World" }), - bar: () => ["foo", "bar"], -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {foo?: { msg: string; }; + bar?: string[];};const props = withDefaults(defineProps(), { foo: () => ({ msg: "Hello World" }),bar: () => ["foo", "bar"] });" + `); }); it("default arrow function and return", () => { @@ -238,14 +213,10 @@ const props = withDefaults(defineProps(), { `; const output = parseScript(source, "ts"); - const expected = `type Props = { foo?: { msg: string }; bar?: string[] }; -const props = withDefaults(defineProps(), { - foo: () => ({ msg: "Hello World" }), - bar: () => ["foo", "bar"], -}); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {foo?: { msg: string; }; + bar?: string[];};const props = withDefaults(defineProps(), { foo: () => ({ msg: "Hello World" }),bar: () => (["foo", "bar"]) });" + `); }); it("non primitive", () => { @@ -269,11 +240,10 @@ const props = withDefaults(defineProps(), { `; const output = parseScript(source, "ts"); - const expected = `type Props = { foo: Foo; items: string[] }; -const props = defineProps(); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {foo: Foo; + items: string[];};const props = defineProps();" + `); }); it("non Object style", () => { @@ -291,11 +261,10 @@ const props = defineProps(); `; const output = parseScript(source, "ts"); - const expected = `type Props = { msg?: string; foo?: Foo }; -const props = defineProps(); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {msg?: string; + foo?: Foo;};const props = defineProps();" + `); }); it("default value is boolean", () => { @@ -318,10 +287,9 @@ const props = defineProps(); `; const output = parseScript(source, "ts"); - const expected = `type Props = { msg: string; disabled?: boolean }; -const props = withDefaults(defineProps(), { disabled: false }); -`; - - expect(output).toBe(expected); + expect(output).toMatchInlineSnapshot(` + "type Props = {msg: string; + disabled?: boolean;};const props = withDefaults(defineProps(), { disabled: false });" + `); }); }); diff --git a/packages/vue-script-setup-converter/src/lib/converter/setupConverter.test.ts b/packages/vue-script-setup-converter/src/lib/converter/setupConverter.test.ts index c62f26e..fa4cfa7 100644 --- a/packages/vue-script-setup-converter/src/lib/converter/setupConverter.test.ts +++ b/packages/vue-script-setup-converter/src/lib/converter/setupConverter.test.ts @@ -2,8 +2,6 @@ import { convertSetup } from "./setupConverter"; import { expect, test } from "vitest"; import { CallExpression, ScriptTarget, SyntaxKind, Project } from "ts-morph"; import { parse } from "@vue/compiler-sfc"; -import prettier from "prettier"; -import parserTypeScript from "prettier/parser-typescript"; import optionsApi from "../../samples/composition-api.txt?raw"; import { getNodeByKind } from "../helpers/node"; @@ -25,16 +23,11 @@ test("setup statements", () => { const statement = convertSetup(callexpression as CallExpression); - const formatedText = prettier.format(statement, { - parser: "typescript", - plugins: [parserTypeScript], - }); - - const expected = `const { msg, foo } = toRefs(props); -const newMsg = computed(() => msg.value + "- HelloWorld"); - -const count = ref(0); -`; + expect(statement).toMatchInlineSnapshot(` + " + const { msg, foo } = toRefs(props); + const newMsg = computed(() => msg.value + '- HelloWorld'); - expect(formatedText).toBe(expected); + const count = ref(0);" + `); });