From d78cb21a2dfdc6942449bb471cebc66feb51c4ea Mon Sep 17 00:00:00 2001 From: ShengDi Date: Thu, 26 Apr 2018 17:03:32 -0700 Subject: [PATCH 1/4] Jest support --- .../config/archetype.js | 3 +- .../config/babel/babelrc-client | 3 ++ .../config/jest/__mocks__/fileMock.js | 3 ++ .../config/jest/__mocks__/frameworkMock.js | 5 +++ .../config/jest/jest.config.js | 34 +++++++++++++++++++ .../config/karma/entry.js | 2 +- .../package.json | 4 +++ .../arch-clap.js | 31 +++++++++++++---- 8 files changed, 77 insertions(+), 8 deletions(-) create mode 100644 packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js create mode 100644 packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js create mode 100644 packages/electrode-archetype-react-app-dev/config/jest/jest.config.js diff --git a/packages/electrode-archetype-react-app-dev/config/archetype.js b/packages/electrode-archetype-react-app-dev/config/archetype.js index a4225e340..b63715c0b 100644 --- a/packages/electrode-archetype-react-app-dev/config/archetype.js +++ b/packages/electrode-archetype-react-app-dev/config/archetype.js @@ -41,7 +41,8 @@ module.exports = { istanbul: `${configDir}/istanbul`, karma: `${configDir}/karma`, mocha: `${configDir}/mocha`, - webpack: `${configDir}/webpack` + webpack: `${configDir}/webpack`, + jest: `${configDir}/jest` }, archetypeOptions.configPaths ) diff --git a/packages/electrode-archetype-react-app-dev/config/babel/babelrc-client b/packages/electrode-archetype-react-app-dev/config/babel/babelrc-client index 7113cb15a..08f07309e 100644 --- a/packages/electrode-archetype-react-app-dev/config/babel/babelrc-client +++ b/packages/electrode-archetype-react-app-dev/config/babel/babelrc-client @@ -52,6 +52,9 @@ "transform-runtime" ], "env": { + "test": { + "plugins": ["dynamic-import-node"] + }, "production": { "plugins": [ "babel-plugin-transform-react-constant-elements", diff --git a/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js new file mode 100644 index 000000000..ea1367c1e --- /dev/null +++ b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js @@ -0,0 +1,3 @@ +// __mocks__/fileMock.js + +module.exports = "test-file-stub"; diff --git a/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js new file mode 100644 index 000000000..1b86882f3 --- /dev/null +++ b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js @@ -0,0 +1,5 @@ +const Enzyme = require("enzyme"); +const EnzymeAdapter = require("enzyme-adapter-react-16"); + +// Setup enzyme's react adapter +Enzyme.configure({ adapter: new EnzymeAdapter() }); diff --git a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js new file mode 100644 index 000000000..21b564206 --- /dev/null +++ b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js @@ -0,0 +1,34 @@ +const Path = require("path"); +const optionalRequire = require("optional-require")(require); + +const rootDir = Path.join(Path.resolve("node_modules"), ".."); +const devPkgPath = Path.join( + rootDir, + "node_modules", + "electrode-archetype-react-app-dev" +); +const jestPath = Path.join(devPkgPath, "config", "jest"); +const fileMock = Path.join(jestPath, "__mocks__", "fileMock.js"); +const frameworkMock = Path.join(jestPath, "__mocks__", "frameworkMock.js"); + +const archetypeOptions = optionalRequire(Path.resolve("archetype", "config"), { + default: {} +}); + +const jestDefaultConfig = { + rootDir, + moduleFileExtensions: ["js", "jsx"], + moduleDirectories: ["node_modules", "src"], + moduleNameMapper: { + "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": fileMock, + "\\.(css|less)$": "identity-obj-proxy" + }, + setupTestFrameworkScriptFile: frameworkMock, + modulePathIgnorePatterns: ["/test"] +}; + +module.exports = Object.assign( + {}, + jestDefaultConfig, + archetypeOptions.jest +); diff --git a/packages/electrode-archetype-react-app-dev/config/karma/entry.js b/packages/electrode-archetype-react-app-dev/config/karma/entry.js index 57c85b141..7120596d2 100644 --- a/packages/electrode-archetype-react-app-dev/config/karma/entry.js +++ b/packages/electrode-archetype-react-app-dev/config/karma/entry.js @@ -54,7 +54,7 @@ window.mocha.setup({ // Use webpack to include all app code _except_ the entry point so we can get // code coverage in the bundle, whether tested or not. // NOTE: No need to specify src even in src mode since webpack should handle that already -var srcReq = require.context("client", true, /^((?!app).)*\.jsx?$/); +var srcReq = require.context("client", true, /^((?!app).)(!(spec|test))*\.(jsx|js)?$/); srcReq.keys().map(srcReq); // Use webpack to infer and `require` tests automatically only for test/client diff --git a/packages/electrode-archetype-react-app-dev/package.json b/packages/electrode-archetype-react-app-dev/package.json index 3efd996b4..8b136653b 100644 --- a/packages/electrode-archetype-react-app-dev/package.json +++ b/packages/electrode-archetype-react-app-dev/package.json @@ -25,6 +25,7 @@ "babel-core": "^6.4.0", "babel-eslint": "^8.1.2", "babel-loader": "^7.0.0", + "babel-jest": "^22.4.3", "babel-plugin-i18n-id-hashing": "^2.1.0", "babel-plugin-lodash": "^3.1.3", "babel-plugin-minify-dead-code-elimination": "^0.1.7", @@ -35,6 +36,7 @@ "babel-plugin-transform-react-inline-elements": "^6.6.5", "babel-plugin-transform-react-remove-prop-types": "^0.4.8", "babel-plugin-transform-runtime": "^6.8.0", + "babel-plugin-dynamic-import-node": "^1.2.0", "babel-polyfill": "^6.5.0", "babel-preset-env": "^1.6.1", "babel-preset-react": "^6.3.13", @@ -60,9 +62,11 @@ "file-loader": "^0.11.1", "fs-extra": "^0.26.5", "glob": "^7.0.6", + "identity-obj-proxy": "^3.0.0", "isomorphic-loader": "^2.0.0", "isparta": "^4.0.0", "istanbul": "^0.4.5", + "jest": "^22.4.3", "json-loader": "^0.5.7", "jsonfile": "^2.2.2", "karma": "^1.7.1", diff --git a/packages/electrode-archetype-react-app/arch-clap.js b/packages/electrode-archetype-react-app/arch-clap.js index 5b7c11916..05ba32c53 100644 --- a/packages/electrode-archetype-react-app/arch-clap.js +++ b/packages/electrode-archetype-react-app/arch-clap.js @@ -6,6 +6,7 @@ const Fs = require("fs"); const archetype = require("./config/archetype"); const assert = require("assert"); const requireAt = require("require-at"); +const glob = require("glob"); assert(!archetype.noDev, "dev archetype is missing - development & build tasks not possible"); @@ -670,7 +671,8 @@ Individual .babelrc files were generated for you in src/client and src/server "test-cov": [ ".build.test.client.babelrc", ".build.test.server.babelrc", - "test-frontend-cov", + "karma-test-frontend-cov", + "jest-test-frontend-cov", "test-server-cov" ], "test-dev": ["test-frontend-dev", "test-server-dev"], @@ -688,11 +690,28 @@ Individual .babelrc files were generated for you in src/client and src/server `--colors` ), - "test-frontend-cov": mkCmd( - `karma start`, - quote(karmaConfig("karma.conf.coverage.js")), - `--colors` - ), + "karma-test-frontend-cov": () => { + if (shell.test("-d", "test")) { + console.log(`\n*** Running karma unit tests: ***\n`); + return exec( + `karma start`, + quote(karmaConfig("karma.conf.coverage.js")), + `--colors` + ); + } + return undefined; + }, + "jest-test-frontend-cov": () => { + const srcJestFiles = glob.sync(`${Path.resolve(AppMode.src.dir)}/**/\*.{test,spec}.{js,jsx}`); + + if (shell.test("-d", "_test_") || srcJestFiles.length > 0) { + console.log(`\n*** Running jest unit tests: ***\n`); + return exec( + "jest", + `--config ${archetype.config.jest}/jest.config.js` + ); + } + }, "test-frontend-dev": () => exec(`pgrep -fl "webpack-dev-server.*${archetype.webpack.testPort}"`) From 20d4bad346b7dfe01bd3934d4f98a12ba6c1ded9 Mon Sep 17 00:00:00 2001 From: ShengDi Date: Wed, 2 May 2018 16:33:30 -0700 Subject: [PATCH 2/4] fix eslint issues --- .../config/jest/__mocks__/{fileMock.js => file-mock.js} | 0 .../jest/__mocks__/{frameworkMock.js => framework-mock.js} | 0 .../config/jest/jest.config.js | 4 ++-- 3 files changed, 2 insertions(+), 2 deletions(-) rename packages/electrode-archetype-react-app-dev/config/jest/__mocks__/{fileMock.js => file-mock.js} (100%) rename packages/electrode-archetype-react-app-dev/config/jest/__mocks__/{frameworkMock.js => framework-mock.js} (100%) diff --git a/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/file-mock.js similarity index 100% rename from packages/electrode-archetype-react-app-dev/config/jest/__mocks__/fileMock.js rename to packages/electrode-archetype-react-app-dev/config/jest/__mocks__/file-mock.js diff --git a/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js b/packages/electrode-archetype-react-app-dev/config/jest/__mocks__/framework-mock.js similarity index 100% rename from packages/electrode-archetype-react-app-dev/config/jest/__mocks__/frameworkMock.js rename to packages/electrode-archetype-react-app-dev/config/jest/__mocks__/framework-mock.js diff --git a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js index 21b564206..b9627233c 100644 --- a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js +++ b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js @@ -8,8 +8,8 @@ const devPkgPath = Path.join( "electrode-archetype-react-app-dev" ); const jestPath = Path.join(devPkgPath, "config", "jest"); -const fileMock = Path.join(jestPath, "__mocks__", "fileMock.js"); -const frameworkMock = Path.join(jestPath, "__mocks__", "frameworkMock.js"); +const fileMock = Path.join(jestPath, "__mocks__", "file-mock.js"); +const frameworkMock = Path.join(jestPath, "__mocks__", "framework-mock.js"); const archetypeOptions = optionalRequire(Path.resolve("archetype", "config"), { default: {} From 786ca7d6a864025b945284caa500923dad194761 Mon Sep 17 00:00:00 2001 From: ShengDi Date: Tue, 8 May 2018 17:34:48 -0700 Subject: [PATCH 3/4] optimize code --- .../config/jest/jest.config.js | 2 +- .../electrode-archetype-react-app/arch-clap.js | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js index b9627233c..68889b824 100644 --- a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js +++ b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js @@ -1,7 +1,7 @@ const Path = require("path"); const optionalRequire = require("optional-require")(require); -const rootDir = Path.join(Path.resolve("node_modules"), ".."); +const rootDir = process.cwd(); const devPkgPath = Path.join( rootDir, "node_modules", diff --git a/packages/electrode-archetype-react-app/arch-clap.js b/packages/electrode-archetype-react-app/arch-clap.js index 05ba32c53..f8710cce2 100644 --- a/packages/electrode-archetype-react-app/arch-clap.js +++ b/packages/electrode-archetype-react-app/arch-clap.js @@ -692,12 +692,12 @@ Individual .babelrc files were generated for you in src/client and src/server "karma-test-frontend-cov": () => { if (shell.test("-d", "test")) { - console.log(`\n*** Running karma unit tests: ***\n`); - return exec( - `karma start`, + logger.info("\nRunning Karma unit tests:\n"); + return mkCmd( + `~$karma start`, quote(karmaConfig("karma.conf.coverage.js")), `--colors` - ); + ) } return undefined; }, @@ -705,11 +705,11 @@ Individual .babelrc files were generated for you in src/client and src/server const srcJestFiles = glob.sync(`${Path.resolve(AppMode.src.dir)}/**/\*.{test,spec}.{js,jsx}`); if (shell.test("-d", "_test_") || srcJestFiles.length > 0) { - console.log(`\n*** Running jest unit tests: ***\n`); - return exec( - "jest", + logger.info("\nRunning jest unit tests:\n"); + return mkCmd( + `~$jest`, `--config ${archetype.config.jest}/jest.config.js` - ); + ) } }, From 50f804751067cae0fc0593d8cfdba3864a6986e5 Mon Sep 17 00:00:00 2001 From: ShengDi Date: Thu, 17 May 2018 15:54:04 -0700 Subject: [PATCH 4/4] update devPkgPath --- .../config/jest/jest.config.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js index 68889b824..a36c726cb 100644 --- a/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js +++ b/packages/electrode-archetype-react-app-dev/config/jest/jest.config.js @@ -2,11 +2,8 @@ const Path = require("path"); const optionalRequire = require("optional-require")(require); const rootDir = process.cwd(); -const devPkgPath = Path.join( - rootDir, - "node_modules", - "electrode-archetype-react-app-dev" -); +const devPkgPath = Path.join(__dirname, "../.."); + const jestPath = Path.join(devPkgPath, "config", "jest"); const fileMock = Path.join(jestPath, "__mocks__", "file-mock.js"); const frameworkMock = Path.join(jestPath, "__mocks__", "framework-mock.js");