fix: throw error if stub contains circular reference (#504)

package.json

@@ -23,6 +23,7 @@
     "test:compat": "scripts/test-compat.sh",
     "test:unit": "npm run build:test && npm run test:unit:only",
     "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",
+    "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",
     "test:unit:karma": "npm run build:test && cross-env BABEL_ENV=test TARGET=browser karma start test/setup/karma.conf.js --single-run",
     "test:types": "tsc -p packages/test-utils/types && tsc -p packages/server-test-utils/types"
   },

packages/shared/stub-components.js

@@ -5,6 +5,7 @@ import { compileToFunctions } from 'vue-template-compiler'
 import { throwError } from './util'
 import { componentNeedsCompiling } from './validators'
 import { compileTemplate } from './compile-template'
+import { capitalize, camelize, hyphenate } from './util'
 
 function isVueComponent (comp) {
   return comp && (comp.render || comp.template || comp.options)
@@ -43,6 +44,13 @@ function createStubFromString (templateString: string, originalComponent: Compon
   if (!compileToFunctions) {
     throwError('vueTemplateCompiler is undefined, you must pass components explicitly if vue-template-compiler is undefined')
   }
+
+  if (templateString.indexOf(hyphenate(originalComponent.name)) !== -1 ||
+  templateString.indexOf(capitalize(originalComponent.name)) !== -1 ||
+  templateString.indexOf(camelize(originalComponent.name)) !== -1) {
+    throwError('options.stub cannot contain a circular reference')
+  }
+
   return {
     ...getCoreProperties(originalComponent),
     ...compileToFunctions(templateString)

packages/test-utils/scripts/build.js

@@ -5,6 +5,7 @@ const buble = require('rollup-plugin-buble')
 const nodeResolve = require('rollup-plugin-node-resolve')
 const commonjs = require('rollup-plugin-commonjs')
 const chalk = require('chalk')
+const json = require('rollup-plugin-json')
 
 function success (text) {
   console.log(chalk.green(`${text} ✔`))
@@ -56,6 +57,7 @@ rollupOptions.forEach(options => {
     external: ['vue', 'vue-template-compiler'],
     plugins: [
       flow(),
+      json(),
       buble({
         objectAssign: 'Object.assign'
       }),

test/specs/config.spec.js

@@ -6,14 +6,17 @@ import {
 } from '~vue/test-utils'
 
 describe('config', () => {
+  let configStubsSave
   beforeEach(() => {
     TransitionGroupStub.name = 'another-temp-name'
     TransitionStub.name = 'a-temp-name'
+    configStubsSave = config.stubs
   })
 
   afterEach(() => {
     TransitionGroupStub.name = 'transition-group'
     TransitionStub.name = 'transition'
+    config.stubs = configStubsSave
   })
 
   it('stubs transition and transition-group by default', () => {
@@ -57,7 +60,6 @@ describe('config', () => {
   })
 
   it('doesn\'t stub transition when config.stubs is set to false', () => {
-    const configStubsSave = config.stubs
     config.stubs = false
     const testComponent = {
       template: `
@@ -69,11 +71,9 @@ describe('config', () => {
     const wrapper = mount(testComponent)
     expect(wrapper.contains(TransitionGroupStub)).to.equal(false)
     expect(wrapper.contains(TransitionStub)).to.equal(false)
-    config.stubs = configStubsSave
   })
 
   it('doesn\'t stub transition when config.stubs is set to a string', () => {
-    const configStubsSave = config.stubs
     config.stubs = 'a string'
     const testComponent = {
       template: `
@@ -85,6 +85,5 @@ describe('config', () => {
     const wrapper = mount(testComponent)
     expect(wrapper.contains(TransitionGroupStub)).to.equal(false)
     expect(wrapper.contains(TransitionStub)).to.equal(false)
-    config.stubs = configStubsSave
   })
 })

test/specs/mounting-options/stubs.spec.js

@@ -299,6 +299,18 @@ describeWithMountingMethods('options.stub', (mountingMethod) => {
     expect(HTML).contains('No render function')
   })
 
+  const invalidValues = ['child-component', 'ChildComponent', 'childComponent']
+  invalidValues.forEach(invalidValue => {
+    it('throws an error when passed a circular reference', () => {
+      const error = '[vue-test-utils]: options.stub cannot contain a circular reference'
+      const fn = () => mountingMethod(ComponentWithChild, {
+        stubs: {
+          ChildComponent: `<${invalidValue} />`
+        }})
+      expect(fn).to.throw().with.property('message', error)
+    })
+  })
+
   it('throws an error when passed an invalid value as stub', () => {
     const error = '[vue-test-utils]: options.stub values must be passed a string or component'
     const invalidValues = [1, null, [], {}, NaN]