From ab37418924933073e37e6ac420ef5d7d3ce1f1f1 Mon Sep 17 00:00:00 2001
From: Sasan Farrokh <s.farrokh@alibaba.ir>
Date: Sat, 4 Sep 2021 00:51:45 +0430
Subject: [PATCH 1/2] feat: add compilerOptions to vue-jest global options

---
 packages/vue3-jest/lib/process.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/vue3-jest/lib/process.js b/packages/vue3-jest/lib/process.js
index 1ab1b62d..bd1113a7 100644
--- a/packages/vue3-jest/lib/process.js
+++ b/packages/vue3-jest/lib/process.js
@@ -93,7 +93,8 @@ function processTemplate(descriptor, filename, config) {
     preprocessOptions: vueJestConfig[template.lang],
     compilerOptions: {
       bindingMetadata: bindings,
-      mode: 'module'
+      mode: 'module',
+      ...vueJestConfig.compilerOptions
     }
   })
 

From 469b3ddccef2d643e075307e0ab484f149e74a19 Mon Sep 17 00:00:00 2001
From: Sasan Farrokh <s.farrokh@alibaba.ir>
Date: Fri, 10 Sep 2021 20:10:05 +0430
Subject: [PATCH 2/2] test(compilerOptions): ensure compilerOptions is passed
 down

---
 .../basic/components/CompilerDirective.vue    |  5 ++++
 e2e/3.x/basic/jest.config.js                  | 26 +++++++++++++++++++
 e2e/3.x/basic/package.json                    | 24 -----------------
 e2e/3.x/basic/test.js                         | 12 ++++++++-
 e2e/3.x/basic/v-test-directive.js             |  3 +++
 5 files changed, 45 insertions(+), 25 deletions(-)
 create mode 100644 e2e/3.x/basic/components/CompilerDirective.vue
 create mode 100644 e2e/3.x/basic/jest.config.js
 create mode 100644 e2e/3.x/basic/v-test-directive.js

diff --git a/e2e/3.x/basic/components/CompilerDirective.vue b/e2e/3.x/basic/components/CompilerDirective.vue
new file mode 100644
index 00000000..9ae9a9a2
--- /dev/null
+++ b/e2e/3.x/basic/components/CompilerDirective.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <h1 class="header" v-test="'value'">Hello</h1>
+  </div>
+</template>
diff --git a/e2e/3.x/basic/jest.config.js b/e2e/3.x/basic/jest.config.js
new file mode 100644
index 00000000..4552a185
--- /dev/null
+++ b/e2e/3.x/basic/jest.config.js
@@ -0,0 +1,26 @@
+const vTestDirective = require('./v-test-directive')
+
+module.exports = {
+  testEnvironment: 'jsdom',
+  moduleFileExtensions: ['js', 'json', 'vue', 'ts'],
+  transform: {
+    '^.+\\.ts$': 'ts-jest',
+    '^.+\\.js$': 'babel-jest',
+    '^.+\\.vue$': '@vue/vue3-jest'
+  },
+  moduleNameMapper: {
+    '^~?__styles/(.*)$': '<rootDir>/components/styles/$1'
+  },
+  globals: {
+    'vue-jest': {
+      pug: {
+        basedir: './'
+      },
+      compilerOptions: {
+        directiveTransforms: {
+          test: vTestDirective
+        }
+      }
+    }
+  }
+}
diff --git a/e2e/3.x/basic/package.json b/e2e/3.x/basic/package.json
index 396de908..0b61dc60 100644
--- a/e2e/3.x/basic/package.json
+++ b/e2e/3.x/basic/package.json
@@ -25,29 +25,5 @@
     "vue-class-component": "^8.0.0-beta.4",
     "@vue/vue3-jest": "^27.0.0-alpha.1",
     "vue-property-decorator": "^10.0.0-rc.3"
-  },
-  "jest": {
-    "testEnvironment": "jsdom",
-    "moduleFileExtensions": [
-      "js",
-      "json",
-      "vue",
-      "ts"
-    ],
-    "transform": {
-      "^.+\\.ts$": "ts-jest",
-      "^.+\\.js$": "babel-jest",
-      "^.+\\.vue$": "@vue/vue3-jest"
-    },
-    "moduleNameMapper": {
-      "^~?__styles/(.*)$": "<rootDir>/components/styles/$1"
-    },
-    "globals": {
-      "vue-jest": {
-        "pug": {
-          "basedir": "./"
-        }
-      }
-    }
   }
 }
diff --git a/e2e/3.x/basic/test.js b/e2e/3.x/basic/test.js
index 20aaf06d..c79f4cef 100644
--- a/e2e/3.x/basic/test.js
+++ b/e2e/3.x/basic/test.js
@@ -21,6 +21,7 @@ import PugRelative from './components/PugRelativeExtends.vue'
 import { randomExport } from './components/NamedExport.vue'
 import ScriptSetup from './components/ScriptSetup.vue'
 import FunctionalRenderFn from './components/FunctionalRenderFn.vue'
+import CompilerDirective from './components/CompilerDirective.vue'
 
 // TODO: JSX for Vue 3? TSX?
 import Jsx from './components/Jsx.vue'
@@ -35,7 +36,9 @@ function mount(Component, props, slots) {
       return h(Component, props, slots)
     }
   }
-  createApp(Parent).mount(el)
+  const app = createApp(Parent)
+  app.directive('test', el => el.setAttribute('data-test', 'value'))
+  app.mount(el)
 }
 
 test('supports <script setup>', () => {
@@ -190,3 +193,10 @@ test('processes functional component exported as function', () => {
   expect(elem).toBeTruthy()
   expect(elem.innerHTML).toBe('Nyan')
 })
+
+test('ensure compilerOptions is passed down', () => {
+  mount(CompilerDirective)
+
+  const elm = document.querySelector('h1')
+  expect(elm.hasAttribute('data-test')).toBe(false)
+})
diff --git a/e2e/3.x/basic/v-test-directive.js b/e2e/3.x/basic/v-test-directive.js
new file mode 100644
index 00000000..27bfba4a
--- /dev/null
+++ b/e2e/3.x/basic/v-test-directive.js
@@ -0,0 +1,3 @@
+module.exports = (dir, node, ...args) => {
+  return { needRuntime: false, props: [] }
+}