all files / tests/unit/ nav.spec.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
 
 
 
 
 
 
 
1×
 
1×
1×
1×
 
 
1×
1×
1×
1×
 
 
 
 
 
 
 
 
 
 
 
 
 
1×
1×
1×
 
 
 
1×
1×
1×
1×
1×
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1×
1×
1×
 
 
 
import chai, {expect} from 'chai'
import sinon from 'sinon'
import sinonChai from 'sinon-chai'
import {mount} from '@vue/test-utils'
import Nav from '../../src/nav/nav'
import NavItem from '../../src/nav/nav-item'
import SubNav from '../../src/nav/sub-nav'
import Vue from 'vue'
chai.use(sinonChai)
 
describe('Nav.vue', () => {
  it('存在.', () => {
    expect(Nav).to.exist
  })
 
  it('支持 selected 属性', (done) => {
    Vue.component('WNavItem', NavItem)
    Vue.component('WSubNav', SubNav)
    const wrapper = mount(Nav, {
      propsData: {
        selected: 'home'
      },
      slots: {
        default: `
        <w-nav-item name="home">首页</w-nav-item>
        <w-sub-nav name="about">
          <template slot="title">关于</template>
          <w-nav-item name="culture">企业文化</w-nav-item>
        </w-sub-nav>
        `
      }
    })
    setTimeout(()=> {
      expect(wrapper.find('[data-name="home"].selected').exists()).to.be.true
      done()
    }) 
  })
 
  it('会触发 update:selected 事件', (done) => {
    Vue.component('WNavItem', NavItem)
    Vue.component('WSubNav', SubNav)
    const callback = sinon.fake()
    const wrapper = mount(Nav, {
      propsData: {
        selected: 'home'
      },
      slots: {
        default: `
        <w-nav-item name="home">首页</w-nav-item>
        <w-sub-nav name="about">
          <template slot="title">关于</template>
          <w-nav-item name="culture">企业文化</w-nav-item>
        </w-sub-nav>
        `
      },
      listeners: {
        'update:selected': callback
      }
    })
    wrapper.find('[data-name="culture"]').trigger('click')
    expect(callback).to.have.been.calledWith('culture')
    done()
  })
})