Skip to content

Commit fd65d24

Browse files
LinusBorgLinusBorg
authored
Improve template CI tests (close vuejs-templates#1218)
* Batman! * fix wrong job name * fix working dir paths * fix node_modules path * test other step order * try other shell * ...and another one * rewrite test.sh * try running a bash script instead * and another attempt. * make executable * anpother try... * fix workflow errors * fix path * Batman! * added scenarios and made it work!! * refactors and comments * just fumbling around * adfda * adjust test scenarios for autoInstall * x<vb<xb * first try since a long time * small fix * fix path to vue-cli * fix scenarios * fix persist paths * testing with quotes for the path * removing unhelpful quotes * New Test * fixed indentation * test with full setup * 2nd full test * bump jest version * other docker image * test with runinband * test with airbnb/karma as well * remove superfluous checkout * run unit and e2e individually. * fix eslint paths for test subdirs * adjust for airbnb preset * only lint e2e specs, config differences are unfixable. * adding a small readme * remove test.sh not needed anymore
1 parent f21376d commit fd65d24

File tree

11 files changed

+247
-27
lines changed

11 files changed

+247
-27
lines changed

‎.circleci/config.yml‎

Lines changed: 137 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
version: 2
2+
vm_settings: &vm_settings
3+
docker:
4+
- image: circleci/node:8.9.4-browsers
5+
6+
jobs:
7+
install_template_deps:
8+
<<: *vm_settings
9+
working_directory: ~/project/webpack-template
10+
steps:
11+
- checkout
12+
- restore_cache:
13+
key: template-cache-{{ checksum "package.json" }}
14+
- run:
15+
name: Install npm dependencies
16+
command: npm install
17+
- save_cache:
18+
key: template-cache-{{ checksum "package.json" }}
19+
paths:
20+
- node_modules
21+
- run:
22+
name: Rollout minimal scenario
23+
command: VUE_TEMPL_TEST=minimal node_modules/.bin/vue init . test-minimal
24+
- run:
25+
name: Rollout full scenario
26+
command: VUE_TEMPL_TEST=full node_modules/.bin/vue init . test-full
27+
- run:
28+
name: Rollout full-karma-airbnb scenario
29+
command: VUE_TEMPL_TEST=full-karma-airbnb node_modules/.bin/vue init . test-full-karma-airbnb
30+
- persist_to_workspace:
31+
root: ~/project/webpack-template
32+
paths:
33+
- node_modules
34+
- test-*
35+
36+
scenario_minimal:
37+
<<: *vm_settings
38+
environment:
39+
- VUE_TEMPL_TEST: minimal
40+
working_directory: ~/project/webpack-template/test-minimal
41+
steps:
42+
- attach_workspace:
43+
at: '~/project/webpack-template'
44+
- restore_cache:
45+
key: template-cache-minimal-{{ checksum "package.json" }}
46+
- run:
47+
name: Install npm dependencies
48+
command: npm install
49+
- save_cache:
50+
key: template-cache-minimal-{{ checksum "package.json" }}
51+
paths:
52+
- node_modules
53+
- run:
54+
name: Test build
55+
command: npm run build
56+
57+
scenario_full:
58+
<<: *vm_settings
59+
working_directory: ~/project/webpack-template/test-full
60+
environment:
61+
- VUE_TEMPL_TEST: full
62+
steps:
63+
- attach_workspace:
64+
at: '~/project/webpack-template'
65+
- restore_cache:
66+
key: template-cache-full-{{ checksum "package.json" }}
67+
- run:
68+
name: Install npm dependencies
69+
command: npm install
70+
- save_cache:
71+
key: template-cache-full-{{ checksum "package.json" }}
72+
paths:
73+
- node_modules
74+
- run:
75+
name: Run Lint
76+
command: npm run lint -- --fix
77+
- run:
78+
name: Run Unit tests
79+
command: npm run unit
80+
when: always
81+
- run:
82+
name: Run e2e tests
83+
command: npm run e2e
84+
when: always
85+
- run:
86+
name: Test build
87+
command: npm run build
88+
when: always
89+
90+
scenario_full-karma-airbnb:
91+
<<: *vm_settings
92+
working_directory: ~/project/webpack-template/test-full-karma-airbnb
93+
environment:
94+
- VUE_TEMPL_TEST: full-karma-airbnb
95+
steps:
96+
- attach_workspace:
97+
at: '~/project/webpack-template'
98+
- restore_cache:
99+
key: template-cache-full-karma-airbnb-{{ checksum "package.json" }}
100+
- run:
101+
name: Install npm dependencies
102+
command: npm install
103+
- save_cache:
104+
key: template-cache-full-karma-airbnb-{{ checksum "package.json" }}
105+
paths:
106+
- node_modules
107+
- run:
108+
name: Run Lint
109+
command: npm run lint -- --fix
110+
- run:
111+
name: Run Unit tests
112+
command: npm run unit
113+
when: always
114+
- run:
115+
name: Run e2e tests
116+
command: npm run e2e
117+
when: always
118+
- run:
119+
name: Test build
120+
command: npm run build
121+
when: always
122+
123+
124+
workflows:
125+
version: 2
126+
build_and_test:
127+
jobs:
128+
- install_template_deps
129+
- scenario_minimal:
130+
requires:
131+
- install_template_deps
132+
- scenario_full:
133+
requires:
134+
- install_template_deps
135+
- scenario_full-karma-airbnb:
136+
requires:
137+
- install_template_deps

‎circle.yml‎

Lines changed: 0 additions & 13 deletions
This file was deleted.

‎meta.js‎

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const path = require('path')
22
const fs = require('fs')
3+
34
const {
45
sortDependencies,
56
installDependencies,
@@ -10,9 +11,16 @@ const pkg = require('./package.json')
1011

1112
const templateVersion = pkg.version
1213

14+
const { addTestAnswers } = require('./scenarios')
15+
1316
module.exports = {
17+
metalsmith: {
18+
// When running tests for the template, this adds answers for the selected scenario
19+
before: addTestAnswers
20+
},
1421
helpers: {
1522
if_or(v1, v2, options) {
23+
1624
if (v1 || v2) {
1725
return options.fn(this)
1826
}
@@ -26,21 +34,25 @@ module.exports = {
2634

2735
prompts: {
2836
name: {
37+
when: 'isNotTest',
2938
type: 'string',
3039
required: true,
3140
message: 'Project name',
3241
},
3342
description: {
43+
when: 'isNotTest',
3444
type: 'string',
3545
required: false,
3646
message: 'Project description',
3747
default: 'A Vue.js project',
3848
},
3949
author: {
50+
when: 'isNotTest',
4051
type: 'string',
4152
message: 'Author',
4253
},
4354
build: {
55+
when: 'isNotTest',
4456
type: 'list',
4557
message: 'Vue build',
4658
choices: [
@@ -58,15 +70,17 @@ module.exports = {
5870
],
5971
},
6072
router: {
73+
when: 'isNotTest',
6174
type: 'confirm',
6275
message: 'Install vue-router?',
6376
},
6477
lint: {
78+
when: 'isNotTest',
6579
type: 'confirm',
6680
message: 'Use ESLint to lint your code?',
6781
},
6882
lintConfig: {
69-
when: 'lint',
83+
when: 'isNotTest && lint',
7084
type: 'list',
7185
message: 'Pick an ESLint preset',
7286
choices: [
@@ -88,11 +102,12 @@ module.exports = {
88102
],
89103
},
90104
unit: {
105+
when: 'isNotTest',
91106
type: 'confirm',
92107
message: 'Set up unit tests',
93108
},
94109
runner: {
95-
when: 'unit',
110+
when: 'isNotTest && unit',
96111
type: 'list',
97112
message: 'Pick a test runner',
98113
choices: [
@@ -114,10 +129,12 @@ module.exports = {
114129
],
115130
},
116131
e2e: {
132+
when: 'isNotTest',
117133
type: 'confirm',
118134
message: 'Setup e2e tests with Nightwatch?',
119135
},
120136
autoInstall: {
137+
when: 'isNotTest',
121138
type: 'list',
122139
message:
123140
'Should we run `npm install` for you after the project has been created? (recommended)',

‎scenarios/README.md‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
## What is this folder?
2+
3+
This folder contains test scenarios for the automated tests of the template on CircleCI.
4+
5+
Each `.json`file contains an object that represents a set of answers to the questions that vue-cli asks the user when installing the template.
6+
7+
With the code from `index.js`, we insert those answers into the metalsmith metadata and skip the inquirer questions, thus allowing us to run different test scenarios in CI without having to actually provide any answers to inquirer or to mock it.
8+
9+
## The scenarios
10+
11+
We currently have 3 scenrios set up:
12+
13+
1. 'minimal': it basically answers "no" to ever choice, so no router, no elint, no tests
14+
2. 'full': It answers "yes" to every choice. With router, with linting (standard), with full tests (jest & e2e)
15+
3. 'full-airbnb-karma': like 'full', but using airbnb eslint config instead od standard and karma instead of jest for unnit tests.
16+
17+
Other permutations might be worth testing to secure against edge cases, but this gives us a decent level of security over common combinations.
18+
19+
## How to use it?
20+
21+
Choosing a scenario is done through setting an ENV variable named `VUE_TEMPL_TEST`.
22+
23+
You can run a scenario yourself by running this in your terminal:
24+
25+
````
26+
VUE_TEMPL_TEST=minimal vue init webpack your-directory
27+
```

‎scenarios/full-karma-airbnb.json‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"noEscape": true,
3+
"name": "test",
4+
"description": "A Vue.js project",
5+
"author": "CircleCI",
6+
"build": "standalone",
7+
"router": false,
8+
"lint": true,
9+
"lintConfig": "airbnb",
10+
"unit": true,
11+
"runner": "karma",
12+
"e2e": true,
13+
"autoInstall": false
14+
}

‎scenarios/full.json‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"noEscape": true,
3+
"name": "test",
4+
"description": "A Vue.js project",
5+
"author": "CircleCI",
6+
"build": "runtime",
7+
"router": false,
8+
"lint": true,
9+
"lintConfig": "standard",
10+
"unit": true,
11+
"runner": "jest",
12+
"e2e": true,
13+
"autoInstall": false
14+
}

‎scenarios/index.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
const scenarios = [
2+
'full',
3+
'full-karma-airbnb',
4+
'minimal'
5+
]
6+
7+
const index = scenarios.indexOf(process.env.VUE_TEMPL_TEST)
8+
9+
const isTest = exports.isTest = index !== -1
10+
11+
const scenario = isTest && require(`./${scenarios[index]}.json`)
12+
13+
exports.addTestAnswers = (metalsmith, options, helpers) => {
14+
Object.assign(metalsmith.metadata(), {
15+
isNotTest: !isTest,
16+
...(isTest ? scenario : undefined)
17+
})
18+
// console.log(metalsmith.metadata())
19+
}

‎scenarios/minimal.json‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"noEscape": true,
3+
"name": "test-minimal",
4+
"description": "Testing the minimal template setup",
5+
"author": "CircleCI",
6+
"build": "standalone",
7+
"router": false,
8+
"lint": false,
9+
"lintConfig": "standard",
10+
"unit": false,
11+
"runner": "jest",
12+
"e2e": false,
13+
"autoInstall": false
14+
}

‎template/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
"test": "{{#unit}}npm run unit{{/unit}}{{#unit}}{{#e2e}} && {{/e2e}}{{/unit}}{{#e2e}}npm run e2e{{/e2e}}",
2121
{{/if_or}}
2222
{{#lint}}
23-
"lint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}",
23+
"lint": "eslint --ext .js,.vue src{{#unit}} test/unit{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}",
2424
{{/lint}}
2525
"build": "node build/build.js"
2626
},
@@ -52,7 +52,7 @@
5252
"babel-jest": "^21.0.2",
5353
"babel-plugin-dynamic-import-node": "^1.2.0",
5454
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
55-
"jest": "^21.2.0",
55+
"jest": "^22.0.4",
5656
"jest-serializer-vue": "^0.3.0",
5757
"vue-jest": "^1.0.2",
5858
{{/if_eq}}

‎template/test/unit/karma.conf.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
var webpackConfig = require('../../build/webpack.test.conf')
77

8-
module.exports = function (config) {
8+
module.exports = function karmaConfig (config) {
99
config.set({
1010
// to run in additional browsers:
1111
// 1. install corresponding karma launcher

0 commit comments

Comments
 (0)