popover组件测试用例

    // 以一个为例
    &.position-bottom {
    margin-top: 10px;
    &::before, &::after{
      left: 10px;
    }
    &::before {
      border-top: none;
      border-bottom-color: black;
      
      bottom: 100%;
    }
    &::after {
      border-top: none;
      border-bottom-color: white;
      
      bottom: calc(100% - 1px);
    }
  }

    // popover.vue
    // 第一步在slot上传一个属性
    

    // 第二步结构一下close，然后用就可以了
    // index.html
    
      
      点我1
    

it('可以设置position.', (done) => {
    Vue.component('g-popover', Popover)
    const div = document.createElement('div')
    document.body.appendChild(div)
    div.innerHTML = `
    
      
      点我
    
    `
    const vm = new Vue({ // 这个vm不是组件，这个vm是一个div对应的实例,div里面才是popover组件
      el: div
    })
    vm.$el.querySelector('button').click()
    vm.$nextTick(() => {
      const {contentWrapper} = vm.$refs.a.$refs
      expect(contentWrapper.classList.contains('position-top')).to.be.false
      done()
    })
  })

• 先确认用 dispatchEvent 的方式是可以触发 hover 事件的

    
      
 hihihi
      
      click me
    

    xxx.addEventListener('mouseenter',function(){
      console.log('hi')
    })

    button.onclick=function(){
      let event = new Event('mouseenter');
      xxx.dispatchEvent(event)
    }

• 可以设置 trigger 的测试用例有问题，先跳过,it 前面+一个 x 可以跳过

  xit('可以设置 trigger.', (done) => {
    Vue.component('g-popover', Popover)
    const div = document.createElement('div')
    document.body.appendChild(div)
    div.innerHTML = `
    
      
      点我
    
    `
    const vm = new Vue({ // 这个vm不是组件，这个vm是一个div对应的实例,div里面才是popover组件
      el: div
    })
    let event = new Event('mouseenter');
    vm.$el.dispatchEvent(event)
    vm.$nextTick(() => {
      const {contentWrapper} = vm.$refs.a.$refs
      expect(contentWrapper).to.be.exist
      done()
    })
  })