diff --git a/e2e/3.x/custom-transformers/components/Scss.vue b/e2e/3.x/custom-transformers/components/Scss.vue
index 6b88eb24..474edea9 100644
--- a/e2e/3.x/custom-transformers/components/Scss.vue
+++ b/e2e/3.x/custom-transformers/components/Scss.vue
@@ -1,7 +1,7 @@
-
-
+
+
diff --git a/e2e/3.x/custom-transformers/package.json b/e2e/3.x/custom-transformers/package.json
index 19dc6d07..5d570b25 100644
--- a/e2e/3.x/custom-transformers/package.json
+++ b/e2e/3.x/custom-transformers/package.json
@@ -13,6 +13,7 @@
"devDependencies": {
"@babel/core": "^7.9.0",
"@babel/preset-env": "^7.9.0",
+ "@vue/test-utils": "^2.0.0-rc.10",
"babel-jest": "^27.0.0",
"extract-from-css": "^0.4.4",
"jest": "^27.0.0",
@@ -22,6 +23,7 @@
"vue3-jest": "^27.0.0-alpha.1"
},
"jest": {
+ "testEnvironment": "jsdom",
"moduleFileExtensions": [
"js",
"json",
diff --git a/e2e/3.x/custom-transformers/test.js b/e2e/3.x/custom-transformers/test.js
index 406e7d6c..8794fe21 100644
--- a/e2e/3.x/custom-transformers/test.js
+++ b/e2e/3.x/custom-transformers/test.js
@@ -1,21 +1,15 @@
-// import { createApp, h } from 'vue'
-
-// import Scss from './components/Scss.vue'
-
-// function mount(Component, props, slots) {
-// document.getElementsByTagName('html')[0].innerHTML = ''
-// const el = document.createElement('div')
-// el.id = 'app'
-// document.body.appendChild(el)
-// const Parent = {
-// render() {
-// return h(Component, props, slots)
-// }
-// }
-// createApp(Parent).mount(el)
-// }
-
-// TODO: Figure this out with Vue 3. `$style` no longer exists.
-test.todo('processes SCSS using user specified post transforms')
-
-test.todo('processes SCSS using user specified pre transforms')
+import { mount } from '@vue/test-utils'
+import Scss from './components/Scss.vue'
+
+test('processes SCSS using user specified post transforms', () => {
+ const wrapper = mount(Scss)
+ expect(wrapper.vm.$style.light.a).toBeUndefined()
+ expect(wrapper.vm.$style.light.f).toEqual('f')
+ expect(wrapper.vm.$style.dark.f).toEqual('f')
+ expect(wrapper.vm.$style.dark.g).toEqual('g')
+})
+
+test('processes SCSS using user specified pre transforms', () => {
+ const wrapper = mount(Scss)
+ expect(wrapper.vm.$style.g).toEqual('g')
+})
diff --git a/e2e/3.x/style/components/External.vue b/e2e/3.x/style/components/External.vue
index 90b1df56..55fd7ae4 100644
--- a/e2e/3.x/style/components/External.vue
+++ b/e2e/3.x/style/components/External.vue
@@ -6,6 +6,10 @@
+
+
+
+