test: add dropdown 、popover、 tag、 time-picker tests

Author: tangjinzhou

components/dropdown/__tests__/dropdown-button.test.js

@@ -0,0 +1,34 @@
+import { mount } from '@vue/test-utils'
+import Dropdown from '..'
+
+describe('DropdownButton', () => {
+  it('pass appropriate props to Dropdown', () => {
+    const props = {
+      align: {
+        offset: [10, 20],
+      },
+      disabled: false,
+      trigger: ['hover'],
+      visible: true,
+    }
+
+    const wrapper = mount(Dropdown.Button, {
+      propsData: props,
+      listeners: {
+        visibleChange: () => {},
+      },
+    })
+    const dropdownProps = wrapper.find({ name: 'ADropdown' }).props()
+
+    Object.keys(props).forEach((key) => {
+      expect(dropdownProps[key]).toBe(props[key])
+    })
+  })
+
+  it('don\'t pass visible to Dropdown if it\'s not exits', () => {
+    const wrapper = mount(Dropdown.Button)
+    const dropdownProps = wrapper.find({ name: 'ADropdown' }).props()
+
+    expect('visible' in dropdownProps).toBe(false)
+  })
+})

components/popover/__tests__/__snapshots__/index.test.js.snap

@@ -0,0 +1,25 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Popover should show overlay when trigger is clicked 1`] = `
+<div class="ant-popover-content">
+  <div class="ant-popover-arrow"></div>
+  <div class="ant-popover-inner">
+    <div>
+      <div class="ant-popover-title">code</div>
+      <div class="ant-popover-inner-content">console.log('hello world')</div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Popover should show overlay when trigger is clicked 2`] = `
+<div class="ant-popover-content">
+  <div class="ant-popover-arrow"></div>
+  <div class="ant-popover-inner">
+    <div>
+      <div class="ant-popover-title">code</div>
+      <div class="ant-popover-inner-content">console.log('hello world')</div>
+    </div>
+  </div>
+</div>
+`;

components/popover/__tests__/index.test.js

@@ -0,0 +1,35 @@
+import { mount } from '@vue/test-utils'
+import { asyncExpect } from '@/tests/utils'
+import Popover from '..'
+
+describe('Popover', () => {
+  it('should show overlay when trigger is clicked', async () => {
+    const popover = mount({
+      render () {
+        return (
+          <Popover ref='popover' content="console.log('hello world')" title='code' trigger='click'>
+            <span>show me your code</span>
+          </Popover>
+        )
+      },
+    }, { sync: false })
+    await asyncExpect(() => {
+      expect(popover.vm.$refs.popover.getPopupDomNode()).toBe(null)
+
+      popover.find('span').trigger('click')
+    }, 0)
+    let popup = null
+    await asyncExpect(() => {
+      popup = popover.vm.$refs.popover.getPopupDomNode()
+      expect(popup).not.toBe(null)
+      expect(popup.className).toContain('ant-popover-placement-top')
+    }, 1000)
+    await asyncExpect(() => {
+      expect(popup.innerHTML).toMatchSnapshot()
+      expect(popup.innerHTML).toMatchSnapshot()
+    })
+    await asyncExpect(() => {
+
+    })
+  })
+})

components/tag/__tests__/index.test.js

@@ -0,0 +1,44 @@
+import { mount } from '@vue/test-utils'
+import { asyncExpect } from '@/tests/utils'
+import Tag from '..'
+
+describe('Tag', () => {
+  beforeAll(() => {
+    jest.useFakeTimers()
+  })
+
+  afterAll(() => {
+    jest.useRealTimers()
+  })
+
+  it('should be closable', () => {
+    const onClose = jest.fn()
+    const wrapper = mount({
+      render () {
+        return <Tag closable onClose={onClose} />
+      },
+    })
+    expect(wrapper.findAll('.anticon-cross').length).toBe(1)
+    expect(wrapper.findAll('.ant-tag').length).toBe(1)
+    wrapper.find('.anticon-cross').trigger('click')
+    expect(onClose).toBeCalled()
+    jest.runAllTimers()
+    expect(wrapper.findAll('.ant-tag').length).toBe(0)
+  })
+
+  it('should not be closed when prevent default', () => {
+    const onClose = (e) => {
+      e.preventDefault()
+    }
+    const wrapper = mount({
+      render () {
+        return <Tag closable onClose={onClose} />
+      },
+    })
+    expect(wrapper.findAll('.anticon-cross').length).toBe(1)
+    expect(wrapper.findAll('.ant-tag').length).toBe(1)
+    wrapper.find('.anticon-cross').trigger('click')
+    jest.runAllTimers()
+    expect(wrapper.findAll('.ant-tag').length).toBe(1)
+  })
+})

components/time-picker/__tests__/__snapshots__/index.test.js.snap

@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TimePicker renders addon correctly 1`] = `
+<div class="ant-time-picker-panel-addon">
+  <button>Ok</button>
+</div>
+`;

components/time-picker/__tests__/index.test.js

@@ -0,0 +1,24 @@
+import { mount } from '@vue/test-utils'
+import { asyncExpect } from '@/tests/utils'
+import VcTimePicker from '../../vc-time-picker/TimePicker'
+import TimePicker from '..'
+import focusTest from '../../../tests/shared/focusTest'
+
+describe('TimePicker', () => {
+  focusTest(TimePicker)
+
+  it('renders addon correctly', () => {
+    const wrapper = mount({
+      render () {
+        return <TimePicker addon={() => (<button>Ok</button>)} />
+      },
+    })
+    const vcTimePicker = wrapper.find({ name: VcTimePicker.name })
+    const addonWrapper = mount({
+      render () {
+        return vcTimePicker.vm.$slots.addon[0]
+      },
+    })
+    expect(addonWrapper.html()).toMatchSnapshot()
+  })
+})