From e4f8ab147b1b6beb75d5b73342c1dd8939ba2dcc Mon Sep 17 00:00:00 2001 From: cexbrayat Date: Wed, 14 Jul 2021 08:27:37 +0200 Subject: [PATCH] test: add typescript e2e test without babel Adds a test close to the setup used by the CLI in a TS project without Babel. The existing TS test was moved to `typescript-with-babel`. The new test is a copy of the older one, with all babel dependencies removed, a rewritten component using the Composition API, a test in TS, a TS config close to the CLI one, and a shim file. --- e2e/3.x/typescript-with-babel/package.json | 43 ++++++++++++++++++ .../sub-project/components/Basic.vue | 0 .../sub-project/test.js | 0 .../sub-project/tsconfig.json | 0 e2e/3.x/typescript/package.json | 21 +++------ e2e/3.x/typescript/src/components/Basic.vue | 45 +++++++++++++++++++ e2e/3.x/typescript/src/shims-vue.d.ts | 5 +++ e2e/3.x/typescript/src/test.ts | 23 ++++++++++ e2e/3.x/typescript/tsconfig.json | 24 ++++++++++ 9 files changed, 147 insertions(+), 14 deletions(-) create mode 100644 e2e/3.x/typescript-with-babel/package.json rename e2e/3.x/{typescript => typescript-with-babel}/sub-project/components/Basic.vue (100%) rename e2e/3.x/{typescript => typescript-with-babel}/sub-project/test.js (100%) rename e2e/3.x/{typescript => typescript-with-babel}/sub-project/tsconfig.json (100%) create mode 100644 e2e/3.x/typescript/src/components/Basic.vue create mode 100644 e2e/3.x/typescript/src/shims-vue.d.ts create mode 100644 e2e/3.x/typescript/src/test.ts create mode 100644 e2e/3.x/typescript/tsconfig.json diff --git a/e2e/3.x/typescript-with-babel/package.json b/e2e/3.x/typescript-with-babel/package.json new file mode 100644 index 00000000..b40c5e06 --- /dev/null +++ b/e2e/3.x/typescript-with-babel/package.json @@ -0,0 +1,43 @@ +{ + "name": "vue3-typescript-with-babel", + "version": "1.0.0", + "license": "MIT", + "private": true, + "scripts": { + "test": "jest --no-cache ./sub-project/test.js" + }, + "dependencies": { + "@vue/compiler-sfc": "^3.0.3", + "vue": "^3.0.3" + }, + "devDependencies": { + "@babel/core": "^7.9.0", + "@babel/preset-env": "^7.9.0", + "jest": "^26.0.0", + "ts-jest": "^26.4.4", + "typescript": "^4.1.2", + "vue3-jest": "^26.0.0-alpha.10" + }, + "jest": { + "testEnvironment": "jsdom", + "globals": { + "vue-jest": { + "tsConfig": "./sub-project/tsconfig.json" + } + }, + "moduleFileExtensions": [ + "js", + "json", + "vue" + ], + "transform": { + "^.+\\.js$": "babel-jest", + "^.+\\.vue$": "vue3-jest" + } + }, + "babel": { + "presets": [ + "@babel/env" + ] + } +} diff --git a/e2e/3.x/typescript/sub-project/components/Basic.vue b/e2e/3.x/typescript-with-babel/sub-project/components/Basic.vue similarity index 100% rename from e2e/3.x/typescript/sub-project/components/Basic.vue rename to e2e/3.x/typescript-with-babel/sub-project/components/Basic.vue diff --git a/e2e/3.x/typescript/sub-project/test.js b/e2e/3.x/typescript-with-babel/sub-project/test.js similarity index 100% rename from e2e/3.x/typescript/sub-project/test.js rename to e2e/3.x/typescript-with-babel/sub-project/test.js diff --git a/e2e/3.x/typescript/sub-project/tsconfig.json b/e2e/3.x/typescript-with-babel/sub-project/tsconfig.json similarity index 100% rename from e2e/3.x/typescript/sub-project/tsconfig.json rename to e2e/3.x/typescript-with-babel/sub-project/tsconfig.json diff --git a/e2e/3.x/typescript/package.json b/e2e/3.x/typescript/package.json index 293dd389..c37d9e11 100644 --- a/e2e/3.x/typescript/package.json +++ b/e2e/3.x/typescript/package.json @@ -4,39 +4,32 @@ "license": "MIT", "private": true, "scripts": { - "test": "jest --no-cache ./sub-project/test.js" + "test": "jest --no-cache ./src/test.ts" }, "dependencies": { "@vue/compiler-sfc": "^3.0.3", "vue": "^3.0.3" }, "devDependencies": { - "@babel/core": "^7.9.0", - "@babel/preset-env": "^7.9.0", + "@types/jest": "16.0.10", "jest": "^26.0.0", "ts-jest": "^26.4.4", "typescript": "^4.1.2", "vue3-jest": "^26.0.0-alpha.10" }, "jest": { - "globals": { - "vue-jest": { - "tsConfig": "./sub-project/tsconfig.json" - } - }, "moduleFileExtensions": [ "js", + "ts", "json", "vue" ], + "moduleNameMapper": { + "^@/(.*)$": "/src/$1" + }, "transform": { - "^.+\\.js$": "babel-jest", + "^.+\\.ts$": "ts-jest", "^.+\\.vue$": "vue3-jest" } - }, - "babel": { - "presets": [ - "@babel/env" - ] } } diff --git a/e2e/3.x/typescript/src/components/Basic.vue b/e2e/3.x/typescript/src/components/Basic.vue new file mode 100644 index 00000000..261c8655 --- /dev/null +++ b/e2e/3.x/typescript/src/components/Basic.vue @@ -0,0 +1,45 @@ + + + + + + + diff --git a/e2e/3.x/typescript/src/shims-vue.d.ts b/e2e/3.x/typescript/src/shims-vue.d.ts new file mode 100644 index 00000000..64c3fd9e --- /dev/null +++ b/e2e/3.x/typescript/src/shims-vue.d.ts @@ -0,0 +1,5 @@ +declare module '*.vue' { + import type { DefineComponent } from 'vue'; + const component: DefineComponent<{}, {}, any>; + export default component; +} diff --git a/e2e/3.x/typescript/src/test.ts b/e2e/3.x/typescript/src/test.ts new file mode 100644 index 00000000..d750ddc7 --- /dev/null +++ b/e2e/3.x/typescript/src/test.ts @@ -0,0 +1,23 @@ +import { createApp, h } from 'vue' + +import Basic from '@/components/Basic.vue' + +function mount(Component: any) { + document.getElementsByTagName('html')[0].innerHTML = '' + const el = document.createElement('div') + el.id = 'app' + document.body.appendChild(el) + const Parent = { + render() { + return h(Component) + } + } + createApp(Parent).mount(el) +} + +test('processes .vue files', () => { + mount(Basic) + expect(document.querySelector('h1')!.textContent).toBe( + 'Welcome to Your Vue.js App' + ) +}) diff --git a/e2e/3.x/typescript/tsconfig.json b/e2e/3.x/typescript/tsconfig.json new file mode 100644 index 00000000..2ae52c99 --- /dev/null +++ b/e2e/3.x/typescript/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "target": "es5", + "module": "esnext", + "strict": true, + "jsx": "preserve", + "importHelpers": true, + "moduleResolution": "node", + "skipLibCheck": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "useDefineForClassFields": true, + "sourceMap": true, + "baseUrl": ".", + "types": ["webpack-env", "jest"], + "paths": { + "@/*": ["src/*"] + }, + "lib": ["esnext", "dom", "dom.iterable", "scripthost"] + }, + "include": ["src/**/*.ts", "src/**/*.vue"], + "exclude": ["node_modules"] +}