test: add tests for Vue 2 (#3351)

Co-authored-by: Johnson Chu <[email protected]>

Author: rchl

packages/vue-test-workspace-vue-2/package.json

@@ -0,0 +1,10 @@
+{
+	"private": true,
+	"name": "@volar/vue-test-workspace-vue-2",
+	"version": "1.0.0",
+	"license": "MIT",
+	"devDependencies": {
+		"vue": "^2.7.14",
+		"vue-component-type-helpers": "1.8.3"
+	}
+}

packages/vue-test-workspace-vue-2/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "lib": [
+            "esnext",
+            "dom"
+        ],
+        "strict": true,
+        "noUncheckedIndexedAccess": true,
+        "noUnusedLocals": true,
+        "noUnusedParameters": true,
+        "skipLibCheck": true,
+        "allowJs": true,
+        "jsx": "preserve",
+    },
+    "include": [
+        "**/*"
+    ]
+}

packages/vue-test-workspace-vue-2/vue-tsc/shared.ts

@@ -0,0 +1,10 @@
+// https://stackoverflow.com/a/53808212
+type IfEquals<T, U, Y = unknown, N = never> =
+	(<G>() => G extends T ? 1 : 2) extends
+	(<G>() => G extends U ? 1 : 2) ? Y : N;
+export declare function exactType<T, U>(draft: T & IfEquals<T, U>, expected: U & IfEquals<T, U>): IfEquals<T, U>;
+
+// https://stackoverflow.com/a/49928360
+type IfNotAny<T> = 0 extends 1 & T ? never : T;
+type IfNotUndefined<T> = Exclude<T, undefined> extends never ? never : T;
+export declare function isNotAnyOrUndefined<T>(value: IfNotAny<IfNotUndefined<T>>): void;

packages/vue-test-workspace-vue-2/vue-tsc/strict-template/intrinsicProps/main.vue

@@ -0,0 +1,19 @@
+<template>
+	<div>
+		<!-- FIXME: bug here -->
+		<!-- @vue-expect-error -->
+		<Foo class="123"></Foo>
+		<div class="123"></div>
+	</div>
+</template>
+<script lang="ts">
+import { defineComponent } from 'vue';
+
+const Foo = defineComponent({
+	props: {
+		foo: String
+	}
+});
+</script>
+<script setup lang="ts">
+</script>

packages/vue-test-workspace-vue-2/vue-tsc/strict-template/tsconfig.json

@@ -0,0 +1,7 @@
+{
+	"extends": "../tsconfig.base.json",
+	"vueCompilerOptions": {
+		"strictTemplates": true
+	},
+	"include": ["**/*"]
+}

packages/vue-test-workspace-vue-2/vue-tsc/strict-template/unknownProp/main.vue

@@ -0,0 +1,21 @@
+<template>
+	<div>
+		<!-- @vue-expect-error -->
+		<Foo bar="123"></Foo>
+
+		<!-- @vue-expect-error -->
+		<div foo="123"></div>
+	</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+
+const Foo = defineComponent({
+	props: {
+		foo: String
+	}
+});
+</script>
+<script setup lang="ts">
+</script>

packages/vue-test-workspace-vue-2/vue-tsc/tsconfig.base.json

@@ -0,0 +1,12 @@
+{
+	"extends": "../tsconfig.json",
+	"compilerOptions": {
+		"noPropertyAccessFromIndexSignature": true,
+	},
+	"vueCompilerOptions": {
+		"target": 2.7,
+		"jsxSlots": true,
+		"plugins": ["../../vue-language-plugin-pug"]
+	},
+	"include": []
+}

packages/vue-test-workspace/vue-tsc/strict-template/intrinsicProps/main.vue

@@ -0,0 +1,15 @@
+<template>
+	<Foo class="123"></Foo>
+
+	<div class="123"></div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from 'vue';
+
+const Foo = defineComponent({
+	props: {
+		foo: String
+	}
+});
+</script>

packages/vue-tsc/tests/index.spec.ts

@@ -4,15 +4,17 @@ import { describe, it } from 'vitest';
 import { fork } from 'child_process';
 
 const binPath = require.resolve('../bin/vue-tsc.js');
-const workspace = path.resolve(__dirname, '../../vue-test-workspace/vue-tsc');
+
+const workspaceVue3 = path.resolve(__dirname, '../../vue-test-workspace/vue-tsc');
+const workspaceVue2 = path.resolve(__dirname, '../../vue-test-workspace-vue-2/vue-tsc');
 
 function prettyPath(path: string, isRoot: boolean) {
 	const segments = path.split('/');
 	return !isRoot ? segments.slice(segments.length - 2, segments.length).join('/') : segments[segments.length - 1];
 }
 
-function collectTests(dir: string, depth = 2, isRoot: boolean = true): [string, boolean][] {
-	const tests: [string, boolean][] = [];
+function collectTests(dir: string, depth = 2, isRoot: boolean = true): [filePath: string, isRoot: boolean][] {
+	const tests: [filePath: string, isRoot: boolean][]  = [];
 
 	if (depth <= 0) {
 		return tests;
@@ -37,7 +39,8 @@ function collectTests(dir: string, depth = 2, isRoot: boolean = true): [string,
 	return tests;
 }
 
-const tests = collectTests(workspace);
+const testsVue3 = collectTests(workspaceVue3);
+const testsVue2 = collectTests(workspaceVue2);
 
 function runVueTsc(cwd: string) {
 	return new Promise((resolve, reject) => {
@@ -70,7 +73,13 @@ function runVueTsc(cwd: string) {
 }
 
 describe(`vue-tsc`, () => {
-	for (const [path, isRoot] of tests) {
+	for (const [path, isRoot] of testsVue3) {
+		it(`vue-tsc no errors (${prettyPath(path, isRoot)})`, () => runVueTsc(path), 40_000);
+	}
+});
+
+describe(`vue-tsc (vue 2)`, () => {
+	for (const [path, isRoot] of testsVue2) {
 		it(`vue-tsc no errors (${prettyPath(path, isRoot)})`, () => runVueTsc(path), 40_000);
 	}
 });