text: import { createVue, triggerEvent, destroyVM } from '../util';
  
  describe('Dropdown', () => {
    let vm;
    afterEach(() => {
      destroyVM(vm);
    });
  
    it('create', done => {
      vm = createVue({
        template: `
          <el-dropdown ref="dropdown">
            <span class="el-dropdown-link">
              下拉菜单<i class="el-icon-caret-bottom el-icon-right"></i>
            </span>
            <el-dropdown-menu slot="dropdown" class="dropdown-test-creat">
              <el-dropdown-item>黄金糕</el-dropdown-item>
              <el-dropdown-item>狮子头</el-dropdown-item>
              <el-dropdown-item>螺蛳粉</el-dropdown-item>
              <el-dropdown-item>双皮奶</el-dropdown-item>
              <el-dropdown-item>蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        `
      }, true);
      let dropdown = vm.$refs.dropdown;
      let dropdownElm = dropdown.$el;
      let triggerElm = dropdownElm.children[0];
  
      triggerEvent(triggerElm, 'mouseenter');
      setTimeout(_ => {
        expect(dropdown.visible).to.be.true;
  
        triggerEvent(triggerElm, 'mouseleave');
        setTimeout(_ => {
          expect(dropdown.visible).to.not.true;
          destroyVM(vm);
          done();
        }, 300);
      }, 400);
    });
    it('menu click', done => {
      vm = createVue({
        template: `
          <el-dropdown ref="dropdown">
            <span class="el-dropdown-link">
              下拉菜单<i class="el-icon-caret-bottom el-icon-right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="a">黄金糕</el-dropdown-item>
              <el-dropdown-item command="b">狮子头</el-dropdown-item>
              <el-dropdown-item ref="commandC" command="c">螺蛳粉</el-dropdown-item>
              <el-dropdown-item command="d">双皮奶</el-dropdown-item>
              <el-dropdown-item command="e">蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        `
      }, true);
      let dropdown = vm.$refs.dropdown;
      let dropdownElm = dropdown.$el;
      let triggerElm = dropdownElm.children[0];
      let callback = sinon.spy();
  
      dropdown.$on('command', callback);
  
      triggerEvent(triggerElm, 'mouseenter');
      setTimeout(_ => {
        vm.$refs.commandC.$el.click();
        setTimeout(_ => {
          expect(dropdown.visible).to.not.true;
          expect(callback.calledWith('c')).to.be.true;
          destroyVM(vm);
          done();
        }, 300);
      }, 300);
    });
    it('trigger', done => {
      vm = createVue({
        template: `
          <el-dropdown trigger="click" ref="dropdown">
            <span class="el-dropdown-link">
              下拉菜单trigger click<i class="el-icon-caret-bottom el-icon-right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>黄金糕</el-dropdown-item>
              <el-dropdown-item @click.native="handleClick">狮子头</el-dropdown-item>
              <el-dropdown-item>螺蛳粉</el-dropdown-item>
              <el-dropdown-item>双皮奶</el-dropdown-item>
              <el-dropdown-item>蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        `
      }, true);
      let dropdownElm = vm.$el;
      let dropdown = vm.$refs.dropdown;
      let triggerElm = dropdownElm.children[0];
  
      triggerEvent(triggerElm, 'mouseenter');
      dropdown.$nextTick(_ => {
        expect(dropdown.visible).to.not.true;
  
        triggerElm.click();
        dropdown.$nextTick(_ => {
          expect(dropdown.visible).to.be.true;
          destroyVM(vm);
          done();
        });
      });
    });
    it('split button', done => {
      vm = createVue({
        template: `
          <el-dropdown split-button type="primary" ref="dropdown">
            更多菜单
            <el-dropdown-menu slot="dropdown" class="dropdown-test-split-button">
              <el-dropdown-item>黄金糕</el-dropdown-item>
              <el-dropdown-item>狮子头</el-dropdown-item>
              <el-dropdown-item>螺蛳粉</el-dropdown-item>
              <el-dropdown-item>双皮奶</el-dropdown-item>
              <el-dropdown-item>蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        `
      }, true);
  
      let dropdown = vm.$refs.dropdown;
      let dropdownElm = dropdown.$el;
      let triggerElm = dropdownElm.querySelector('.el-dropdown__caret-button');
      var callback = sinon.spy();
  
      dropdown.$on('click', callback);
      dropdownElm.querySelector('.el-button').click();
  
      setTimeout(_ => {
        expect(callback.called).to.be.true;
      }, 300);
  
      triggerEvent(triggerElm, 'mouseenter');
      setTimeout(_ => {
        expect(dropdown.visible).to.be.true;
  
        triggerEvent(triggerElm, 'mouseleave');
        setTimeout(_ => {
          expect(dropdown.visible).to.not.true;
          destroyVM(vm);
          done();
        }, 300);
      }, 300);
    });
    it('hide on click', done => {
      vm = createVue({
        template: `
          <el-dropdown ref="dropdown" :hide-on-click="false">
            <span class="el-dropdown-link">
              下拉菜单<i class="el-icon-caret-bottom el-icon-right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="a">黄金糕</el-dropdown-item>
              <el-dropdown-item command="b">狮子头</el-dropdown-item>
              <el-dropdown-item ref="commandC" command="c">螺蛳粉</el-dropdown-item>
              <el-dropdown-item command="d">双皮奶</el-dropdown-item>
              <el-dropdown-item command="e">蚵仔煎</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        `
      }, true);
      let dropdown = vm.$refs.dropdown;
      let dropdownElm = dropdown.$el;
      let triggerElm = dropdownElm.children[0];
      let callback = sinon.spy();
  
      dropdown.$on('command', callback);
  
      triggerEvent(triggerElm, 'mouseenter');
      setTimeout(_ => {
        vm.$refs.commandC.$el.click();
        setTimeout(_ => {
          expect(dropdown.visible).to.true;
          expect(callback.calledWith('c')).to.be.true;
          done();
        }, 300);
      }, 300);
    });
  });
  