test warning component trace

yyx990803 · yyx990803 · commit 760a74480e3a · 2017-04-14T15:19:41.000+08:00
diff --git a/src/core/util/debug.js b/src/core/util/debug.js
@@ -1,9 +1,9 @@
 import config from '../config'
 import { noop } from 'shared/util'
 
-let warn = noop
-let tip = noop
-let formatComponentName
+export let warn = noop
+export let tip = noop
+export let formatComponentName
 
 if (process.env.NODE_ENV !== 'production') {
   const hasConsole = typeof console !== 'undefined'
@@ -52,8 +52,18 @@ if (process.env.NODE_ENV !== 'production') {
     )
   }
 
+  const repeat = (str, n) => {
+    let res = ''
+    while (n) {
+      if (n % 2 === 1) res += str
+      if (n > 1) str += str
+      n >>= 1
+    }
+    return res
+  }
+
   const generateComponentTrace = vm => {
-    if (vm._isVue && vm.$parent && String.prototype.repeat) {
+    if (vm._isVue && vm.$parent) {
       const tree = []
       let currentRecursiveSequence = 0
       while (vm) {
@@ -73,7 +83,7 @@ if (process.env.NODE_ENV !== 'production') {
       }
       return '\n\nfound in\n\n' + tree
         .map((vm, i) => `${
-          i === 0 ? '---> ' : ' '.repeat(5 + i * 2)
+          i === 0 ? '---> ' : repeat(' ', 5 + i * 2)
         }${
           Array.isArray(vm)
             ? `${formatComponentName(vm[0])}... (${vm[1]} recursive calls)`
@@ -85,5 +95,3 @@ if (process.env.NODE_ENV !== 'production') {
     }
   }
 }
-
-export { warn, tip, formatComponentName }
diff --git a/test/unit/features/debug.spec.js b/test/unit/features/debug.spec.js
@@ -0,0 +1,83 @@
+import Vue from 'vue'
+import { formatComponentName } from 'core/util/debug'
+
+describe('Debug utilities', () => {
+  it('properly format component names', () => {
+    const vm = new Vue()
+    expect(formatComponentName(vm)).toBe('<Root>')
+
+    vm.$root = null
+    vm.$options.name = 'hello-there'
+    expect(formatComponentName(vm)).toBe('<HelloThere>')
+
+    vm.$options.name = null
+    vm.$options._componentTag = 'foo-bar-1'
+    expect(formatComponentName(vm)).toBe('<FooBar1>')
+
+    vm.$options._componentTag = null
+    vm.$options.__file = '/foo/bar/baz/SomeThing.vue'
+    expect(formatComponentName(vm)).toBe(`<SomeThing> at ${vm.$options.__file}`)
+    expect(formatComponentName(vm, false)).toBe('<SomeThing>')
+
+    vm.$options.__file = 'C:\\foo\\bar\\baz\\windows_file.vue'
+    expect(formatComponentName(vm)).toBe(`<WindowsFile> at ${vm.$options.__file}`)
+    expect(formatComponentName(vm, false)).toBe('<WindowsFile>')
+  })
+
+  it('generate correct component hierarchy trace', () => {
+    const one = {
+      name: 'one',
+      render: h => h(two)
+    }
+    const two = {
+      name: 'two',
+      render: h => h(three)
+    }
+    const three = {
+      name: 'three'
+    }
+    new Vue({
+      render: h => h(one)
+    }).$mount()
+
+    expect(
+`Failed to mount component: template or render function not defined.
+
+found in
+
+---> <Three>
+       <Two>
+         <One>
+           <Root>`
+    ).toHaveBeenWarned()
+  })
+
+  it('generate correct component hierarchy trace (recursive)', () => {
+    let i = 0
+    const one = {
+      name: 'one',
+      render: h => i++ < 5 ? h(one) : h(two)
+    }
+    const two = {
+      name: 'two',
+      render: h => h(three)
+    }
+    const three = {
+      name: 'three'
+    }
+    new Vue({
+      render: h => h(one)
+    }).$mount()
+
+    expect(
+`Failed to mount component: template or render function not defined.
+
+found in
+
+---> <Three>
+       <Two>
+         <One>... (5 recursive calls)
+           <Root>`
+    ).toHaveBeenWarned()
+  })
+})
diff --git a/test/unit/features/error-handling.spec.js b/test/unit/features/error-handling.spec.js
@@ -1,5 +1,4 @@
 import Vue from 'vue'
-import { formatComponentName } from 'core/util/debug'
 
 const components = createErrorTestComponents()
 
@@ -124,28 +123,6 @@ describe('Error handling', () => {
       })
     })
   })
-
-  it('properly format component names', () => {
-    const vm = new Vue()
-    expect(formatComponentName(vm)).toBe('<Root>')
-
-    vm.$root = null
-    vm.$options.name = 'hello-there'
-    expect(formatComponentName(vm)).toBe('<HelloThere>')
-
-    vm.$options.name = null
-    vm.$options._componentTag = 'foo-bar-1'
-    expect(formatComponentName(vm)).toBe('<FooBar1>')
-
-    vm.$options._componentTag = null
-    vm.$options.__file = '/foo/bar/baz/SomeThing.vue'
-    expect(formatComponentName(vm)).toBe(`<SomeThing> at ${vm.$options.__file}`)
-    expect(formatComponentName(vm, false)).toBe('<SomeThing>')
-
-    vm.$options.__file = 'C:\\foo\\bar\\baz\\windows_file.vue'
-    expect(formatComponentName(vm)).toBe(`<WindowsFile> at ${vm.$options.__file}`)
-    expect(formatComponentName(vm, false)).toBe('<WindowsFile>')
-  })
 })
 
 function createErrorTestComponents () {
