From 51f99770fe1c28b7bc904dbc68a60c1e29093980 Mon Sep 17 00:00:00 2001
From: Pan <panfree23@gmail.com>
Date: Mon, 29 Oct 2018 15:29:54 +0800
Subject: [PATCH] add test

---
 .gitignore                              |  4 ++--
 babel.config.js                         | 13 ++---------
 jest.config.js                          | 24 ++++++++++++++++++++
 package.json                            |  1 +
 src/components/Hamburger/index.vue      |  9 ++++----
 src/utils/index.js                      |  6 ++++-
 src/utils/validate.js                   |  2 +-
 src/views/layout/components/Navbar.vue  |  2 +-
 src/views/login/index.vue               |  4 ++--
 tests/unit/.eslintrc.js                 |  5 +++++
 tests/unit/components/Hamburger.spec.js | 18 +++++++++++++++
 tests/unit/components/SvgIcon.spec.js   | 22 +++++++++++++++++++
 tests/unit/utils/formatTime.spec.js     | 29 +++++++++++++++++++++++++
 tests/unit/utils/parseTime.spec.js      | 27 +++++++++++++++++++++++
 tests/unit/utils/validate.spec.js       | 28 ++++++++++++++++++++++++
 15 files changed, 172 insertions(+), 22 deletions(-)
 create mode 100644 jest.config.js
 create mode 100644 tests/unit/.eslintrc.js
 create mode 100644 tests/unit/components/Hamburger.spec.js
 create mode 100644 tests/unit/components/SvgIcon.spec.js
 create mode 100644 tests/unit/utils/formatTime.spec.js
 create mode 100644 tests/unit/utils/parseTime.spec.js
 create mode 100644 tests/unit/utils/validate.spec.js

diff --git a/.gitignore b/.gitignore
index 887ce1ed..78a752d8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,8 +6,8 @@ yarn-debug.log*
 yarn-error.log*
 **/*.log
 
-test/unit/coverage
-test/e2e/reports
+tests/**/coverage/
+tests/e2e/reports
 selenium-debug.log
 
 # Editor directories and files
diff --git a/babel.config.js b/babel.config.js
index 6f812f61..ba179669 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,14 +1,5 @@
 module.exports = {
   presets: [
-    ['@vue/app', { modules: 'commonjs' }]
-  ],
-  plugins: [],
-  env: {
-    test: {
-      presets: [
-        ['@vue/app', { modules: 'commonjs' }]
-      ],
-      plugins: ['istanbul']
-    }
-  }
+    '@vue/app'
+  ]
 }
diff --git a/jest.config.js b/jest.config.js
new file mode 100644
index 00000000..5a8aa6bb
--- /dev/null
+++ b/jest.config.js
@@ -0,0 +1,24 @@
+module.exports = {
+  verbose: true,
+  moduleFileExtensions: ['js', 'jsx', 'json', 'vue'],
+  transform: {
+    '^.+\\.vue$': 'vue-jest',
+    '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
+    '^.+\\.jsx?$': 'babel-jest'
+  },
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1'
+  },
+  snapshotSerializers: ['jest-serializer-vue'],
+  testMatch: [
+    '**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
+  ],
+  collectCoverageFrom: ['src/utils/**/*.{js,vue}', '!src/utils/auth.js', '!src/utils/request.js', 'src/components/**/*.{js,vue}'],
+  coverageDirectory: '<rootDir>/tests/unit/coverage',
+  // 'collectCoverage': true,
+  'coverageReporters': [
+    'lcov',
+    'text-summary'
+  ],
+  testURL: 'http://localhost/'
+}
diff --git a/package.json b/package.json
index 2a11617a..90812d59 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
     "build:sit": "vue-cli-service build --mode text",
     "lint": "eslint --ext .js,.vue src",
     "test": "npm run lint",
+    "test:unit": "vue-cli-service test:unit",
     "precommit": "lint-staged",
     "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
   },
diff --git a/src/components/Hamburger/index.vue b/src/components/Hamburger/index.vue
index 26472e23..04c5881a 100644
--- a/src/components/Hamburger/index.vue
+++ b/src/components/Hamburger/index.vue
@@ -33,10 +33,11 @@ export default {
     isActive: {
       type: Boolean,
       default: false
-    },
-    toggleClick: {
-      type: Function,
-      default: null
+    }
+  },
+  methods: {
+    toggleClick() {
+      this.$emit('toggleClick')
     }
   }
 }
diff --git a/src/utils/index.js b/src/utils/index.js
index 0445827b..766906a2 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -36,7 +36,11 @@ export function parseTime(time, cFormat) {
 }
 
 export function formatTime(time, option) {
-  time = +time * 1000
+  if (('' + time).length === 10) {
+    time = parseInt(time) * 1000
+  } else {
+    time = +time
+  }
   const d = new Date(time)
   const now = Date.now()
 
diff --git a/src/utils/validate.js b/src/utils/validate.js
index ada0e7e2..b4800be3 100644
--- a/src/utils/validate.js
+++ b/src/utils/validate.js
@@ -2,7 +2,7 @@
  * Created by jiachenpan on 16/11/18.
  */
 
-export function isvalidUsername(str) {
+export function validUsername(str) {
   const valid_map = ['admin', 'editor']
   return valid_map.indexOf(str.trim()) >= 0
 }
diff --git a/src/views/layout/components/Navbar.vue b/src/views/layout/components/Navbar.vue
index 7bae38e0..6899f399 100644
--- a/src/views/layout/components/Navbar.vue
+++ b/src/views/layout/components/Navbar.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="navbar">
-    <hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container"/>
+    <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar"/>
 
     <breadcrumb class="breadcrumb-container"/>
 
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index d25b519d..920c1696 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -63,7 +63,7 @@
 </template>
 
 <script>
-import { isvalidUsername } from '@/utils/validate'
+import { validUsername } from '@/utils/validate'
 import LangSelect from '@/components/LangSelect'
 import SocialSign from './socialsignin'
 
@@ -72,7 +72,7 @@ export default {
   components: { LangSelect, SocialSign },
   data() {
     const validateUsername = (rule, value, callback) => {
-      if (!isvalidUsername(value)) {
+      if (!validUsername(value)) {
         callback(new Error('Please enter the correct user name'))
       } else {
         callback()
diff --git a/tests/unit/.eslintrc.js b/tests/unit/.eslintrc.js
new file mode 100644
index 00000000..958d51ba
--- /dev/null
+++ b/tests/unit/.eslintrc.js
@@ -0,0 +1,5 @@
+module.exports = {
+  env: {
+    jest: true
+  }
+}
diff --git a/tests/unit/components/Hamburger.spec.js b/tests/unit/components/Hamburger.spec.js
new file mode 100644
index 00000000..01ea303a
--- /dev/null
+++ b/tests/unit/components/Hamburger.spec.js
@@ -0,0 +1,18 @@
+import { shallowMount } from '@vue/test-utils'
+import Hamburger from '@/components/Hamburger/index.vue'
+describe('Hamburger.vue', () => {
+  it('toggle click', () => {
+    const wrapper = shallowMount(Hamburger)
+    const mockFn = jest.fn()
+    wrapper.vm.$on('toggleClick', mockFn)
+    wrapper.find('.hamburger').trigger('click')
+    expect(mockFn).toBeCalled()
+  })
+  it('prop isActive', () => {
+    const wrapper = shallowMount(Hamburger)
+    wrapper.setProps({ isActive: true })
+    expect(wrapper.contains('.is-active')).toBe(true)
+    wrapper.setProps({ isActive: false })
+    expect(wrapper.contains('.is-active')).toBe(false)
+  })
+})
diff --git a/tests/unit/components/SvgIcon.spec.js b/tests/unit/components/SvgIcon.spec.js
new file mode 100644
index 00000000..31467a9f
--- /dev/null
+++ b/tests/unit/components/SvgIcon.spec.js
@@ -0,0 +1,22 @@
+import { shallowMount } from '@vue/test-utils'
+import SvgIcon from '@/components/SvgIcon/index.vue'
+describe('SvgIcon.vue', () => {
+  it('iconClass', () => {
+    const wrapper = shallowMount(SvgIcon, {
+      propsData: {
+        iconClass: 'test'
+      }
+    })
+    expect(wrapper.find('use').attributes().href).toBe('#icon-test')
+  })
+  it('className', () => {
+    const wrapper = shallowMount(SvgIcon, {
+      propsData: {
+        iconClass: 'test'
+      }
+    })
+    expect(wrapper.classes().length).toBe(1)
+    wrapper.setProps({ className: 'test' })
+    expect(wrapper.classes().includes('test')).toBe(true)
+  })
+})
diff --git a/tests/unit/utils/formatTime.spec.js b/tests/unit/utils/formatTime.spec.js
new file mode 100644
index 00000000..d07e414f
--- /dev/null
+++ b/tests/unit/utils/formatTime.spec.js
@@ -0,0 +1,29 @@
+import { formatTime } from '@/utils/index.js'
+describe('Utils:formatTime', () => {
+  const d = new Date('2018-07-13 17:54:01') // "2018-07-13 17:54:01"
+  const retrofit = 5 * 1000
+
+  it('ten digits timestamp', () => {
+    expect(formatTime((d / 1000).toFixed(0))).toBe('7月13日17时54分')
+  })
+  it('test now', () => {
+    expect(formatTime(+new Date() - 1)).toBe('刚刚')
+  })
+  it('less two minute', () => {
+    expect(formatTime(+new Date() - 60 * 2 * 1000 + retrofit)).toBe('2分钟前')
+  })
+  it('less two hour', () => {
+    expect(formatTime(+new Date() - 60 * 60 * 2 * 1000 + retrofit)).toBe('2小时前')
+  })
+  it('less one day', () => {
+    expect(formatTime(+new Date() - 60 * 60 * 24 * 1 * 1000)).toBe('1天前')
+  })
+  it('more than one day', () => {
+    expect(formatTime(d)).toBe('7月13日17时54分')
+  })
+  it('format', () => {
+    expect(formatTime(d, '{y}-{m}-{d} {h}:{i}')).toBe('2018-07-13 17:54')
+    expect(formatTime(d, '{y}-{m}-{d}')).toBe('2018-07-13')
+    expect(formatTime(d, '{y}/{m}/{d} {h}-{i}')).toBe('2018/07/13 17-54')
+  })
+})
diff --git a/tests/unit/utils/parseTime.spec.js b/tests/unit/utils/parseTime.spec.js
new file mode 100644
index 00000000..77ecb9d5
--- /dev/null
+++ b/tests/unit/utils/parseTime.spec.js
@@ -0,0 +1,27 @@
+import { parseTime } from '@/utils/index.js'
+describe('Utils:parseTime', () => {
+  const d = new Date('2018-07-13 17:54:01') // "2018-07-13 17:54:01"
+  it('timestamp', () => {
+    expect(parseTime(d)).toBe('2018-07-13 17:54:01')
+  })
+  it('ten digits timestamp', () => {
+    expect(parseTime((d / 1000).toFixed(0))).toBe('2018-07-13 17:54:01')
+  })
+  it('new Date', () => {
+    expect(parseTime(new Date(d))).toBe('2018-07-13 17:54:01')
+  })
+  it('format', () => {
+    expect(parseTime(d, '{y}-{m}-{d} {h}:{i}')).toBe('2018-07-13 17:54')
+    expect(parseTime(d, '{y}-{m}-{d}')).toBe('2018-07-13')
+    expect(parseTime(d, '{y}/{m}/{d} {h}-{i}')).toBe('2018/07/13 17-54')
+  })
+  it('get the day of the week', () => {
+    expect(parseTime(d, '{a}')).toBe('五') // 星期五
+  })
+  it('get the day of the week', () => {
+    expect(parseTime(+d + 1000 * 60 * 60 * 24 * 2, '{a}')).toBe('日') // 星期日
+  })
+  it('empty argument', () => {
+    expect(parseTime()).toBeNull()
+  })
+})
diff --git a/tests/unit/utils/validate.spec.js b/tests/unit/utils/validate.spec.js
new file mode 100644
index 00000000..b7d21922
--- /dev/null
+++ b/tests/unit/utils/validate.spec.js
@@ -0,0 +1,28 @@
+import { validUsername, validateURL, validateLowerCase, validateUpperCase, validateAlphabets } from '@/utils/validate.js'
+describe('Utils:validate', () => {
+  it('validUsername', () => {
+    expect(validUsername('admin')).toBe(true)
+    expect(validUsername('editor')).toBe(true)
+    expect(validUsername('xxxx')).toBe(false)
+  })
+  it('validateURL', () => {
+    expect(validateURL('https://github.com/PanJiaChen/vue-element-admin')).toBe(true)
+    expect(validateURL('http://github.com/PanJiaChen/vue-element-admin')).toBe(true)
+    expect(validateURL('github.com/PanJiaChen/vue-element-admin')).toBe(false)
+  })
+  it('validateLowerCase', () => {
+    expect(validateLowerCase('abc')).toBe(true)
+    expect(validateLowerCase('Abc')).toBe(false)
+    expect(validateLowerCase('123abc')).toBe(false)
+  })
+  it('validateUpperCase', () => {
+    expect(validateUpperCase('ABC')).toBe(true)
+    expect(validateUpperCase('Abc')).toBe(false)
+    expect(validateUpperCase('123ABC')).toBe(false)
+  })
+  it('validateAlphabets', () => {
+    expect(validateAlphabets('ABC')).toBe(true)
+    expect(validateAlphabets('Abc')).toBe(true)
+    expect(validateAlphabets('123aBC')).toBe(false)
+  })
+})