Skip to content

Commit 8f205c0

Browse files
authored
test: run renderToString tests in node environment (vuejs#542)
1 parent 8836071 commit 8f205c0

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+951
-790
lines changed

package.json

+6-4
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,13 @@
1919
"lint:fix": "npm run lint -- --fix",
2020
"prepublish": "npm run build && npm run test:unit:only",
2121
"publish": "lerna publish --conventional-commits -m \"chore(release): publish %s\"",
22-
"test": "npm run lint && npm run lint:docs && npm run flow && npm run test:types && npm run test:unit && npm run test:unit:karma",
22+
"test": "npm run lint && npm run lint:docs && npm run flow && npm run test:types && npm run test:unit && npm run test:unit:karma npm run test:unit:node",
2323
"test:compat": "scripts/test-compat.sh",
2424
"test:unit": "npm run build:test && npm run test:unit:only",
25-
"test:unit:only": "cross-env BABEL_ENV=test && mocha-webpack --webpack-config test/setup/webpack.test.config.js test/specs --recursive --require test/setup/mocha.setup.js",
26-
"test:unit:debug": "npm run build:test && cross-env BABEL_ENV=test && node --inspect-brk node_modules/.bin/mocha-webpack --webpack-config test/setup/webpack.test.config.js test/specs --recursive --require test/setup/mocha.setup.js",
27-
"test:unit:karma": "npm run build:test && cross-env BABEL_ENV=test TARGET=browser karma start test/setup/karma.conf.js --single-run",
25+
"test:unit:only": "mocha-webpack --webpack-config test/setup/webpack.test.config.js test/specs --recursive --require test/setup/mocha.setup.js",
26+
"test:unit:debug": "npm run build:test && node --inspect-brk node_modules/.bin/mocha-webpack --webpack-config test/setup/webpack.test.config.js test/specs --recursive --require test/setup/mocha.setup.js",
27+
"test:unit:karma": "npm run build:test TARGET=browser karma start test/setup/karma.conf.js --single-run",
28+
"test:unit:node": "npm run build:test && npm run test:unit:node:only",
2829
"test:types": "tsc -p packages/test-utils/types && tsc -p packages/server-test-utils/types"
2930
},
3031
"devDependencies": {
@@ -37,6 +38,7 @@
3738
"babel-preset-flow-vue": "^1.0.0",
3839
"babel-preset-stage-2": "^6.24.1",
3940
"chai": "^4.0.0",
41+
"cheerio": "^1.0.0-rc.2",
4042
"cross-env": "^5.0.0",
4143
"css-loader": "^0.28.4",
4244
"eslint": "^4.18.1",

packages/create-instance/add-slots.js

+3
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@ function addSlotToVm (vm: Component, slotName: string, slotValue: Component | st
1010
if (!compileToFunctions) {
1111
throwError('vueTemplateCompiler is undefined, you must pass components explicitly if vue-template-compiler is undefined')
1212
}
13+
if (typeof window === 'undefined') {
14+
throwError('the slots string option does not support strings in server-test-uitls.')
15+
}
1316
if (window.navigator.userAgent.match(/PhantomJS/i)) {
1417
throwError('the slots option does not support strings in PhantomJS. Please use Puppeteer, or pass a component.')
1518
}

packages/server-test-utils/dist/vue-server-test-utils.js

+130-27
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/server-test-utils/package.json

+3
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,9 @@
3737
"rollup-plugin-node-resolve": "^3.0.3",
3838
"typescript": "^2.6.2"
3939
},
40+
"dependencies": {
41+
"@vue/test-utils": "1.0.0-beta.14"
42+
},
4043
"peerDependencies": {
4144
"vue": "2.x",
4245
"vue-server-renderer": "2.x",

packages/server-test-utils/scripts/build.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,13 @@ const rollupOptions = process.env.NODE_ENV === 'test' ? rollupOptionsTest : roll
3535
rollupOptions.forEach(options => {
3636
rollup({
3737
input: resolve('src/index.js'),
38-
external: ['vue', 'vue-template-compiler', 'vue-server-renderer', 'cheerio'],
38+
external: [
39+
'vue',
40+
'vue-template-compiler',
41+
'vue-server-renderer',
42+
'cheerio',
43+
'@vue/test-utils'
44+
],
3945
plugins: [
4046
flow(),
4147
json(),

packages/test-utils/dist/vue-test-utils.js

+68-16
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/test-utils/src/matches-polyfill.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
if (!Element.prototype.matches) {
1+
if (typeof Element !== 'undefined' && !Element.prototype.matches) {
22
Element.prototype.matches =
33
Element.prototype.matchesSelector ||
44
Element.prototype.mozMatchesSelector ||

packages/test-utils/src/mount.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
// @flow
22

3-
import './warn-if-no-window'
43
import './matches-polyfill'
54
import './object-assign-polyfill'
65
import Vue from 'vue'
@@ -12,12 +11,14 @@ import errorHandler from './error-handler'
1211
import { findAllVueComponentsFromVm } from './find-vue-components'
1312
import { mergeOptions } from 'shared/merge-options'
1413
import config from './config'
14+
import warnIfNoWindow from './warn-if-no-window'
1515

1616
Vue.config.productionTip = false
1717
Vue.config.devtools = false
1818
Vue.config.errorHandler = errorHandler
1919

2020
export default function mount (component: Component, options: Options = {}): VueWrapper {
21+
warnIfNoWindow()
2122
// Remove cached constructor
2223
delete component._Ctor
2324
const vueClass = options.localVue || createLocalVue()
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import { throwError } from 'shared/util'
22

3-
if (typeof window === 'undefined') {
4-
throwError(
5-
'window is undefined, vue-test-utils needs to be run in a browser environment.\n' +
6-
'You can run the tests in node using jsdom + jsdom-global.\n' +
7-
'See https://vue-test-utils.vuejs.org/en/guides/common-tips.html for more details.'
8-
)
3+
export default function warnIfNoWindow () {
4+
if (typeof window === 'undefined') {
5+
throwError(
6+
'window is undefined, vue-test-utils needs to be run in a browser environment.\n' +
7+
'You can run the tests in node using jsdom + jsdom-global.\n' +
8+
'See https://vue-test-utils.vuejs.org/en/guides/common-tips.html for more details.'
9+
)
10+
}
911
}

test/resources/utils.js

+21-7
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import { renderToString } from '~vue/server-test-utils'
66

77
export const vueVersion = Number(`${Vue.version.split('.')[0]}.${Vue.version.split('.')[1]}`)
88

9-
export const isRunningJSDOM = navigator.userAgent.includes && navigator.userAgent.includes('jsdom')
9+
export const isRunningJSDOM =
10+
typeof navigator !== 'undefined' &&
11+
navigator.userAgent.includes &&
12+
navigator.userAgent.includes('jsdom')
1013

1114
export function injectSupported () {
1215
return vueVersion > 2.2
@@ -24,15 +27,20 @@ export function functionalSFCsSupported () {
2427
return vueVersion >= 2.5
2528
}
2629

27-
const shallowAndMount = [mount, shallow]
28-
const shallowMountAndRender = isRunningJSDOM
29-
? [mount, shallow, renderToString]
30+
const shallowAndMount = process.env.TEST_ENV === 'node'
31+
? []
32+
: [mount, shallow]
33+
console.log(shallowAndMount)
34+
const shallowMountAndRender = process.env.TEST_ENV === 'node'
35+
? [renderToString]
3036
: [mount, shallow]
3137

3238
export function describeWithShallowAndMount (spec, cb) {
33-
shallowAndMount.forEach(method => {
34-
describe(`${spec} with ${method.name}`, () => cb(method))
35-
})
39+
if (shallowAndMount.length > 0) {
40+
shallowAndMount.forEach(method => {
41+
describe(`${spec} with ${method.name}`, () => cb(method))
42+
})
43+
}
3644
}
3745

3846
describeWithShallowAndMount.skip = function (spec, cb) {
@@ -80,3 +88,9 @@ export function itDoNotRunIf (predicate, spec, cb) {
8088
it(spec, cb)
8189
}
8290
}
91+
92+
export function describeIf (predicate, spec, cb) {
93+
if (predicate) {
94+
describe(spec, cb)
95+
}
96+
}

test/setup/mocha.setup.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
require('jsdom-global')()
1+
if (process.env.TEST_ENV !== 'node') {
2+
require('jsdom-global')()
3+
}
24

35
const chai = require('chai')
46
const sinon = require('sinon')

test/setup/webpack.test.config.js

+6-7
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,11 @@
11
const nodeExternals = require('webpack-node-externals')
2+
const webpack = require('webpack')
23
const browser = process.env.TARGET === 'browser'
34
const path = require('path')
45

56
const projectRoot = path.resolve(__dirname, '../../')
6-
const isCoverage = process.env.NODE_ENV === 'coverage'
7+
78
const rules = [].concat(
8-
isCoverage ? {
9-
test: /\.js/,
10-
include: path.resolve('dist'),
11-
loader: 'istanbul-instrumenter-loader'
12-
} : [],
139
{
1410
test: /\.vue$/,
1511
loader: 'vue-loader'
@@ -41,5 +37,8 @@ module.exports = {
4137
node: {
4238
fs: 'empty',
4339
module: 'empty'
44-
}
40+
},
41+
plugins: [
42+
new webpack.EnvironmentPlugin(['TEST_ENV'])
43+
]
4544
}

test/specs/add-attrs.spec.js

-10
This file was deleted.

test/specs/add-listeners.spec.js

-10
This file was deleted.

test/specs/components/RouterLink.spec.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import { mount, RouterLinkStub } from '~vue/test-utils'
1+
import { RouterLinkStub } from '~vue/test-utils'
2+
import { describeWithShallowAndMount } from '~resources/utils'
23

3-
describe('RouterLinkStub', () => {
4+
describeWithShallowAndMount('RouterLinkStub', (mountingMethod) => {
45
it('takes correct props', () => {
56
const TestComponent = {
67
template: `
@@ -18,7 +19,7 @@ describe('RouterLinkStub', () => {
1819
</div>
1920
`
2021
}
21-
const wrapper = mount(TestComponent, {
22+
const wrapper = mountingMethod(TestComponent, {
2223
stubs: {
2324
RouterLink: RouterLinkStub
2425
}
@@ -42,7 +43,7 @@ describe('RouterLinkStub', () => {
4243
</div>
4344
`
4445
}
45-
const wrapper = mount(TestComponent, {
46+
const wrapper = mountingMethod(TestComponent, {
4647
stubs: {
4748
RouterLink: RouterLinkStub
4849
}

test/specs/components/TransitionGroupStub.spec.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import ComponentWithTransitionGroup from '~resources/components/component-with-transition-group.vue'
2-
import { mount, TransitionGroupStub } from '~vue/test-utils'
2+
import { TransitionGroupStub } from '~vue/test-utils'
3+
import { describeWithShallowAndMount } from '~resources/utils'
34

4-
describe('TransitionGroupStub', () => {
5+
describeWithShallowAndMount('TransitionGroupStub', (mountingMethod) => {
56
it('update synchronously when used as stubs for Transition', () => {
6-
const wrapper = mount(ComponentWithTransitionGroup, {
7+
const wrapper = mountingMethod(ComponentWithTransitionGroup, {
78
stubs: {
89
'transition-group': TransitionGroupStub
910
}
@@ -34,7 +35,7 @@ describe('TransitionGroupStub', () => {
3435
</transition-group>
3536
`
3637
}
37-
const wrapper = mount(TestComponent, {
38+
const wrapper = mountingMethod(TestComponent, {
3839
stubs: {
3940
'transition-group': TransitionGroupStub
4041
}

test/specs/config.spec.js

+19-23
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,7 @@
1-
import {
2-
mount,
3-
config,
4-
TransitionStub,
5-
TransitionGroupStub,
6-
createLocalVue
7-
} from '~vue/test-utils'
8-
9-
describe('config', () => {
1+
import { describeWithShallowAndMount, itDoNotRunIf } from '~resources/utils'
2+
import { config, TransitionStub, TransitionGroupStub, createLocalVue } from '~vue/test-utils'
3+
4+
describeWithShallowAndMount('config', (mountingMethod) => {
105
let configStubsSave
116
beforeEach(() => {
127
TransitionGroupStub.name = 'another-temp-name'
@@ -20,19 +15,20 @@ describe('config', () => {
2015
config.stubs = configStubsSave
2116
})
2217

23-
it('stubs transition and transition-group by default', () => {
24-
const testComponent = {
25-
template: `
18+
itDoNotRunIf(mountingMethod.name === 'shallow',
19+
'stubs transition and transition-group by default', () => {
20+
const testComponent = {
21+
template: `
2622
<div>
2723
<transition><p /></transition>
2824
<transition-group><p /><p /></transition-group>
2925
</div>
3026
`
31-
}
32-
const wrapper = mount(testComponent)
33-
expect(wrapper.contains(TransitionStub)).to.equal(true)
34-
expect(wrapper.contains(TransitionGroupStub)).to.equal(true)
35-
})
27+
}
28+
const wrapper = mountingMethod(testComponent)
29+
expect(wrapper.contains(TransitionStub)).to.equal(true)
30+
expect(wrapper.contains(TransitionGroupStub)).to.equal(true)
31+
})
3632

3733
it('mocks a global variable', () => {
3834
const localVue = createLocalVue()
@@ -47,7 +43,7 @@ describe('config', () => {
4743

4844
config.mocks['$t'] = 'mock value'
4945

50-
const wrapper = mount(testComponent, {
46+
const wrapper = mountingMethod(testComponent, {
5147
localVue, t
5248
})
5349

@@ -66,7 +62,7 @@ describe('config', () => {
6662

6763
config.methods['val'] = () => 'method'
6864

69-
const wrapper = mount(testComponent)
65+
const wrapper = mountingMethod(testComponent)
7066

7167
expect(wrapper.vm.val()).to.equal('method')
7268
expect(wrapper.text()).to.equal('method')
@@ -81,7 +77,7 @@ describe('config', () => {
8177
`
8278
}
8379
config.stubs.transition = false
84-
const wrapper = mount(testComponent)
80+
const wrapper = mountingMethod(testComponent)
8581
expect(wrapper.contains(TransitionStub)).to.equal(false)
8682
})
8783

@@ -94,7 +90,7 @@ describe('config', () => {
9490
`
9591
}
9692
config.stubs['transition-group'] = false
97-
const wrapper = mount(testComponent)
93+
const wrapper = mountingMethod(testComponent)
9894
expect(wrapper.contains(TransitionGroupStub)).to.equal(false)
9995
})
10096

@@ -107,7 +103,7 @@ describe('config', () => {
107103
</div>
108104
`
109105
}
110-
const wrapper = mount(testComponent)
106+
const wrapper = mountingMethod(testComponent)
111107
expect(wrapper.contains(TransitionGroupStub)).to.equal(false)
112108
expect(wrapper.contains(TransitionStub)).to.equal(false)
113109
})
@@ -121,7 +117,7 @@ describe('config', () => {
121117
</div>
122118
`
123119
}
124-
const wrapper = mount(testComponent)
120+
const wrapper = mountingMethod(testComponent)
125121
expect(wrapper.contains(TransitionGroupStub)).to.equal(false)
126122
expect(wrapper.contains(TransitionStub)).to.equal(false)
127123
})

0 commit comments

Comments
 (0)