[Breadcrumbs] Fix prop check fail issue.

Author: wxsms

src/components/breadcrumbs/Breadcrumbs.js

@@ -8,13 +8,13 @@ export default {
     if (children && children.length) {
       slot = children
     } else if (props.items) {
-      props.items.forEach((item, index) => {
-        slot.push(h(
+      slot = props.items.map((item, index) => {
+        return h(
           BreadcrumbItem,
           {
-            key: item.key ? item.key : index,
+            key: item.hasOwnProperty('key') ? item.key : index,
             props: {
-              active: typeof item.active === 'boolean' ? item.active : index === props.items.length - 1,
+              active: item.hasOwnProperty('active') ? item.active : index === props.items.length - 1,
               href: item.href,
               target: item.target,
               to: item.to,
@@ -24,7 +24,7 @@ export default {
             }
           },
           item.text
-        ))
+        )
       })
     }
     return h('ol', mergeData(data, {class: 'breadcrumb'}), slot)

test/unit/specs/Breadcrumbs.spec.js

@@ -63,7 +63,7 @@ describe('Breadcrumbs', () => {
     let vm = new Vue({
       data () {
         return {
-          items: [{text: 'test', href: '#', active: false}]
+          items: [{text: 'test', href: '#', active: false, key: 0}]
         }
       },
       render: res.render,
@@ -76,7 +76,18 @@ describe('Breadcrumbs', () => {
     expect(nav1.getAttribute('target')).to.equal('_self')
     expect(nav1.textContent).to.equal('test')
     expect($el.find('.active').length).to.equal(0)
-    $el.remove()
+    vm.$destroy()
+  })
+
+  it('should render nothing if no children and items', async () => {
+    let res = Vue.compile('<breadcrumbs></breadcrumbs>')
+    let vm = new Vue({
+      render: res.render,
+      staticRenderFns: res.staticRenderFns
+    }).$mount()
+    let $el = $(vm.$el)
+    await vm.$nextTick()
+    expect($el.children().length).to.equal(0)
     vm.$destroy()
   })
 })

test/unit/specs/Tabs.spec.js

@@ -138,10 +138,13 @@ describe('Tabs', () => {
       // Silent to remove out logs in terminal
     }
     let spy = sinon.spy(window, 'alert')
-    utils.triggerEvent(nav.querySelectorAll('li')[2].querySelector('a'), 'click')
+    utils.triggerEvent(nav.querySelectorAll('li > a')[1], 'click')
     await vm.$nextTick()
     await utils.sleep(350)
-    sinon.assert.called(spy)
+    utils.triggerEvent(nav.querySelectorAll('li > a')[2], 'click')
+    await vm.$nextTick()
+    await utils.sleep(350)
+    sinon.assert.calledOnce(spy)
     window.alert = _savedAlert
   })
 
@@ -233,4 +236,60 @@ describe('Tabs', () => {
     expect(activeContent.length).to.equal(1)
     expect(activeContent[0].textContent).to.contain('Tab 0')
   })
+
+  it('should be able to select dynamic tab', async () => {
+    let _vm = vm.$refs['tabs-dynamic-example']
+    let $el = $(_vm.$el)
+    let nav = $el.find('.nav-tabs').get(0)
+    let content = $el.find('.tab-content').get(0)
+    let pushBtn = $el.find('.btn').get(0)
+    let popBtn = $el.find('.btn').get(1)
+    await vm.$nextTick()
+    await vm.$nextTick()
+    // Add a tab
+    pushBtn.click()
+    await vm.$nextTick()
+    pushBtn.click()
+    await vm.$nextTick()
+    pushBtn.click()
+    await vm.$nextTick()
+    await utils.sleep(350)
+    expect(nav.querySelectorAll('li').length).to.equal(4)
+    _vm.index = 1
+    await vm.$nextTick()
+    await utils.sleep(350)
+    // check active tab
+    let activeTab = nav.querySelectorAll('.active')
+    expect(activeTab.length).to.equal(1)
+    expect(activeTab[0].querySelector('a').textContent).to.equal('Tab 1')
+    // check active content
+    let activeContent = content.querySelectorAll('.tab-pane.active')
+    expect(activeContent.length).to.equal(1)
+    expect(activeContent[0].textContent).to.contain('Tab 1')
+    popBtn.click()
+    await vm.$nextTick()
+    await utils.sleep(350)
+    expect(nav.querySelectorAll('li').length).to.equal(3)
+    // check active tab
+    activeTab = nav.querySelectorAll('.active')
+    expect(activeTab.length).to.equal(1)
+    expect(activeTab[0].querySelector('a').textContent).to.equal('Tab 1')
+    // check active content
+    activeContent = content.querySelectorAll('.tab-pane.active')
+    expect(activeContent.length).to.equal(1)
+    expect(activeContent[0].textContent).to.contain('Tab 1')
+    // switch tab
+    let tab2 = nav.querySelectorAll('li')[2]
+    utils.triggerEvent(tab2.querySelector('a'), 'click')
+    await vm.$nextTick()
+    await utils.sleep(350)
+    // check active tab
+    activeTab = nav.querySelectorAll('.active')
+    expect(activeTab.length).to.equal(1)
+    expect(activeTab[0].querySelector('a').textContent).to.equal('Tab 2')
+    // check active content
+    activeContent = content.querySelectorAll('.tab-pane.active')
+    expect(activeContent.length).to.equal(1)
+    expect(activeContent[0].textContent).to.contain('Tab 2')
+  })
 })