From 26c7acf5f831d80cb5cbda1a544d5def7807ecfc Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 21:00:45 +0200 Subject: [PATCH 01/21] Build: Use prebuild script instead of a separate command on Travis CI --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 355ceaea5..730d12376 100644 --- a/package.json +++ b/package.json @@ -146,6 +146,7 @@ "precompile": "rimraf lib/", "compile": "babel --ignore '*.spec.js' -d lib/ src/", "compile:watch": "babel --ignore '*.spec.js' --watch -d lib/ src/", + "prebuild": "npm run compile", "build": "node bin/styleguidist.js build --config examples/basic/styleguide.config.js", "build:customised": "node bin/styleguidist.js build --config examples/customised/styleguide.config.js", "build:sections": "node bin/styleguidist.js build --config examples/sections/styleguide.config.js", From 112fac2f83155d7aead412484c6ce20a0c1faf5a Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 21:01:46 +0200 Subject: [PATCH 02/21] Build: Use build stages and expand test matrix to test Webpack v3 & v4 --- .travis.yml | 97 +++++++++++++++++++++++++++++++++++------------------ 1 file changed, 65 insertions(+), 32 deletions(-) diff --git a/.travis.yml b/.travis.yml index d5da7f467..a79ec2ed3 100644 --- a/.travis.yml +++ b/.travis.yml @@ -3,56 +3,89 @@ node_js: - 6 - 8 - 9 +env: + - WEBPACK_VERSION=3 + - WEBPACK_VERSION=4 cache: directories: - node_modules before_install: # Upgrade npm - if [[ `npm -v` != 5* ]]; then npm install -g npm@latest; fi +before_script: + # Manually install Webpack version + - npm install --no-save webpack@$WEBPACK_VERSION script: - # Run lint - - npm run lint + - echo $WEBPACK_VERSION # Run tests and Danger.js - | if [[ "$TRAVIS_NODE_VERSION" == "9" ]]; then - npx danger ci npm run test:coverage -- --runInBand else npm run test:jest -- --runInBand fi - # Compile code - - npm run compile # Build all examples - npm run build - npm run build:customised - npm run build:sections - - | - if [[ "$TRAVIS_NODE_VERSION" == "9" ]]; then - # Check that examples really works: no JS errors on load - npm run test:browser:pre - npm run test:browser - npm run test:browser:customised - npm run test:browser:sections - # Run integration tests with cypress - npm run test:cypress:pre - npm run test:cypress:startServer & - npm run test:cypress:startServer:post - npm run test:cypress:run - fi -after_success: - # Make release with semantic-release if needed - - npm install -g semantic-release travis-deploy-once - - npm install --no-save semantic-release-tamia - - travis-deploy-once "semantic-release --analyze-commits semantic-release-tamia/analyzeCommits --verify-release semantic-release-tamia/verifyRelease --generate-notes semantic-release-tamia/generateNotes" - - | - if [[ "$TRAVIS_NODE_VERSION" == "9" ]]; then - # Upload coverage report to Codecov - bash <(curl -s https://codecov.io/bash) - # Update site - if [[ "$TRAVIS_BRANCH" == "master" ]]; then - curl -X POST -d '{}' https://api.netlify.com/build_hooks/591308eba700c425fc1e8a54 - fi - fi branches: except: - /^v\d+\.\d+\.\d+$/ +stages: + - lint + - test + - integration + - coverage + - release + - name: documentation + if: branch = master +jobs: + include: + - stage: lint + node_js: lts/* + env: + - WEBPACK_VERSION=4 + script: + - npm run lint + - npx danger ci + + - stage: integration + node_js: lts/* + script: + # Check that examples really works: no JS errors on load + - npm run test:browser:pre + - npm run test:browser + - npm run test:browser:customised + - npm run test:browser:sections + # Run integration tests with cypress + - npm run test:cypress:pre + - npm run test:cypress:startServer & + - npm run test:cypress:startServer:post + - npm run test:cypress:run + + - stage: coverage + node_js: lts/* + env: + - WEBPACK_VERSION=4 + script: + # Upload coverage report to Codecov + - bash <(curl -s https://codecov.io/bash) + + - stage: release + node_js: lts/* + env: + - WEBPACK_VERSION=4 + script: + - npm install -g semantic-release + - npm install --no-save semantic-release-tamia + - semantic-release --analyze-commits + - semantic-release-tamia/analyzeCommits --verify-release + - semantic-release-tamia/verifyRelease --generate-notes + - semantic-release-tamia/generateNotes + + - stage: documentation + node_js: lts/* + env: + - WEBPACK_VERSION=4 + script: + - curl -X POST -d '{}' https://api.netlify.com/build_hooks/591308eba700c425fc1e8a54 From 74e7ba5a7e42e3fe9e7284608ffdf5554edcbc96 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 21:19:24 +0200 Subject: [PATCH 03/21] Build: Use Webpack 3 for non-matrix tasks --- .travis.yml | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/.travis.yml b/.travis.yml index a79ec2ed3..7a7c70cff 100644 --- a/.travis.yml +++ b/.travis.yml @@ -43,8 +43,6 @@ jobs: include: - stage: lint node_js: lts/* - env: - - WEBPACK_VERSION=4 script: - npm run lint - npx danger ci @@ -65,16 +63,12 @@ jobs: - stage: coverage node_js: lts/* - env: - - WEBPACK_VERSION=4 script: # Upload coverage report to Codecov - bash <(curl -s https://codecov.io/bash) - stage: release node_js: lts/* - env: - - WEBPACK_VERSION=4 script: - npm install -g semantic-release - npm install --no-save semantic-release-tamia @@ -82,10 +76,8 @@ jobs: - semantic-release-tamia/analyzeCommits --verify-release - semantic-release-tamia/verifyRelease --generate-notes - semantic-release-tamia/generateNotes - + - stage: documentation node_js: lts/* - env: - - WEBPACK_VERSION=4 script: - curl -X POST -d '{}' https://api.netlify.com/build_hooks/591308eba700c425fc1e8a54 From 884f0c3b1bb49773435cd8b1e4a0cafaf04cefe5 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 21:23:23 +0200 Subject: [PATCH 04/21] Chore: Remove obsolete npm script --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 730d12376..0aac54f9e 100644 --- a/package.json +++ b/package.json @@ -150,7 +150,6 @@ "build": "node bin/styleguidist.js build --config examples/basic/styleguide.config.js", "build:customised": "node bin/styleguidist.js build --config examples/customised/styleguide.config.js", "build:sections": "node bin/styleguidist.js build --config examples/sections/styleguide.config.js", - "prepare": "npm run compile", "test:browser:pre": "npm i --no-save puppeteer", "test:browser": "node test/browser.js examples/basic/styleguide/index.html", "test:browser:customised": "node test/browser.js examples/customised/styleguide/index.html", From 8cb5c1c01543262c8fb4739563dea8d2d8ee1321 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 21:38:57 +0200 Subject: [PATCH 05/21] Chore: Remove debug information from .travis.yml --- .travis.yml | 2 -- 1 file changed, 2 deletions(-) diff --git a/.travis.yml b/.travis.yml index 7a7c70cff..b822894bc 100644 --- a/.travis.yml +++ b/.travis.yml @@ -16,8 +16,6 @@ before_script: # Manually install Webpack version - npm install --no-save webpack@$WEBPACK_VERSION script: - - echo $WEBPACK_VERSION - # Run tests and Danger.js - | if [[ "$TRAVIS_NODE_VERSION" == "9" ]]; then npm run test:coverage -- --runInBand From 33df7d11df435c415ddf1f763aae5d99cea0fdaa Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 29 Mar 2018 22:10:55 +0200 Subject: [PATCH 06/21] Build: Run tests without coverage on matrix since it's 2x faster --- .travis.yml | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/.travis.yml b/.travis.yml index b822894bc..e7bbb8eef 100644 --- a/.travis.yml +++ b/.travis.yml @@ -16,12 +16,8 @@ before_script: # Manually install Webpack version - npm install --no-save webpack@$WEBPACK_VERSION script: - - | - if [[ "$TRAVIS_NODE_VERSION" == "9" ]]; then - npm run test:coverage -- --runInBand - else - npm run test:jest -- --runInBand - fi + # Run tests without coverage since it's 2x faster + - npm run test:jest -- --runInBand # Build all examples - npm run build - npm run build:customised @@ -62,6 +58,8 @@ jobs: - stage: coverage node_js: lts/* script: + # Run tests with coverage + - npm run test:coverage -- --runInBand # Upload coverage report to Codecov - bash <(curl -s https://codecov.io/bash) From 8b0a5f6bb793f8f6f0df774e852f1735c840a312 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Fri, 30 Mar 2018 19:33:09 +0200 Subject: [PATCH 07/21] Test: Test make-webpack-config on both Webpack 3 and 4 --- package.json | 2 + .../__fixtures__/webpack3.development | 67 +++++++ .../__fixtures__/webpack3.production | 100 ++++++++++ .../__fixtures__/webpack4.development | 68 +++++++ .../__fixtures__/webpack4.production | 101 ++++++++++ .../make-webpack-config.spec.js.snap | 173 ------------------ scripts/__tests__/make-webpack-config.spec.js | 35 +++- 7 files changed, 368 insertions(+), 178 deletions(-) create mode 100644 scripts/__tests__/__fixtures__/webpack3.development create mode 100644 scripts/__tests__/__fixtures__/webpack3.production create mode 100644 scripts/__tests__/__fixtures__/webpack4.development create mode 100644 scripts/__tests__/__fixtures__/webpack4.production diff --git a/package.json b/package.json index 0aac54f9e..007db7c9a 100644 --- a/package.json +++ b/package.json @@ -122,7 +122,9 @@ "jest-serializer-html": "^5.0.0", "keymirror": "^0.1.1", "lint-staged": "^7.0.0", + "pkg-dir": "^2.0.0", "prettier": "1.11.1", + "pretty-format": "^22.4.3", "raf": "^3.4.0", "react": "^16.2.0", "react-dom": "^16.2.0", diff --git a/scripts/__tests__/__fixtures__/webpack3.development b/scripts/__tests__/__fixtures__/webpack3.development new file mode 100644 index 000000000..0dc7fd44a --- /dev/null +++ b/scripts/__tests__/__fixtures__/webpack3.development @@ -0,0 +1,67 @@ +Object { + "entry": Array [ + "~/lib/index", + "~/node_modules/react-dev-utils/webpackHotDevClient.js", + ], + "output": Object { + "chunkFilename": "build/[name].js", + "filename": "build/[name].bundle.js", + "path": "~/scripts/__tests__", + }, + "performance": Object { + "hints": false, + }, + "plugins": Array [ + StyleguidistOptionsPlugin { + "options": Object { + "editorConfig": Object { + "theme": "hl-theme", + }, + "require": Array [], + "styleguideDir": "~/scripts/__tests__", + "template": "template.html", + "title": "Style Guide", + }, + }, + HtmlWebpackPlugin { + "options": Object { + "cache": true, + "chunks": "all", + "compile": true, + "excludeChunks": Array [], + "favicon": false, + "filename": "index.html", + "hash": false, + "inject": true, + "minify": false, + "showErrors": true, + "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", + "title": "Style Guide", + "xhtml": false, + }, + }, + DefinePlugin { + "definitions": Object { + "process.env.NODE_ENV": "\"test\"", + "process.env.STYLEGUIDIST_ENV": "\"development\"", + }, + }, + HotModuleReplacementPlugin { + "fullBuildTimeout": 200, + "multiStep": undefined, + "options": Object {}, + "requestTimeout": 10000, + }, + ], + "resolve": Object { + "alias": Object { + "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", + "rsg-components": "~/lib/rsg-components", + }, + "extensions": Array [ + ".js", + ".jsx", + ".json", + ], + }, +} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack3.production b/scripts/__tests__/__fixtures__/webpack3.production new file mode 100644 index 000000000..0a0a6b253 --- /dev/null +++ b/scripts/__tests__/__fixtures__/webpack3.production @@ -0,0 +1,100 @@ +Object { + "entry": Array [ + "~/lib/index", + ], + "output": Object { + "chunkFilename": "build/[name].[chunkhash:8].js", + "filename": "build/bundle.[chunkhash:8].js", + "path": "~/scripts/__tests__", + }, + "performance": Object { + "hints": false, + }, + "plugins": Array [ + StyleguidistOptionsPlugin { + "options": Object { + "editorConfig": Object { + "theme": "hl-theme", + }, + "require": Array [], + "styleguideDir": "~/scripts/__tests__", + "template": "template.html", + "title": "Style Guide", + }, + }, + HtmlWebpackPlugin { + "options": Object { + "cache": true, + "chunks": "all", + "compile": true, + "excludeChunks": Array [], + "favicon": false, + "filename": "index.html", + "hash": false, + "inject": true, + "minify": false, + "showErrors": true, + "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", + "title": "Style Guide", + "xhtml": false, + }, + }, + DefinePlugin { + "definitions": Object { + "process.env.NODE_ENV": "\"test\"", + "process.env.STYLEGUIDIST_ENV": "\"production\"", + }, + }, + UglifyJsPlugin { + "options": Object { + "cache": true, + "exclude": undefined, + "extractComments": false, + "include": undefined, + "parallel": true, + "sourceMap": false, + "test": /\.js(\?.*)?$/i, + "uglifyOptions": Object { + "compress": Object { + "keep_fnames": true, + "warnings": false, + }, + "ecma": 5, + "ie8": false, + "mangle": Object { + "keep_fnames": true, + }, + "output": Object { + "comments": /^\**!|@preserve|@license|@cc_on/, + }, + }, + "warningsFilter": [Function anonymous], + }, + }, + CleanWebpackPlugin { + "options": Object { + "allowExternal": false, + "dry": false, + "root": "~/scripts/__tests__", + "verbose": false, + }, + "paths": Array [ + "build", + ], + }, + Object { + "apply": [Function apply], + }, + ], + "resolve": Object { + "alias": Object { + "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", + "rsg-components": "~/lib/rsg-components", + }, + "extensions": Array [ + ".js", + ".jsx", + ".json", + ], + }, +} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack4.development b/scripts/__tests__/__fixtures__/webpack4.development new file mode 100644 index 000000000..a7d2a898c --- /dev/null +++ b/scripts/__tests__/__fixtures__/webpack4.development @@ -0,0 +1,68 @@ +Object { + "entry": Array [ + "~/lib/index", + "~/node_modules/react-dev-utils/webpackHotDevClient.js", + ], + "mode": "development", + "output": Object { + "chunkFilename": "build/[name].js", + "filename": "build/[name].bundle.js", + "path": "~/scripts/__tests__", + }, + "performance": Object { + "hints": false, + }, + "plugins": Array [ + StyleguidistOptionsPlugin { + "options": Object { + "editorConfig": Object { + "theme": "hl-theme", + }, + "require": Array [], + "styleguideDir": "~/scripts/__tests__", + "template": "template.html", + "title": "Style Guide", + }, + }, + HtmlWebpackPlugin { + "options": Object { + "cache": true, + "chunks": "all", + "compile": true, + "excludeChunks": Array [], + "favicon": false, + "filename": "index.html", + "hash": false, + "inject": true, + "minify": false, + "showErrors": true, + "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", + "title": "Style Guide", + "xhtml": false, + }, + }, + DefinePlugin { + "definitions": Object { + "process.env.NODE_ENV": "\"test\"", + "process.env.STYLEGUIDIST_ENV": "\"development\"", + }, + }, + HotModuleReplacementPlugin { + "fullBuildTimeout": 200, + "multiStep": undefined, + "options": Object {}, + "requestTimeout": 10000, + }, + ], + "resolve": Object { + "alias": Object { + "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", + "rsg-components": "~/lib/rsg-components", + }, + "extensions": Array [ + ".js", + ".jsx", + ".json", + ], + }, +} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack4.production b/scripts/__tests__/__fixtures__/webpack4.production new file mode 100644 index 000000000..1322bc1a0 --- /dev/null +++ b/scripts/__tests__/__fixtures__/webpack4.production @@ -0,0 +1,101 @@ +Object { + "entry": Array [ + "~/lib/index", + ], + "mode": "production", + "output": Object { + "chunkFilename": "build/[name].[chunkhash:8].js", + "filename": "build/bundle.[chunkhash:8].js", + "path": "~/scripts/__tests__", + }, + "performance": Object { + "hints": false, + }, + "plugins": Array [ + StyleguidistOptionsPlugin { + "options": Object { + "editorConfig": Object { + "theme": "hl-theme", + }, + "require": Array [], + "styleguideDir": "~/scripts/__tests__", + "template": "template.html", + "title": "Style Guide", + }, + }, + HtmlWebpackPlugin { + "options": Object { + "cache": true, + "chunks": "all", + "compile": true, + "excludeChunks": Array [], + "favicon": false, + "filename": "index.html", + "hash": false, + "inject": true, + "minify": false, + "showErrors": true, + "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", + "title": "Style Guide", + "xhtml": false, + }, + }, + DefinePlugin { + "definitions": Object { + "process.env.NODE_ENV": "\"test\"", + "process.env.STYLEGUIDIST_ENV": "\"production\"", + }, + }, + UglifyJsPlugin { + "options": Object { + "cache": true, + "exclude": undefined, + "extractComments": false, + "include": undefined, + "parallel": true, + "sourceMap": false, + "test": /\.js(\?.*)?$/i, + "uglifyOptions": Object { + "compress": Object { + "keep_fnames": true, + "warnings": false, + }, + "ecma": 5, + "ie8": false, + "mangle": Object { + "keep_fnames": true, + }, + "output": Object { + "comments": /^\**!|@preserve|@license|@cc_on/, + }, + }, + "warningsFilter": [Function anonymous], + }, + }, + CleanWebpackPlugin { + "options": Object { + "allowExternal": false, + "dry": false, + "root": "~/scripts/__tests__", + "verbose": false, + }, + "paths": Array [ + "build", + ], + }, + Object { + "apply": [Function apply], + }, + ], + "resolve": Object { + "alias": Object { + "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", + "rsg-components": "~/lib/rsg-components", + }, + "extensions": Array [ + ".js", + ".jsx", + ".json", + ], + }, +} \ No newline at end of file diff --git a/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap b/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap index da8dff79b..1e6e2498b 100644 --- a/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap +++ b/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap @@ -49,179 +49,6 @@ Array [ ] `; -exports[`should return a development config 1`] = ` -Object { - "entry": Array [ - "~/lib/index", - "~/node_modules/react-dev-utils/webpackHotDevClient.js", - ], - "output": Object { - "chunkFilename": "build/[name].js", - "filename": "build/[name].bundle.js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "template": "template.html", - "title": "Style Guide", - }, - }, - HtmlWebpackPlugin { - "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, - }, - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\\"test\\"", - "process.env.STYLEGUIDIST_ENV": "\\"development\\"", - }, - }, - HotModuleReplacementPlugin { - "fullBuildTimeout": 200, - "multiStep": undefined, - "options": Object {}, - "requestTimeout": 10000, - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} -`; - -exports[`should return a production config 1`] = ` -Object { - "entry": Array [ - "~/lib/index", - ], - "output": Object { - "chunkFilename": "build/[name].[chunkhash:8].js", - "filename": "build/bundle.[chunkhash:8].js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "template": "template.html", - "title": "Style Guide", - }, - }, - HtmlWebpackPlugin { - "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, - }, - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\\"test\\"", - "process.env.STYLEGUIDIST_ENV": "\\"production\\"", - }, - }, - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\\\\\\.js\\(\\\\\\?\\.\\*\\)\\?\\$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /\\^\\\\\\*\\*!\\|@preserve\\|@license\\|@cc_on/, - }, - }, - "warningsFilter": [Function], - }, - }, - CleanWebpackPlugin { - "options": Object { - "allowExternal": false, - "dry": false, - "root": "~/scripts/__tests__", - "verbose": false, - }, - "paths": Array [ - "build", - ], - }, - Object { - "apply": [Function], - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} -`; - exports[`should use editorConfig theme over highlightTheme 1`] = ` Object { "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", diff --git a/scripts/__tests__/make-webpack-config.spec.js b/scripts/__tests__/make-webpack-config.spec.js index 2f41c0567..0c6aaeb30 100644 --- a/scripts/__tests__/make-webpack-config.spec.js +++ b/scripts/__tests__/make-webpack-config.spec.js @@ -1,6 +1,14 @@ -import webpack from 'webpack'; +import path from 'path'; +import fs from 'fs'; +import pkgDir from 'pkg-dir'; +import format from 'pretty-format'; +import webpack, { validate } from 'webpack'; +import getWebpackVersion from '../utils/getWebpackVersion'; import makeWebpackConfig from '../make-webpack-config'; +const rootDir = pkgDir.sync(__dirname); +const re = new RegExp(rootDir, 'g'); + const styleguideConfig = { styleguideDir: __dirname, require: [], @@ -12,19 +20,36 @@ const styleguideConfig = { }; const process$env$nodeEnv = process.env.NODE_ENV; +const webpackVersion = getWebpackVersion(); afterEach(() => { process.env.NODE_ENV = process$env$nodeEnv; }); it('should return a development config', () => { - const result = makeWebpackConfig(styleguideConfig, 'development'); - expect(result).toMatchSnapshot(); + const env = 'development'; + const fixturePath = path.join(__dirname, '__fixtures__', `webpack${webpackVersion}.${env}`); + const result = makeWebpackConfig(styleguideConfig, env); + const errors = validate(result); + const actual = format(result).replace(re, '~'); + // Uncomment to update fixture + // fs.writeFileSync(fixturePath, actual) + const expected = fs.readFileSync(fixturePath, { encoding: 'utf8' }); + expect(errors.length).toEqual(0); + expect(actual).toEqual(expected); }); it('should return a production config', () => { - const result = makeWebpackConfig(styleguideConfig, 'production'); - expect(result).toMatchSnapshot(); + const env = 'production'; + const fixturePath = path.join(__dirname, '__fixtures__', `webpack${webpackVersion}.${env}`); + const result = makeWebpackConfig(styleguideConfig, env); + const errors = validate(result); + const actual = format(result).replace(re, '~'); + // Uncomment to update fixture + // fs.writeFileSync(fixturePath, actual) + const expected = fs.readFileSync(fixturePath, { encoding: 'utf8' }); + expect(errors.length).toEqual(0); + expect(actual).toEqual(expected); }); it('should prepend requires as webpack entries', () => { From 4a50323858c768758abae4ce6b3ec573052e566b Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Fri, 30 Mar 2018 21:44:25 +0200 Subject: [PATCH 08/21] Build: Use Webpack 4 by default for build stages on Travis CI --- .travis.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.travis.yml b/.travis.yml index e7bbb8eef..d3c712dbd 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,8 +4,8 @@ node_js: - 8 - 9 env: - - WEBPACK_VERSION=3 - WEBPACK_VERSION=4 + - WEBPACK_VERSION=3 cache: directories: - node_modules From 224062da44b54e0a382f00238a342c7069d1c17e Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Fri, 30 Mar 2018 21:51:47 +0200 Subject: [PATCH 09/21] Test: Update fixtures for webpack configs --- .../__fixtures__/webpack3.development | 50 ++++++++---- .../__fixtures__/webpack3.production | 62 +++++++------- .../__fixtures__/webpack4.development | 54 +++++++++---- .../__fixtures__/webpack4.production | 80 +++++++++---------- 4 files changed, 141 insertions(+), 105 deletions(-) diff --git a/scripts/__tests__/__fixtures__/webpack3.development b/scripts/__tests__/__fixtures__/webpack3.development index 0dc7fd44a..f4414272c 100644 --- a/scripts/__tests__/__fixtures__/webpack3.development +++ b/scripts/__tests__/__fixtures__/webpack3.development @@ -12,6 +12,32 @@ Object { "hints": false, }, "plugins": Array [ + UglifyJsPlugin { + "options": Object { + "cache": true, + "exclude": undefined, + "extractComments": false, + "include": undefined, + "parallel": true, + "sourceMap": false, + "test": /\.js(\?.*)?$/i, + "uglifyOptions": Object { + "compress": Object { + "keep_fnames": true, + "warnings": false, + }, + "ecma": 5, + "ie8": false, + "mangle": Object { + "keep_fnames": true, + }, + "output": Object { + "comments": /^\**!|@preserve|@license|@cc_on/, + }, + }, + "warningsFilter": [Function anonymous], + }, + }, StyleguidistOptionsPlugin { "options": Object { "editorConfig": Object { @@ -19,26 +45,20 @@ Object { }, "require": Array [], "styleguideDir": "~/scripts/__tests__", - "template": "template.html", "title": "Style Guide", }, + "plugin": [Function bound plugin], }, - HtmlWebpackPlugin { + MiniHtmlWebpackPlugin { "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, + "context": Object { + "container": "rsg-root", + "title": "Style Guide", + "trimWhitespace": true, + }, + "template": [Function template], }, + "plugin": [Function bound plugin], }, DefinePlugin { "definitions": Object { diff --git a/scripts/__tests__/__fixtures__/webpack3.production b/scripts/__tests__/__fixtures__/webpack3.production index 0a0a6b253..5e62fda93 100644 --- a/scripts/__tests__/__fixtures__/webpack3.production +++ b/scripts/__tests__/__fixtures__/webpack3.production @@ -11,40 +11,6 @@ Object { "hints": false, }, "plugins": Array [ - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "template": "template.html", - "title": "Style Guide", - }, - }, - HtmlWebpackPlugin { - "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, - }, - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\"test\"", - "process.env.STYLEGUIDIST_ENV": "\"production\"", - }, - }, UglifyJsPlugin { "options": Object { "cache": true, @@ -71,6 +37,34 @@ Object { "warningsFilter": [Function anonymous], }, }, + StyleguidistOptionsPlugin { + "options": Object { + "editorConfig": Object { + "theme": "hl-theme", + }, + "require": Array [], + "styleguideDir": "~/scripts/__tests__", + "title": "Style Guide", + }, + "plugin": [Function bound plugin], + }, + MiniHtmlWebpackPlugin { + "options": Object { + "context": Object { + "container": "rsg-root", + "title": "Style Guide", + "trimWhitespace": true, + }, + "template": [Function template], + }, + "plugin": [Function bound plugin], + }, + DefinePlugin { + "definitions": Object { + "process.env.NODE_ENV": "\"test\"", + "process.env.STYLEGUIDIST_ENV": "\"production\"", + }, + }, CleanWebpackPlugin { "options": Object { "allowExternal": false, diff --git a/scripts/__tests__/__fixtures__/webpack4.development b/scripts/__tests__/__fixtures__/webpack4.development index a7d2a898c..a5a766b82 100644 --- a/scripts/__tests__/__fixtures__/webpack4.development +++ b/scripts/__tests__/__fixtures__/webpack4.development @@ -4,6 +4,36 @@ Object { "~/node_modules/react-dev-utils/webpackHotDevClient.js", ], "mode": "development", + "optimization": Object { + "minimizer": Array [ + UglifyJsPlugin { + "options": Object { + "cache": true, + "exclude": undefined, + "extractComments": false, + "include": undefined, + "parallel": true, + "sourceMap": false, + "test": /\.js(\?.*)?$/i, + "uglifyOptions": Object { + "compress": Object { + "keep_fnames": true, + "warnings": false, + }, + "ecma": 5, + "ie8": false, + "mangle": Object { + "keep_fnames": true, + }, + "output": Object { + "comments": /^\**!|@preserve|@license|@cc_on/, + }, + }, + "warningsFilter": [Function anonymous], + }, + }, + ], + }, "output": Object { "chunkFilename": "build/[name].js", "filename": "build/[name].bundle.js", @@ -20,26 +50,20 @@ Object { }, "require": Array [], "styleguideDir": "~/scripts/__tests__", - "template": "template.html", "title": "Style Guide", }, + "plugin": [Function bound plugin], }, - HtmlWebpackPlugin { + MiniHtmlWebpackPlugin { "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, + "context": Object { + "container": "rsg-root", + "title": "Style Guide", + "trimWhitespace": true, + }, + "template": [Function template], }, + "plugin": [Function bound plugin], }, DefinePlugin { "definitions": Object { diff --git a/scripts/__tests__/__fixtures__/webpack4.production b/scripts/__tests__/__fixtures__/webpack4.production index 1322bc1a0..f4b6aab67 100644 --- a/scripts/__tests__/__fixtures__/webpack4.production +++ b/scripts/__tests__/__fixtures__/webpack4.production @@ -3,6 +3,36 @@ Object { "~/lib/index", ], "mode": "production", + "optimization": Object { + "minimizer": Array [ + UglifyJsPlugin { + "options": Object { + "cache": true, + "exclude": undefined, + "extractComments": false, + "include": undefined, + "parallel": true, + "sourceMap": false, + "test": /\.js(\?.*)?$/i, + "uglifyOptions": Object { + "compress": Object { + "keep_fnames": true, + "warnings": false, + }, + "ecma": 5, + "ie8": false, + "mangle": Object { + "keep_fnames": true, + }, + "output": Object { + "comments": /^\**!|@preserve|@license|@cc_on/, + }, + }, + "warningsFilter": [Function anonymous], + }, + }, + ], + }, "output": Object { "chunkFilename": "build/[name].[chunkhash:8].js", "filename": "build/bundle.[chunkhash:8].js", @@ -19,26 +49,20 @@ Object { }, "require": Array [], "styleguideDir": "~/scripts/__tests__", - "template": "template.html", "title": "Style Guide", }, + "plugin": [Function bound plugin], }, - HtmlWebpackPlugin { + MiniHtmlWebpackPlugin { "options": Object { - "cache": true, - "chunks": "all", - "compile": true, - "excludeChunks": Array [], - "favicon": false, - "filename": "index.html", - "hash": false, - "inject": true, - "minify": false, - "showErrors": true, - "template": "!!~/node_modules/html-webpack-plugin/lib/loader.js!template.html", - "title": "Style Guide", - "xhtml": false, + "context": Object { + "container": "rsg-root", + "title": "Style Guide", + "trimWhitespace": true, + }, + "template": [Function template], }, + "plugin": [Function bound plugin], }, DefinePlugin { "definitions": Object { @@ -46,32 +70,6 @@ Object { "process.env.STYLEGUIDIST_ENV": "\"production\"", }, }, - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\.js(\?.*)?$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /^\**!|@preserve|@license|@cc_on/, - }, - }, - "warningsFilter": [Function anonymous], - }, - }, CleanWebpackPlugin { "options": Object { "allowExternal": false, From 4f3f9f8a7d5705f0bd3bf29c40693ab2df0fb85c Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Fri, 30 Mar 2018 21:54:49 +0200 Subject: [PATCH 10/21] Build: Fix semantic-release step --- .travis.yml | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index d3c712dbd..870ca37b8 100644 --- a/.travis.yml +++ b/.travis.yml @@ -68,10 +68,9 @@ jobs: script: - npm install -g semantic-release - npm install --no-save semantic-release-tamia - - semantic-release --analyze-commits - - semantic-release-tamia/analyzeCommits --verify-release - - semantic-release-tamia/verifyRelease --generate-notes - - semantic-release-tamia/generateNotes + - semantic-release --analyze-commits semantic-release-tamia/analyzeCommits + --verify-release semantic-release-tamia/verifyRelease --generate-notes + semantic-release-tamia/generateNotes - stage: documentation node_js: lts/* From fe9eff2fb234f4c0c389f4642e419f6ccf8fe837 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 09:46:37 +0200 Subject: [PATCH 11/21] Simplify tests, add uglify plugin in production only --- package.json | 2 - .../__fixtures__/webpack3.development | 87 ---------------- .../__fixtures__/webpack3.production | 94 ------------------ .../__fixtures__/webpack4.development | 92 ----------------- .../__fixtures__/webpack4.production | 99 ------------------- .../make-webpack-config.spec.js.snap | 2 +- scripts/__tests__/make-webpack-config.spec.js | 98 +++++++++++------- scripts/make-webpack-config.js | 48 ++++----- 8 files changed, 90 insertions(+), 432 deletions(-) delete mode 100644 scripts/__tests__/__fixtures__/webpack3.development delete mode 100644 scripts/__tests__/__fixtures__/webpack3.production delete mode 100644 scripts/__tests__/__fixtures__/webpack4.development delete mode 100644 scripts/__tests__/__fixtures__/webpack4.production diff --git a/package.json b/package.json index 1d16e0975..c30801c39 100644 --- a/package.json +++ b/package.json @@ -122,9 +122,7 @@ "jest-serializer-html": "^5.0.0", "keymirror": "^0.1.1", "lint-staged": "^7.0.0", - "pkg-dir": "^2.0.0", "prettier": "1.11.1", - "pretty-format": "^22.4.3", "raf": "^3.4.0", "react": "^16.2.0", "react-dom": "^16.2.0", diff --git a/scripts/__tests__/__fixtures__/webpack3.development b/scripts/__tests__/__fixtures__/webpack3.development deleted file mode 100644 index f4414272c..000000000 --- a/scripts/__tests__/__fixtures__/webpack3.development +++ /dev/null @@ -1,87 +0,0 @@ -Object { - "entry": Array [ - "~/lib/index", - "~/node_modules/react-dev-utils/webpackHotDevClient.js", - ], - "output": Object { - "chunkFilename": "build/[name].js", - "filename": "build/[name].bundle.js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\.js(\?.*)?$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /^\**!|@preserve|@license|@cc_on/, - }, - }, - "warningsFilter": [Function anonymous], - }, - }, - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "title": "Style Guide", - }, - "plugin": [Function bound plugin], - }, - MiniHtmlWebpackPlugin { - "options": Object { - "context": Object { - "container": "rsg-root", - "title": "Style Guide", - "trimWhitespace": true, - }, - "template": [Function template], - }, - "plugin": [Function bound plugin], - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\"test\"", - "process.env.STYLEGUIDIST_ENV": "\"development\"", - }, - }, - HotModuleReplacementPlugin { - "fullBuildTimeout": 200, - "multiStep": undefined, - "options": Object {}, - "requestTimeout": 10000, - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack3.production b/scripts/__tests__/__fixtures__/webpack3.production deleted file mode 100644 index 5e62fda93..000000000 --- a/scripts/__tests__/__fixtures__/webpack3.production +++ /dev/null @@ -1,94 +0,0 @@ -Object { - "entry": Array [ - "~/lib/index", - ], - "output": Object { - "chunkFilename": "build/[name].[chunkhash:8].js", - "filename": "build/bundle.[chunkhash:8].js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\.js(\?.*)?$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /^\**!|@preserve|@license|@cc_on/, - }, - }, - "warningsFilter": [Function anonymous], - }, - }, - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "title": "Style Guide", - }, - "plugin": [Function bound plugin], - }, - MiniHtmlWebpackPlugin { - "options": Object { - "context": Object { - "container": "rsg-root", - "title": "Style Guide", - "trimWhitespace": true, - }, - "template": [Function template], - }, - "plugin": [Function bound plugin], - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\"test\"", - "process.env.STYLEGUIDIST_ENV": "\"production\"", - }, - }, - CleanWebpackPlugin { - "options": Object { - "allowExternal": false, - "dry": false, - "root": "~/scripts/__tests__", - "verbose": false, - }, - "paths": Array [ - "build", - ], - }, - Object { - "apply": [Function apply], - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack4.development b/scripts/__tests__/__fixtures__/webpack4.development deleted file mode 100644 index a5a766b82..000000000 --- a/scripts/__tests__/__fixtures__/webpack4.development +++ /dev/null @@ -1,92 +0,0 @@ -Object { - "entry": Array [ - "~/lib/index", - "~/node_modules/react-dev-utils/webpackHotDevClient.js", - ], - "mode": "development", - "optimization": Object { - "minimizer": Array [ - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\.js(\?.*)?$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /^\**!|@preserve|@license|@cc_on/, - }, - }, - "warningsFilter": [Function anonymous], - }, - }, - ], - }, - "output": Object { - "chunkFilename": "build/[name].js", - "filename": "build/[name].bundle.js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "title": "Style Guide", - }, - "plugin": [Function bound plugin], - }, - MiniHtmlWebpackPlugin { - "options": Object { - "context": Object { - "container": "rsg-root", - "title": "Style Guide", - "trimWhitespace": true, - }, - "template": [Function template], - }, - "plugin": [Function bound plugin], - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\"test\"", - "process.env.STYLEGUIDIST_ENV": "\"development\"", - }, - }, - HotModuleReplacementPlugin { - "fullBuildTimeout": 200, - "multiStep": undefined, - "options": Object {}, - "requestTimeout": 10000, - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} \ No newline at end of file diff --git a/scripts/__tests__/__fixtures__/webpack4.production b/scripts/__tests__/__fixtures__/webpack4.production deleted file mode 100644 index f4b6aab67..000000000 --- a/scripts/__tests__/__fixtures__/webpack4.production +++ /dev/null @@ -1,99 +0,0 @@ -Object { - "entry": Array [ - "~/lib/index", - ], - "mode": "production", - "optimization": Object { - "minimizer": Array [ - UglifyJsPlugin { - "options": Object { - "cache": true, - "exclude": undefined, - "extractComments": false, - "include": undefined, - "parallel": true, - "sourceMap": false, - "test": /\.js(\?.*)?$/i, - "uglifyOptions": Object { - "compress": Object { - "keep_fnames": true, - "warnings": false, - }, - "ecma": 5, - "ie8": false, - "mangle": Object { - "keep_fnames": true, - }, - "output": Object { - "comments": /^\**!|@preserve|@license|@cc_on/, - }, - }, - "warningsFilter": [Function anonymous], - }, - }, - ], - }, - "output": Object { - "chunkFilename": "build/[name].[chunkhash:8].js", - "filename": "build/bundle.[chunkhash:8].js", - "path": "~/scripts/__tests__", - }, - "performance": Object { - "hints": false, - }, - "plugins": Array [ - StyleguidistOptionsPlugin { - "options": Object { - "editorConfig": Object { - "theme": "hl-theme", - }, - "require": Array [], - "styleguideDir": "~/scripts/__tests__", - "title": "Style Guide", - }, - "plugin": [Function bound plugin], - }, - MiniHtmlWebpackPlugin { - "options": Object { - "context": Object { - "container": "rsg-root", - "title": "Style Guide", - "trimWhitespace": true, - }, - "template": [Function template], - }, - "plugin": [Function bound plugin], - }, - DefinePlugin { - "definitions": Object { - "process.env.NODE_ENV": "\"test\"", - "process.env.STYLEGUIDIST_ENV": "\"production\"", - }, - }, - CleanWebpackPlugin { - "options": Object { - "allowExternal": false, - "dry": false, - "root": "~/scripts/__tests__", - "verbose": false, - }, - "paths": Array [ - "build", - ], - }, - Object { - "apply": [Function apply], - }, - ], - "resolve": Object { - "alias": Object { - "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", - "rsg-components": "~/lib/rsg-components", - }, - "extensions": Array [ - ".js", - ".jsx", - ".json", - ], - }, -} \ No newline at end of file diff --git a/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap b/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap index 1e6e2498b..d00e6fc6b 100644 --- a/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap +++ b/scripts/__tests__/__snapshots__/make-webpack-config.spec.js.snap @@ -49,7 +49,7 @@ Array [ ] `; -exports[`should use editorConfig theme over highlightTheme 1`] = ` +exports[`should set aliases 1`] = ` Object { "rsg-codemirror-theme.css": "codemirror/theme/hl-theme.css", "rsg-components": "~/lib/rsg-components", diff --git a/scripts/__tests__/make-webpack-config.spec.js b/scripts/__tests__/make-webpack-config.spec.js index 18e7c8f7d..c9dcc94b2 100644 --- a/scripts/__tests__/make-webpack-config.spec.js +++ b/scripts/__tests__/make-webpack-config.spec.js @@ -1,27 +1,22 @@ -import path from 'path'; -import fs from 'fs'; -import pkgDir from 'pkg-dir'; -import format from 'pretty-format'; import webpack, { validate } from 'webpack'; import getWebpackVersion from '../utils/getWebpackVersion'; import makeWebpackConfig from '../make-webpack-config'; -const rootDir = pkgDir.sync(__dirname); -const re = new RegExp(rootDir, 'g'); - +const theme = 'hl-theme'; const styleguideConfig = { styleguideDir: __dirname, require: [], editorConfig: { - theme: 'hl-theme', + theme, }, title: 'Style Guide', }; -const getPluign = (config, name) => config.plugins.filter(x => x.constructor.name === name); +const getClasses = (plugins, name) => plugins.filter(x => x.constructor.name === name); +const getClassNames = plugins => plugins.map(x => x.constructor.name); const process$env$nodeEnv = process.env.NODE_ENV; -const webpackVersion = getWebpackVersion(); +const isWebpack4 = getWebpackVersion() >= 4; afterEach(() => { process.env.NODE_ENV = process$env$nodeEnv; @@ -29,28 +24,54 @@ afterEach(() => { it('should return a development config', () => { const env = 'development'; - const fixturePath = path.join(__dirname, '__fixtures__', `webpack${webpackVersion}.${env}`); - const result = makeWebpackConfig(styleguideConfig, env); - const errors = validate(result); - const actual = format(result).replace(re, '~'); - // Uncomment to update fixture - // fs.writeFileSync(fixturePath, actual) - const expected = fs.readFileSync(fixturePath, { encoding: 'utf8' }); - expect(errors.length).toEqual(0); - expect(actual).toEqual(expected); + const config = makeWebpackConfig(styleguideConfig, env); + + const errors = validate(config); + expect(errors).toHaveLength(0); + + const plugins = getClassNames(config.plugins); + expect(plugins).toContain('HotModuleReplacementPlugin'); + + if (isWebpack4) { + expect(config).toMatchObject({ + mode: env, + }); + expect(config).not.toHaveProperty('optimization'); + } else { + expect(plugins).not.toContain('UglifyJsPlugin'); + } }); it('should return a production config', () => { const env = 'production'; - const fixturePath = path.join(__dirname, '__fixtures__', `webpack${webpackVersion}.${env}`); - const result = makeWebpackConfig(styleguideConfig, env); - const errors = validate(result); - const actual = format(result).replace(re, '~'); - // Uncomment to update fixture - // fs.writeFileSync(fixturePath, actual) - const expected = fs.readFileSync(fixturePath, { encoding: 'utf8' }); - expect(errors.length).toEqual(0); - expect(actual).toEqual(expected); + const config = makeWebpackConfig(styleguideConfig, env); + const errors = validate(config); + expect(errors).toHaveLength(0); + + const plugins = getClassNames(config.plugins); + expect(plugins).toContain('CleanWebpackPlugin'); + expect(plugins).not.toContain('HotModuleReplacementPlugin'); + + expect(config).toMatchObject({ + output: { + filename: expect.stringContaining('[chunkhash'), + chunkFilename: expect.stringContaining('[chunkhash'), + }, + }); + + if (isWebpack4) { + expect(config).toMatchObject({ + mode: env, + }); + expect(getClasses(config.optimization.minimizer, 'UglifyJsPlugin')).toHaveLength(1); + } else { + expect(plugins).toContain('UglifyJsPlugin'); + } +}); + +it('should set aliases', () => { + const result = makeWebpackConfig(styleguideConfig, 'development'); + expect(result.resolve.alias).toMatchSnapshot(); }); it('should prepend requires as webpack entries', () => { @@ -61,17 +82,24 @@ it('should prepend requires as webpack entries', () => { expect(result.entry).toMatchSnapshot(); }); -it('should use editorConfig theme over highlightTheme', () => { +it('editorConfig theme should change alias', () => { + const highlightTheme = 'solarized'; const result = makeWebpackConfig( - { ...styleguideConfig, highlightTheme: 'deprecated' }, + { ...styleguideConfig, editorConfig: { theme: highlightTheme } }, 'development' ); - expect(result.resolve.alias).toMatchSnapshot(); + expect(result.resolve.alias['rsg-codemirror-theme.css']).toMatch(highlightTheme); +}); + +it('should use editorConfig theme over highlightTheme', () => { + const highlightTheme = 'solarized'; + const result = makeWebpackConfig({ ...styleguideConfig, highlightTheme }, 'development'); + expect(result.resolve.alias['rsg-codemirror-theme.css']).toMatch(theme); }); it('should enable verbose mode in CleanWebpackPlugin', () => { const result = makeWebpackConfig({ ...styleguideConfig, verbose: true }, 'production'); - expect(getPluign(result, 'CleanWebpackPlugin')).toMatchSnapshot(); + expect(getClasses(result.plugins, 'CleanWebpackPlugin')).toMatchSnapshot(); }); it('should merge user webpack config', () => { @@ -100,7 +128,7 @@ it('should not owerwrite user DefinePlugin', () => { // Doesn’t really test that values won’t be overwritten, just that // DefinePlugin is applied twice. To write a real test we’d have to run // webpack - expect(getPluign(result, 'DefinePlugin')).toMatchSnapshot(); + expect(getClasses(result.plugins, 'DefinePlugin')).toMatchSnapshot(); }); it('should update webpack config', () => { @@ -129,7 +157,7 @@ it('should pass template context to HTML plugin', () => { }, 'development' ); - expect(getPluign(result, 'MiniHtmlWebpackPlugin')[0]).toMatchObject({ + expect(getClasses(result.plugins, 'MiniHtmlWebpackPlugin')[0]).toMatchObject({ options: { context: template, template: expect.any(Function), @@ -146,7 +174,7 @@ it('should pass template function to HTML plugin', () => { }, 'development' ); - expect(getPluign(result, 'MiniHtmlWebpackPlugin')[0]).toMatchObject({ + expect(getClasses(result.plugins, 'MiniHtmlWebpackPlugin')[0]).toMatchObject({ options: { context: expect.any(Object), template, diff --git a/scripts/make-webpack-config.js b/scripts/make-webpack-config.js index 700d7830f..2b4bc813f 100644 --- a/scripts/make-webpack-config.js +++ b/scripts/make-webpack-config.js @@ -14,6 +14,7 @@ const getWebpackVersion = require('./utils/getWebpackVersion'); const RENDERER_REGEXP = /Renderer$/; +const isWebpack4 = getWebpackVersion() >= 4; const sourceDir = path.resolve(__dirname, '../lib'); module.exports = function(config, env) { @@ -58,29 +59,8 @@ module.exports = function(config, env) { }, }; - const uglifier = new UglifyJSPlugin({ - parallel: true, - cache: true, - uglifyOptions: { - ie8: false, - ecma: 5, - compress: { - keep_fnames: true, - warnings: false, - }, - mangle: { - keep_fnames: true, - }, - }, - }); - - if (getWebpackVersion() >= 4) { + if (isWebpack4) { webpackConfig.mode = env; - webpackConfig.optimization = { - minimizer: [uglifier], - }; - } else { - webpackConfig.plugins.unshift(uglifier); } if (isProd) { @@ -105,6 +85,30 @@ module.exports = function(config, env) { ), ], }); + + const uglifier = new UglifyJSPlugin({ + parallel: true, + cache: true, + uglifyOptions: { + ie8: false, + ecma: 5, + compress: { + keep_fnames: true, + warnings: false, + }, + mangle: { + keep_fnames: true, + }, + }, + }); + + if (isWebpack4) { + webpackConfig.optimization = { + minimizer: [uglifier], + }; + } else { + webpackConfig.plugins.unshift(uglifier); + } } else { webpackConfig = merge(webpackConfig, { entry: [require.resolve('react-dev-utils/webpackHotDevClient')], From 625a5be5054320ce92641116c3e67d928b20f5d3 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 09:54:56 +0200 Subject: [PATCH 12/21] Ignore coverage for webpack version conditions --- scripts/make-webpack-config.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/scripts/make-webpack-config.js b/scripts/make-webpack-config.js index 2b4bc813f..d4d628670 100644 --- a/scripts/make-webpack-config.js +++ b/scripts/make-webpack-config.js @@ -59,6 +59,7 @@ module.exports = function(config, env) { }, }; + /* istanbul ignore if */ if (isWebpack4) { webpackConfig.mode = env; } @@ -102,6 +103,7 @@ module.exports = function(config, env) { }, }); + /* istanbul ignore if */ if (isWebpack4) { webpackConfig.optimization = { minimizer: [uglifier], From 1cc235b8f8a32fd420164a6f0286921871650e11 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 10:35:09 +0200 Subject: [PATCH 13/21] Fix semantic-release command --- .travis.yml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index 870ca37b8..950c7163e 100644 --- a/.travis.yml +++ b/.travis.yml @@ -66,11 +66,11 @@ jobs: - stage: release node_js: lts/* script: - - npm install -g semantic-release - npm install --no-save semantic-release-tamia - - semantic-release --analyze-commits semantic-release-tamia/analyzeCommits - --verify-release semantic-release-tamia/verifyRelease --generate-notes - semantic-release-tamia/generateNotes + - npx semantic-release \ + - --analyze-commits semantic-release-tamia/analyzeCommits \ + - --verify-release semantic-release-tamia/verifyRelease \ + - --generate-notes semantic-release-tamia/generateNotes - stage: documentation node_js: lts/* From 25a49cd38bbdcd179132356325812816858ff42a Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 10:54:20 +0200 Subject: [PATCH 14/21] Try to speed up CI by not installing the same version of webpack --- .travis.yml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index 950c7163e..a99e8a505 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,7 +4,7 @@ node_js: - 8 - 9 env: - - WEBPACK_VERSION=4 + - WEBPACK_VERSION= # Current, from package.json - WEBPACK_VERSION=3 cache: directories: @@ -13,8 +13,8 @@ before_install: # Upgrade npm - if [[ `npm -v` != 5* ]]; then npm install -g npm@latest; fi before_script: - # Manually install Webpack version - - npm install --no-save webpack@$WEBPACK_VERSION + # Install Webpack version + - if [[ -n "$WEBPACK_VERSION" ]]; then npm install --no-save webpack@$WEBPACK_VERSION; fi script: # Run tests without coverage since it's 2x faster - npm run test:jest -- --runInBand @@ -49,7 +49,7 @@ jobs: - npm run test:browser - npm run test:browser:customised - npm run test:browser:sections - # Run integration tests with cypress + # Run integration tests with Cypress - npm run test:cypress:pre - npm run test:cypress:startServer & - npm run test:cypress:startServer:post From fb7f5b1b608779c3b104eab5821f8d24ab19e8f4 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 11:03:55 +0200 Subject: [PATCH 15/21] Fix integration tests --- .travis.yml | 12 +++++++----- package.json | 6 +++--- 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/.travis.yml b/.travis.yml index a99e8a505..92bbcfc9b 100644 --- a/.travis.yml +++ b/.travis.yml @@ -18,10 +18,6 @@ before_script: script: # Run tests without coverage since it's 2x faster - npm run test:jest -- --runInBand - # Build all examples - - npm run build - - npm run build:customised - - npm run build:sections branches: except: - /^v\d+\.\d+\.\d+$/ @@ -44,9 +40,15 @@ jobs: - stage: integration node_js: lts/* script: + # Compile JS + - npm run compile + # Build all examples + - npm run build:basic + - npm run build:customised + - npm run build:sections # Check that examples really works: no JS errors on load - npm run test:browser:pre - - npm run test:browser + - npm run test:browser:basic - npm run test:browser:customised - npm run test:browser:sections # Run integration tests with Cypress diff --git a/package.json b/package.json index c30801c39..f79ae9132 100644 --- a/package.json +++ b/package.json @@ -147,12 +147,12 @@ "precompile": "rimraf lib/", "compile": "babel --ignore '*.spec.js' -d lib/ src/", "compile:watch": "babel --ignore '*.spec.js' --watch -d lib/ src/", - "prebuild": "npm run compile", - "build": "node bin/styleguidist.js build --config examples/basic/styleguide.config.js", + "prepublishOnly": "npm run compile", + "build:basic": "node bin/styleguidist.js build --config examples/basic/styleguide.config.js", "build:customised": "node bin/styleguidist.js build --config examples/customised/styleguide.config.js", "build:sections": "node bin/styleguidist.js build --config examples/sections/styleguide.config.js", "test:browser:pre": "npm i --no-save puppeteer", - "test:browser": "node test/browser.js examples/basic/styleguide/index.html", + "test:browser:basic": "node test/browser.js examples/basic/styleguide/index.html", "test:browser:customised": "node test/browser.js examples/customised/styleguide/index.html", "test:browser:sections": "node test/browser.js examples/sections/styleguide/index.html", "precommit": "lint-staged", From 01bec00d847ff890c27835c84eb0d9a175e44e65 Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 11:28:33 +0200 Subject: [PATCH 16/21] Try to fix semantic-release command again --- .travis.yml | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index 92bbcfc9b..8536911a3 100644 --- a/.travis.yml +++ b/.travis.yml @@ -69,10 +69,11 @@ jobs: node_js: lts/* script: - npm install --no-save semantic-release-tamia - - npx semantic-release \ - - --analyze-commits semantic-release-tamia/analyzeCommits \ - - --verify-release semantic-release-tamia/verifyRelease \ - - --generate-notes semantic-release-tamia/generateNotes + - >- + npx semantic-release \ + --analyze-commits semantic-release-tamia/analyzeCommits \ + --verify-release semantic-release-tamia/verifyRelease \ + --generate-notes semantic-release-tamia/generateNotes - stage: documentation node_js: lts/* From c1fad23ed730fa56d3d059e16426e6a222fb3245 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Sat, 31 Mar 2018 11:29:44 +0200 Subject: [PATCH 17/21] Use npm ci on CI --- .travis.yml | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/.travis.yml b/.travis.yml index 8536911a3..00be5eb23 100644 --- a/.travis.yml +++ b/.travis.yml @@ -9,9 +9,10 @@ env: cache: directories: - node_modules -before_install: - # Upgrade npm - - if [[ `npm -v` != 5* ]]; then npm install -g npm@latest; fi +install: + # Use npm 5.7.x since it has introduced `npm ci` + - if [[ `npm -v` != 5.7* ]]; then npm install -g npm@>=5.x; fi + - npm ci before_script: # Install Webpack version - if [[ -n "$WEBPACK_VERSION" ]]; then npm install --no-save webpack@$WEBPACK_VERSION; fi From c10151333700f1b165d58987d5d5fb8bbed57d25 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Sat, 31 Mar 2018 11:32:21 +0200 Subject: [PATCH 18/21] Remove node_modules cache since npm ci will remove it either way --- .travis.yml | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/.travis.yml b/.travis.yml index 00be5eb23..4ca6e9364 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,12 +6,9 @@ node_js: env: - WEBPACK_VERSION= # Current, from package.json - WEBPACK_VERSION=3 -cache: - directories: - - node_modules install: # Use npm 5.7.x since it has introduced `npm ci` - - if [[ `npm -v` != 5.7* ]]; then npm install -g npm@>=5.x; fi + - if [[ `npm -v` != 5.7* ]]; then npm install -g npm@>=5.7.1; fi - npm ci before_script: # Install Webpack version From d633b88ac7b00fe46a23d1b9f1aa2bc2c7fda3e7 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Sat, 31 Mar 2018 11:39:39 +0200 Subject: [PATCH 19/21] Use Node 9 by default to speed up build --- .travis.yml | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/.travis.yml b/.travis.yml index 4ca6e9364..8d21bda3f 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,8 +1,8 @@ language: node_js node_js: - - 6 - - 8 - 9 + - 8 + - 6 env: - WEBPACK_VERSION= # Current, from package.json - WEBPACK_VERSION=3 @@ -30,13 +30,11 @@ stages: jobs: include: - stage: lint - node_js: lts/* script: - npm run lint - npx danger ci - stage: integration - node_js: lts/* script: # Compile JS - npm run compile @@ -56,7 +54,6 @@ jobs: - npm run test:cypress:run - stage: coverage - node_js: lts/* script: # Run tests with coverage - npm run test:coverage -- --runInBand @@ -64,7 +61,6 @@ jobs: - bash <(curl -s https://codecov.io/bash) - stage: release - node_js: lts/* script: - npm install --no-save semantic-release-tamia - >- @@ -74,6 +70,5 @@ jobs: --generate-notes semantic-release-tamia/generateNotes - stage: documentation - node_js: lts/* script: - curl -X POST -d '{}' https://api.netlify.com/build_hooks/591308eba700c425fc1e8a54 From fc1d1e0188061a9d6e0d2ed708fc7955cd531c1e Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Sat, 31 Mar 2018 11:45:48 +0200 Subject: [PATCH 20/21] Fix npm installation script --- .travis.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.travis.yml b/.travis.yml index 8d21bda3f..7e1bd53ad 100644 --- a/.travis.yml +++ b/.travis.yml @@ -8,7 +8,7 @@ env: - WEBPACK_VERSION=3 install: # Use npm 5.7.x since it has introduced `npm ci` - - if [[ `npm -v` != 5.7* ]]; then npm install -g npm@>=5.7.1; fi + - if [[ `npm -v` != 5.7* ]]; then npm install -g npm@'>=5.7.1'; fi - npm ci before_script: # Install Webpack version From b5e283d78b54c1862f279448903f8a96bf92246a Mon Sep 17 00:00:00 2001 From: Artem Sapegin Date: Sat, 31 Mar 2018 14:43:42 +0200 Subject: [PATCH 21/21] Fix semantic-release command again --- .travis.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/.travis.yml b/.travis.yml index 7e1bd53ad..16ae73828 100644 --- a/.travis.yml +++ b/.travis.yml @@ -64,9 +64,9 @@ jobs: script: - npm install --no-save semantic-release-tamia - >- - npx semantic-release \ - --analyze-commits semantic-release-tamia/analyzeCommits \ - --verify-release semantic-release-tamia/verifyRelease \ + npx semantic-release + --analyze-commits semantic-release-tamia/analyzeCommits + --verify-release semantic-release-tamia/verifyRelease --generate-notes semantic-release-tamia/generateNotes - stage: documentation