From 86fdc58e1d7077197fe82110eb6b5155311c498d Mon Sep 17 00:00:00 2001 From: Justin Helmer Date: Tue, 2 Oct 2018 19:25:05 -0700 Subject: [PATCH] fix: update to support new @vue/test-utils --- package.json | 4 ++-- test/FunctionalSFC.spec.js | 9 ++++----- test/FunctionalSFCParent.spec.js | 2 +- test/NoScript.spec.js | 2 +- test/RenderFunction.spec.js | 4 ++-- test/TypeScript.spec.js | 6 +++--- test/coffee.spec.js | 10 +++++----- test/css.spec.js | 4 ++-- test/jade.spec.js | 4 ++-- test/less.spec.js | 6 +++--- test/postcss.spec.js | 6 +++--- test/pug.spec.js | 4 ++-- test/sass.spec.js | 14 +++++++------- test/scss.spec.js | 14 +++++++------- test/stylus.spec.js | 6 +++--- 15 files changed, 47 insertions(+), 48 deletions(-) diff --git a/package.json b/package.json index d81a412d..1275d912 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "author": "Edd Yerburgh", "license": "MIT", "devDependencies": { + "@vue/test-utils": "^1.0.0-beta.25", "babel-core": "^6.25.0", "babel-jest": "^20.0.3", "babel-plugin-istanbul": "^4.1.4", @@ -49,8 +50,7 @@ "stylus": "^0.54.5", "typescript": "^2.5.2", "vue": "^2.4.2", - "vue-template-compiler": "^2.4.2", - "vue-test-utils": "git+https://github.com/vuejs/vue-test-utils.git" + "vue-template-compiler": "^2.4.2" }, "peerDependencies": { "babel-core": "^6.25.0 || ^7.0.0-0", diff --git a/test/FunctionalSFC.spec.js b/test/FunctionalSFC.spec.js index 5f3f21c1..3631ceed 100644 --- a/test/FunctionalSFC.spec.js +++ b/test/FunctionalSFC.spec.js @@ -1,10 +1,10 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import FunctionalSFC from './resources/FunctionalSFC.vue' let wrapper const clickSpy = jest.fn() beforeEach(() => { - wrapper = shallow(FunctionalSFC, { + wrapper = shallowMount(FunctionalSFC, { context: { props: { msg: { id: 1, title: 'foo' }, onClick: clickSpy } } @@ -22,12 +22,11 @@ describe('Processes .vue file with functional template', () => { }) it('is functional', () => { - // note: for new version of @vue/vue-utils we can use wrapper.isFunctionalComponent for this - expect(wrapper.vm._vnode.fnOptions.functional).toBe(true) + expect(wrapper.isFunctionalComponent).toBe(true) }) it('handles slot', () => { - wrapper = shallow(FunctionalSFC, { + wrapper = shallowMount(FunctionalSFC, { context: { props: { msg: { id: 1, title: '' }}, children: ['this is a slot'] diff --git a/test/FunctionalSFCParent.spec.js b/test/FunctionalSFCParent.spec.js index 16f1e9c1..2525fb97 100644 --- a/test/FunctionalSFCParent.spec.js +++ b/test/FunctionalSFCParent.spec.js @@ -1,4 +1,4 @@ -import { mount } from 'vue-test-utils' +import { mount } from '@vue/test-utils' import FunctionalSFCParent from './resources/FunctionalSFCParent.vue' test('processes .vue file with functional template from parent', () => { diff --git a/test/NoScript.spec.js b/test/NoScript.spec.js index df9d17ee..15f2471c 100644 --- a/test/NoScript.spec.js +++ b/test/NoScript.spec.js @@ -1,4 +1,4 @@ -import { mount } from 'vue-test-utils' +import { mount } from '@vue/test-utils' import NoScript from './resources/NoScript.vue' describe('NoScript', () => { diff --git a/test/RenderFunction.spec.js b/test/RenderFunction.spec.js index 15443016..c09863d3 100644 --- a/test/RenderFunction.spec.js +++ b/test/RenderFunction.spec.js @@ -1,8 +1,8 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import RenderFunction from './resources/RenderFunction.vue' test('processes .vue file with no template', () => { - const wrapper = shallow(RenderFunction) + const wrapper = shallowMount(RenderFunction) expect(wrapper.is('section')).toBe(true) }) diff --git a/test/TypeScript.spec.js b/test/TypeScript.spec.js index eac46722..10038421 100644 --- a/test/TypeScript.spec.js +++ b/test/TypeScript.spec.js @@ -1,4 +1,4 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import { resolve } from 'path' import TypeScript from './resources/TypeScript.vue' import jestVue from '../vue-jest' @@ -10,14 +10,14 @@ beforeEach(() => { }) test('processes .vue files', () => { - shallow(TypeScript) + shallowMount(TypeScript) }) test('processes .vue files without .babelrc', () => { const babelRcPath = resolve(__dirname, '../.babelrc') const tempPath = resolve(__dirname, '../.renamed') renameSync(babelRcPath, tempPath) - shallow(TypeScript) + shallowMount(TypeScript) renameSync(tempPath, babelRcPath) }) diff --git a/test/coffee.spec.js b/test/coffee.spec.js index 63df50ee..f4db05f2 100644 --- a/test/coffee.spec.js +++ b/test/coffee.spec.js @@ -1,4 +1,4 @@ -import { shallow, mount } from 'vue-test-utils' +import { shallowMount, mount } from '@vue/test-utils' import Coffee from './resources/Coffee.vue' import CoffeeScript from './resources/CoffeeScript.vue' import CoffeeES6 from './resources/CoffeeES6.vue' @@ -20,19 +20,19 @@ describe('Test CoffeeScript - coffee.spec.js', () => { }) test('processes .vue file with lang set to coffee', () => { - shallow(Coffee) + shallowMount(Coffee) }) test('processes .vue file with lang set to coffeescript', () => { - shallow(CoffeeScript) + shallowMount(CoffeeScript) }) test('processes .vue file with lang set to coffee (ES6)', () => { - shallow(CoffeeES6) + shallowMount(CoffeeES6) }) test('processes .vue file with lang set to coffeescript (ES6)', () => { - shallow(CoffeeScriptES6) + shallowMount(CoffeeScriptES6) }) test('processes .vue file with lang set to coffeescript (ES6)', () => { diff --git a/test/css.spec.js b/test/css.spec.js index 3ceb3817..4c5099ea 100644 --- a/test/css.spec.js +++ b/test/css.spec.js @@ -1,10 +1,10 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import Css from './resources/Css.vue' describe('processes .vue file with Css style', () => { let wrapper beforeAll(() => { - wrapper = shallow(Css) + wrapper = shallowMount(Css) }) it('should bind from style tags with named module', () => { diff --git a/test/jade.spec.js b/test/jade.spec.js index f274364b..b66948ec 100644 --- a/test/jade.spec.js +++ b/test/jade.spec.js @@ -1,8 +1,8 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import Jade from './resources/Jade.vue' test('processes .vue file with jade template', () => { - const wrapper = shallow(Jade) + const wrapper = shallowMount(Jade) expect(wrapper.is('div')).toBe(true) expect(wrapper.classes()).toContain('jade') }) diff --git a/test/less.spec.js b/test/less.spec.js index cea9124d..423b162e 100644 --- a/test/less.spec.js +++ b/test/less.spec.js @@ -1,14 +1,14 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import Less from './resources/Less.vue' import LessModule from './resources/LessModule.vue' describe('processes .vue file with Less style', () => { it('does not error on less', () => { - const wrapper = shallow(Less) + const wrapper = shallowMount(Less) expect(wrapper.classes()).toContain('testLess') }) it('does not error on less module', () => { - expect(() => shallow(LessModule)).not.toThrow() + expect(() => shallowMount(LessModule)).not.toThrow() }) }) diff --git a/test/postcss.spec.js b/test/postcss.spec.js index ed614980..0d98af38 100644 --- a/test/postcss.spec.js +++ b/test/postcss.spec.js @@ -1,14 +1,14 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import PostCss from './resources/PostCss.vue' import PostCssModule from './resources/PostCssModule.vue' describe('processes .vue file with PostCSS style', () => { it('does not error on pcss/postcss', () => { - const wrapper = shallow(PostCss) + const wrapper = shallowMount(PostCss) expect(wrapper.classes()).toContain('testPcss') }) it('does not error on pcss/postcss module', () => { - expect(() => shallow(PostCssModule)).not.toThrow() + expect(() => shallowMount(PostCssModule)).not.toThrow() }) }) diff --git a/test/pug.spec.js b/test/pug.spec.js index de8c190e..2b1ef4e3 100644 --- a/test/pug.spec.js +++ b/test/pug.spec.js @@ -1,11 +1,11 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import { resolve } from 'path' import Pug from './resources/Pug.vue' import jestVue from '../vue-jest' import { readFileSync } from 'fs' test('processes .vue file with pug template', () => { - const wrapper = shallow(Pug) + const wrapper = shallowMount(Pug) expect(wrapper.is('div')).toBe(true) expect(wrapper.classes()).toContain('pug') }) diff --git a/test/sass.spec.js b/test/sass.spec.js index f5109c7f..52073039 100644 --- a/test/sass.spec.js +++ b/test/sass.spec.js @@ -1,14 +1,14 @@ -import { shallow, mount } from 'vue-test-utils' +import { shallowMount, mount } from '@vue/test-utils' import Sass from './resources/Sass.vue' import SassModule from './resources/SassModule.vue' import SassModuleFunctional from './resources/SassModuleFunctional.vue' describe('processes .vue file with sass style', () => { it('does not error on sass', () => { - expect(() => shallow(Sass)).not.toThrow() + expect(() => shallowMount(Sass)).not.toThrow() }) it('does not error on sass module', () => { - expect(() => shallow(SassModule)).not.toThrow() + expect(() => shallowMount(SassModule)).not.toThrow() }) it('does not error on sass module when functional', () => { expect(() => mount(SassModuleFunctional)).not.toThrow() @@ -20,7 +20,7 @@ describe('processes .vue files which combine sass and modules', () => { let functionalWrapper beforeEach(() => { - wrapper = shallow(SassModule) + wrapper = shallowMount(SassModule) functionalWrapper = mount(SassModuleFunctional) }) @@ -42,7 +42,7 @@ describe('processes .vue files which combine sass and modules', () => { describe('entrypoint: direct import in SFC', () => { let wrapper beforeEach(() => { - wrapper = shallow(SassModule) + wrapper = shallowMount(SassModule) }) it('does inject classes from directly imported files by relative path', () => { expect(wrapper.vm.$style.directImportClass).toBeDefined() @@ -69,7 +69,7 @@ describe('processes .vue files which combine sass and modules', () => { describe('entrypoint: import inside previously imported stylesheet', () => { let wrapper beforeEach(() => { - wrapper = shallow(SassModule) + wrapper = shallowMount(SassModule) }) it('does inject classes from imports within sass files by relative path', () => { expect(wrapper.vm.$style.sassImportClass).toBeDefined() @@ -96,7 +96,7 @@ describe('processes .vue files which combine sass and modules', () => { describe('multiple modules', () => { let wrapper beforeEach(() => { - wrapper = shallow(SassModule) + wrapper = shallowMount(SassModule) }) it('does inject classes from sass if multiple modules are present', () => { expect(wrapper.vm.$style.directImportSecondClass).toBeDefined() diff --git a/test/scss.spec.js b/test/scss.spec.js index 8a9139ac..f477c5a3 100644 --- a/test/scss.spec.js +++ b/test/scss.spec.js @@ -1,14 +1,14 @@ -import { shallow, mount } from 'vue-test-utils' +import { shallowMount, mount } from '@vue/test-utils' import Scss from './resources/Scss.vue' import ScssModule from './resources/ScssModule.vue' import ScssModuleFunctional from './resources/ScssModuleFunctional.vue' describe('processes .vue file with scss style', () => { it('does not error on scss', () => { - expect(() => shallow(Scss)).not.toThrow() + expect(() => shallowMount(Scss)).not.toThrow() }) it('does not error on scss module', () => { - expect(() => shallow(ScssModule)).not.toThrow() + expect(() => shallowMount(ScssModule)).not.toThrow() }) it('does not error on scss module when functional', () => { expect(() => mount(ScssModuleFunctional)).not.toThrow() @@ -20,7 +20,7 @@ describe('processes .vue files which combine scss and modules', () => { let functionalWrapper beforeEach(() => { - wrapper = shallow(ScssModule) + wrapper = shallowMount(ScssModule) functionalWrapper = mount(ScssModuleFunctional) }) @@ -42,7 +42,7 @@ describe('processes .vue files which combine scss and modules', () => { describe('entrypoint: direct import in SFC', () => { let wrapper beforeEach(() => { - wrapper = shallow(ScssModule) + wrapper = shallowMount(ScssModule) }) it('does inject classes from directly imported files by relative path', () => { expect(wrapper.vm.$style.directImportClass).toBeDefined() @@ -69,7 +69,7 @@ describe('processes .vue files which combine scss and modules', () => { describe('entrypoint: import inside previously imported stylesheet', () => { let wrapper beforeEach(() => { - wrapper = shallow(ScssModule) + wrapper = shallowMount(ScssModule) }) it('does inject classes from imports within scss files by relative path', () => { expect(wrapper.vm.$style.scssImportClass).toBeDefined() @@ -96,7 +96,7 @@ describe('processes .vue files which combine scss and modules', () => { describe('multiple modules', () => { let wrapper beforeEach(() => { - wrapper = shallow(ScssModule) + wrapper = shallowMount(ScssModule) }) it('does inject classes from scss if multiple modules are present', () => { expect(wrapper.vm.$style.directImportSecondClass).toBeDefined() diff --git a/test/stylus.spec.js b/test/stylus.spec.js index cd7f46e3..1a2e4909 100644 --- a/test/stylus.spec.js +++ b/test/stylus.spec.js @@ -1,4 +1,4 @@ -import { shallow } from 'vue-test-utils' +import { shallowMount } from '@vue/test-utils' import Stylus from './resources/Stylus.vue' import StylusRelative from './resources/StylusRelative.vue' import { resolve } from 'path' @@ -8,7 +8,7 @@ import jestVue from '../vue-jest' describe('processes .vue file with Stylus style', () => { let wrapper beforeAll(() => { - wrapper = shallow(Stylus) + wrapper = shallowMount(Stylus) }) it('should bind from style tags with named module', () => { @@ -24,7 +24,7 @@ describe('processes .vue file with Stylus style', () => { }) it('should handle relative imports', () => { - expect(() => shallow(StylusRelative)).not.toThrow() + expect(() => shallowMount(StylusRelative)).not.toThrow() }) it('does not attempty to compile if experimentalStyles flag is passed', () => {