test: init @vuepress/test-utils and migrate all tests

ulivz · ulivz · commit eca8a61b0475 · 2018-08-27T19:35:18.000+08:00
diff --git a/package.json b/package.json
@@ -40,22 +40,13 @@
     ]
   },
   "devDependencies": {
-    "@vue/test-utils": "^1.0.0-beta.16",
-    "@babel/core": "^7.0.0-beta.47",
-    "@babel/preset-env": "^7.0.0-beta.47",
-    "babel-core": "^7.0.0-0",
-    "babel-jest": "^23.0.0",
     "conventional-changelog-cli": "^1.3.22",
     "eslint": "^4.19.1",
     "eslint-plugin-jest": "^21.15.1",
     "eslint-plugin-vue-libs": "^3.0.0",
-    "execa": "^0.10.0",
-    "jest": "^23.0.0",
-    "jest-serializer-vue": "^1.0.0",
     "lerna": "^2.11.0",
     "lint-staged": "^7.0.4",
     "minimist": "^1.2.0",
-    "vue-jest": "^2.6.0",
     "yorkie": "^1.0.3"
   },
   "engines": {
diff --git a/packages/@vuepress/core/__test__/app/Content.spec.js b/packages/@vuepress/core/__test__/app/Content.spec.js
@@ -1,6 +1,7 @@
-import Content from '@/app/components/Content'
+import Content from '../../lib/app/components/Content'
 import { mount } from '@vue/test-utils'
-import { getRouter, modeTestRunner } from '../util'
+import modeTestRunner from '@vuepress/test-utils/modeTestRunner'
+import getRouter from '@vuepress/test-utils/getRouter'
 
 function test (mode, localVue) {
   it(`${mode} - add custom class by default.`, () => {
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/.vuepress/config.js b/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/.vuepress/config.js
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/.vuepress/theme/Layout.vue b/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/.vuepress/theme/Layout.vue
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/README.md b/packages/@vuepress/core/__test__/prepare/fixtures/docs-custom-theme/README.md
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple-config/.vuepress/config.js b/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple-config/.vuepress/config.js
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple-config/README.md b/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple-config/README.md
diff --git a/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple/README.md b/packages/@vuepress/core/__test__/prepare/fixtures/docs-simple/README.md
diff --git a/packages/@vuepress/core/__test__/prepare/util.spec.js b/packages/@vuepress/core/__test__/prepare/util.spec.js
@@ -1,7 +1,4 @@
-import {
-  isIndexFile,
-  fileToPath
-} from '@/prepare/util.js'
+import { isIndexFile, fileToPath } from '../../lib/prepare/util.js'
 
 describe('prepare - util', () => {
   test('isIndexFile', () => {
diff --git a/packages/@vuepress/core/__test__/util/parseHeaders.spec.js b/packages/@vuepress/core/__test__/util/parseHeaders.spec.js
@@ -2,7 +2,7 @@ import {
   parseHeaders,
   removeNonCodeWrappedHTML,
   deeplyParseHeaders
-} from '@/util/parseHeaders'
+} from '../../lib/util/parseHeaders'
 
 describe('parseHeaders', () => {
   test('should unescape html', () => {
diff --git a/packages/@vuepress/core/lib/app/app.js b/packages/@vuepress/core/lib/app/app.js
@@ -6,6 +6,7 @@ import { routes } from '@internal/routes'
 import { siteData } from '@internal/siteData'
 import appEnhancers from '@internal/app-enhancers'
 import globalUIComponents from '@internal/global-ui'
+import I18n from '@internal/i18n'
 
 // generated from user config
 import('@temp/style.styl')
@@ -31,7 +32,7 @@ if (module.hot) {
 Vue.config.productionTip = false
 Vue.use(Router)
 // mixin for exposing $site and $page
-Vue.mixin(dataMixin(siteData))
+Vue.mixin(dataMixin(I18n, siteData))
 // component for rendering markdown content and setting title etc.
 Vue.component('Content', Content)
 Vue.component('OutboundLink', OutboundLink)
diff --git a/packages/@vuepress/core/lib/app/dataMixin.js b/packages/@vuepress/core/lib/app/dataMixin.js
@@ -1,9 +1,8 @@
 /* global VUEPRESS_TEMP_PATH */
 
 import Vue from 'vue'
-import I18n from '@internal/i18n'
 
-export default function dataMixin (siteData) {
+export default function dataMixin (I18n, siteData) {
   prepare(siteData)
   const store = new Vue({
     data: {
diff --git a/packages/@vuepress/test-utils/.npmignore b/packages/@vuepress/test-utils/.npmignore
@@ -0,0 +1,2 @@
+__tests__
+__mocks__
diff --git a/packages/@vuepress/test-utils/README.md b/packages/@vuepress/test-utils/README.md
@@ -0,0 +1,3 @@
+# @vuepress/test-utils
+
+> test-utils for vuepress
diff --git a/packages/@vuepress/test-utils/createJestConfig.js b/packages/@vuepress/test-utils/createJestConfig.js
@@ -0,0 +1,5 @@
+const defaultJestConfig = require('./jest/jest.config')
+
+module.exports = function createJestConfig (override) {
+  return Object.assign({}, defaultJestConfig, override)
+}
diff --git a/packages/@vuepress/test-utils/createJestRunner.js b/packages/@vuepress/test-utils/createJestRunner.js
@@ -0,0 +1,14 @@
+const execa = require('execa')
+const rawArgs = process.argv.slice(2)
+
+module.exports = function createJestRunner (jestArgs) {
+  return async function () {
+    console.log(`running jest with args: ${jestArgs.join(' ')}`)
+    await execa('jest', [
+      ...jestArgs,
+      ...rawArgs
+    ], {
+      stdio: 'inherit'
+    })
+  }
+}
diff --git a/packages/@vuepress/test-utils/fixtures/docs-i18n/.vuepress/config.js b/packages/@vuepress/test-utils/fixtures/docs-i18n/.vuepress/config.js
@@ -0,0 +1,34 @@
+module.exports = {
+  dest: 'vuepress',
+  locales: {
+    '/': {
+      lang: 'en-US',
+      title: 'VuePress',
+      description: 'Vue-powered Static Site Generator'
+    },
+    '/zh/': {
+      lang: 'zh-CN',
+      title: 'VuePress',
+      description: 'Vue 驱动的静态网站生成器'
+    }
+  },
+  themeConfig: {
+    repo: 'vuejs/vuepress',
+    editLinks: true,
+    docsDir: 'docs',
+    locales: {
+      '/': {
+        label: 'English',
+        selectText: 'Languages',
+        editLinkText: 'Edit this page on GitHub',
+        lastUpdated: 'Last Updated'
+      },
+      '/zh/': {
+        label: '简体中文',
+        selectText: '选择语言',
+        editLinkText: '在 GitHub 上编辑此页',
+        lastUpdated: '上次更新',
+      }
+    }
+  }
+}
diff --git a/packages/@vuepress/test-utils/fixtures/docs-i18n/README.md b/packages/@vuepress/test-utils/fixtures/docs-i18n/README.md
@@ -0,0 +1 @@
+# Hello, VuePress!
diff --git a/packages/@vuepress/test-utils/fixtures/docs-i18n/zh/README.md b/packages/@vuepress/test-utils/fixtures/docs-i18n/zh/README.md
@@ -0,0 +1 @@
+# 你好, VuePress!
diff --git a/packages/@vuepress/test-utils/fixtures/docs-simple/README.md b/packages/@vuepress/test-utils/fixtures/docs-simple/README.md
@@ -0,0 +1 @@
+# Hello, VuePress!
diff --git a/packages/@vuepress/test-utils/getRouter.js b/packages/@vuepress/test-utils/getRouter.js
@@ -0,0 +1,5 @@
+const Router = require('vue-router')
+
+module.exports = function () {
+  return new Router()
+}
diff --git a/packages/@vuepress/test-utils/jest/jest.config.js b/packages/@vuepress/test-utils/jest/jest.config.js
@@ -0,0 +1,28 @@
+// https://github.com/facebook/jest/tree/master/packages/babel-jest
+// TODO remove 'babel-core@^7.0.0-0' when babel-jest can work with '@babel/core'
+
+const path = require('path')
+
+module.exports = {
+  rootDir: path.resolve(__dirname, '..'),
+  verbose: true,
+  testURL: 'http://localhost/',
+  moduleFileExtensions: [
+    'js',
+    'vue'
+  ],
+  testPathIgnorePatterns: [
+    'test.js',
+    path.resolve(__dirname, '../test')
+  ],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/$1'
+  },
+  transform: {
+    '^.+\\.js$': '<rootDir>/node_modules/babel-jest',
+    '.*\\.(vue)$': '<rootDir>/node_modules/vue-jest'
+  },
+  snapshotSerializers: [
+    '<rootDir>/node_modules/jest-serializer-vue'
+  ]
+}
diff --git a/packages/@vuepress/test-utils/meta.js b/packages/@vuepress/test-utils/meta.js
@@ -0,0 +1,12 @@
+const { fs } = require('@vuepress/shared-utils')
+const path = require('path')
+
+const docsBaseDir = path.resolve(__dirname, 'fixtures')
+const docsModeNames = fs.readdirSync(docsBaseDir)
+const docsModes = docsModeNames.map(name => {
+  const docsPath = path.resolve(docsBaseDir, name)
+  const docsTempPath = path.resolve(docsPath, '.vuepress/.temp')
+  return { name, docsPath, docsTempPath }
+})
+
+exports.docsModes = docsModes
diff --git a/packages/@vuepress/test-utils/mockComponent.js b/packages/@vuepress/test-utils/mockComponent.js
@@ -10,7 +10,7 @@ const Component = {
 // When the child component is a pure presentation component,
 // we want to be able to display a sub-component with minimal info,
 // rather than stubbing it directly.
-export function mockComponent (name) {
+module.exports = function mockComponent (name) {
   return {
     render (h) {
       return h(Component, { props: { name }})
diff --git a/packages/@vuepress/test-utils/modeTestRunner.js b/packages/@vuepress/test-utils/modeTestRunner.js
@@ -0,0 +1,34 @@
+const { createLocalVue } = require('@vue/test-utils')
+const dataMixin = require('@vuepress/core/lib/app/dataMixin').default
+const I18n = require('@vuepress/core/lib/prepare/I18n')
+const Router = require('vue-router')
+const mockComponent = require('./mockComponent')
+const { docsModes } = require('./meta')
+
+function getLocalVueByMode (mode) {
+  const localVue = createLocalVue()
+  localVue.use(Router)
+
+  // register global component
+  localVue.component('OutboundLink', mockComponent('outbound-link'))
+
+  const { siteData } = require(`${mode.docsTempPath}/internal/siteData.js`)
+  localVue.component(siteData.pages[0].key, mockComponent('page-component'))
+  localVue.mixin(dataMixin(I18n, siteData))
+  return localVue
+}
+
+/**
+ * Used to test components in VuePress at different mode.
+ * Since VuePress has two main modes, i18n or normal mode, we need to make
+ * sure that the core Vue components in VuePress work well in both modes.
+ * @param description
+ * @param testFn
+ */
+module.exports = function modeTestRunner (description, testFn) {
+  docsModes.forEach(mode => {
+    describe(description, () => {
+      testFn(mode.name, getLocalVueByMode(mode))
+    })
+  })
+}
diff --git a/packages/@vuepress/test-utils/package.json b/packages/@vuepress/test-utils/package.json
@@ -0,0 +1,37 @@
+{
+  "name": "@vuepress/test-utils",
+  "version": "1.0.0",
+  "description": "test-utils for vuepress",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vuejs/vuepress.git"
+  },
+  "keywords": [
+    "documentation",
+    "vue",
+    "vuepress",
+    "generator"
+  ],
+  "dependencies": {
+    "@vuepress/core": "^1.0.0",
+    "@vuepress/shared-utils": "^1.0.0",
+    "@vue/test-utils": "^1.0.0-beta.16",
+    "@babel/core": "^7.0.0-beta.47",
+    "@babel/preset-env": "^7.0.0-beta.47",
+    "babel-core": "^7.0.0-0",
+    "babel-jest": "^23.0.0",
+    "jest": "^23.0.0",
+    "jest-serializer-vue": "^1.0.0",
+    "vue-jest": "^2.6.0",
+    "execa": "^0.10.0"
+  },
+  "author": "Evan You",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/vuejs/vuepress/issues"
+  },
+  "homepage": "https://github.com/vuejs/vuepress/packages/@vuepress/test-utils#readme"
+}
diff --git a/packages/@vuepress/test-utils/prepare.js b/packages/@vuepress/test-utils/prepare.js
@@ -0,0 +1,17 @@
+const { fs, logger } = require('@vuepress/shared-utils')
+const prepare = require('@vuepress/core/lib/prepare')
+const { docsModes } = require('./meta')
+
+async function prepareForTest () {
+  await Promise.all(docsModes.map(async ({ docsPath, docsTempPath }) => {
+    await fs.ensureDir(docsTempPath)
+    await prepare(docsPath, { theme: 'default', temp: docsTempPath })
+  }))
+}
+
+module.exports = function globalSetup () {
+  logger.wait('Start preparing for testing ...')
+  return prepareForTest().then(() => {
+    logger.wait('Finished preparing for testing ...')
+  })
+}
diff --git a/packages/@vuepress/theme-default/__test__/components/DropdownLink.spec.js b/packages/@vuepress/theme-default/__test__/components/DropdownLink.spec.js
@@ -1,6 +1,6 @@
 import { mount, RouterLinkStub } from '@vue/test-utils'
-import DropdownLink from '@/default-theme/DropdownLink.vue'
-import { modeTestRunner } from '../util'
+import DropdownLink from '../../src/DropdownLink.vue'
+import modeTestRunner from '@vuepress/test-utils/modeTestRunner'
 
 function test (mode, localVue) {
   it(`$${mode} - renders dropdown link.`, () => {
diff --git a/packages/@vuepress/theme-default/__test__/components/NavLink.spec.js b/packages/@vuepress/theme-default/__test__/components/NavLink.spec.js
@@ -1,6 +1,6 @@
 import { mount, RouterLinkStub } from '@vue/test-utils'
-import { modeTestRunner } from '../util'
-import NavLink from '@/default-theme/NavLink.vue'
+import modeTestRunner from '@vuepress/test-utils/modeTestRunner'
+import NavLink from '../../src/NavLink.vue'
 
 function test (mode, localVue) {
   it(`$${mode} - renders nav link with internal link`, () => {
diff --git a/packages/@vuepress/theme-default/__test__/components/__snapshots__/DropdownLink.spec.js.snap b/packages/@vuepress/theme-default/__test__/components/__snapshots__/DropdownLink.spec.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`DropdownLink $i18n - renders dropdown link. 1`] = `
+exports[`DropdownLink $docs-i18n - renders dropdown link. 1`] = `
 <div class="dropdown-wrapper">
   <a class="dropdown-title"><span class="title">VuePress</span> <span class="arrow right"></span></a>
   <ul class="nav-dropdown" style="display: none;" name="dropdown">
@@ -16,7 +16,7 @@ exports[`DropdownLink $i18n - renders dropdown link. 1`] = `
 </div>
 `;
 
-exports[`DropdownLink $simple - renders dropdown link. 1`] = `
+exports[`DropdownLink $docs-simple - renders dropdown link. 1`] = `
 <div class="dropdown-wrapper">
   <a class="dropdown-title"><span class="title">VuePress</span> <span class="arrow right"></span></a>
   <ul class="nav-dropdown" style="display: none;" name="dropdown">
diff --git a/packages/@vuepress/theme-default/__test__/components/__snapshots__/NavLink.spec.js.snap b/packages/@vuepress/theme-default/__test__/components/__snapshots__/NavLink.spec.js.snap
@@ -1,19 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`NavLink $i18n - renders nav link with external link 1`] = `
+exports[`NavLink $docs-i18n - renders nav link with external link 1`] = `
 <a href="http://vuejs.org/" target="_blank" rel="noopener noreferrer" class="nav-link external">
   Vue
   <p class="component outbound-link">outbound-link</p>
 </a>
 `;
 
-exports[`NavLink $i18n - renders nav link with internal link 1`] = `<a class="nav-link">VuePress</a>`;
+exports[`NavLink $docs-i18n - renders nav link with internal link 1`] = `<a class="nav-link">VuePress</a>`;
 
-exports[`NavLink $simple - renders nav link with external link 1`] = `
+exports[`NavLink $docs-simple - renders nav link with external link 1`] = `
 <a href="http://vuejs.org/" target="_blank" rel="noopener noreferrer" class="nav-link external">
   Vue
   <p class="component outbound-link">outbound-link</p>
 </a>
 `;
 
-exports[`NavLink $simple - renders nav link with internal link 1`] = `<a class="nav-link">VuePress</a>`;
+exports[`NavLink $docs-simple - renders nav link with internal link 1`] = `<a class="nav-link">VuePress</a>`;
diff --git a/scripts/jest.config.js b/scripts/jest.config.js
@@ -1,28 +1,11 @@
-// https://github.com/facebook/jest/tree/master/packages/babel-jest
-// TODO remove 'babel-core@^7.0.0-0' when babel-jest can work with '@babel/core'
-
 const path = require('path')
+const createJestConfig = require('@vuepress/test-utils/createJestConfig')
 
-module.exports = {
+module.exports = createJestConfig({
   rootDir: path.resolve(__dirname, '..'),
-  verbose: true,
-  testURL: 'http://localhost/',
-  moduleFileExtensions: [
-    'js',
-    'vue'
-  ],
-  testPathIgnorePatterns: [
-    'test.js',
-    path.resolve(__dirname, '../test')
-  ],
   moduleNameMapper: {
-    '^@/(.*)$': '<rootDir>/$1'
-  },
-  transform: {
-    '^.+\\.js$': '<rootDir>/node_modules/babel-jest',
-    '.*\\.(vue)$': '<rootDir>/node_modules/vue-jest'
+    '^@/(.*)$': '<rootDir>/$1',
+    '^@core/(.*)$': '<rootDir>/packages/@vuepress/core/$1'
   },
-  snapshotSerializers: [
-    '<rootDir>/node_modules/jest-serializer-vue'
-  ]
-}
+  globalSetup: '<rootDir>/packages/@vuepress/test-utils/prepare.js'
+})
diff --git a/scripts/test.js b/scripts/test.js
diff --git a/test/docs-simple/README.md b/test/docs-simple/README.md
diff --git a/test/prepare.js b/test/prepare.js
diff --git a/test/prepare/resolveOptions.spec.js b/test/prepare/resolveOptions.spec.js
diff --git a/test/util.js b/test/util.js
