[minor] Jest test component support (#783)

* component archetype jest support

* minor updates

packages/electrode-archetype-react-component-dev/config/babel/.babelrc

@@ -13,6 +13,9 @@
     "transform-runtime"
   ],
   "env": {
+    "test": {
+      "plugins": ["dynamic-import-node"]
+    },
     "production": {
       "plugins": [
         "babel-plugin-transform-react-constant-elements",

packages/electrode-archetype-react-component-dev/config/jest/__mocks__/file-mock.js

@@ -0,0 +1,3 @@
+// __mocks__/fileMock.js
+
+module.exports = "test-file-stub";

packages/electrode-archetype-react-component-dev/config/jest/__mocks__/framework-mock.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() });

packages/electrode-archetype-react-component-dev/config/jest/jest.config.js

@@ -0,0 +1,34 @@
+const Path = require("path");
+const optionalRequire = require("optional-require")(require);
+
+const rootDir = process.cwd();
+const devPkgPath = Path.join(
+  rootDir,
+  "node_modules",
+  "electrode-archetype-react-component-dev"
+);
+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");
+
+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: ["<rootDir>/test", "<rootDir>/lib"]
+};
+
+module.exports = Object.assign(
+  {},
+  jestDefaultConfig,
+  archetypeOptions.jest
+);

packages/electrode-archetype-react-component-dev/config/karma/entry.js

@@ -44,7 +44,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.
-var srcReq = require.context("src", true, /\.jsx?$/);
+var srcReq = require.context("src", true, /\*\*\/(!(spec|test))*\.(jsx|js)?$/);
 srcReq.keys().map(srcReq);
 
 // Use webpack to infer and `require` tests automatically.

packages/electrode-archetype-react-component-dev/package.json

@@ -18,6 +18,8 @@
     "babel-core": "^6.24.0",
     "babel-eslint": "^8.0.0",
     "babel-loader": "^7.0.0-beta.1",
+    "babel-jest": "^22.4.3",
+    "babel-plugin-dynamic-import-node": "^1.2.0",
     "babel-plugin-lodash": "^3.1.3",
     "babel-plugin-react-intl": "^2.1.2",
     "babel-plugin-transform-object-rest-spread": "^6.6.5",
@@ -47,8 +49,10 @@
     "glob": "^7.0.6",
     "history": "^1.13.1",
     "husky": "^0.13.4",
+    "identity-obj-proxy": "^3.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.5.0",

packages/electrode-archetype-react-component/archetype-clap.js

@@ -10,6 +10,7 @@ const exec = xsh.exec;
 const mkCmd = xsh.mkCmd;
 const chalk = devRequire("chalk");
 const Fs = require("fs");
+const glob = require("glob");
 
 if (process.argv[1].indexOf("gulp") >= 0) {
   const cmd = chalk.magenta(`clap ${process.argv.slice(2).join(" ")}`);
@@ -185,7 +186,7 @@ const tasks = {
   ),
 
   "test-ci": ["test-frontend-ci"],
-  "test-cov": ["test-frontend-cov"],
+  "test-cov": ["karma-test-frontend-cov", "jest-test-frontend-cov"],
   "test-dev": ["test-frontend-dev"],
   "test-watch": ["test-frontend-dev-watch"],
   "concurrent-test-watch": ["hot", "test-frontend-dev-watch"],
@@ -194,10 +195,28 @@ const tasks = {
     `karma start --browsers PhantomJS,Firefox`,
     `${archetype.devPath}/config/karma/karma.conf.coverage.js --colors`
   ),
-  "test-frontend-cov": mkCmd(
-    `karma start`,
-    `${archetype.devPath}/config/karma/karma.conf.coverage.js --colors`
-  ),
+  "karma-test-frontend-cov": () => {
+    if ($$.test("-d", "test")) {
+      console.log("\nRunning Karma unit tests:\n");
+      return mkCmd(
+        `~$karma start`,
+        `${archetype.devPath}/config/karma/karma.conf.coverage.js --colors`
+      );
+    }
+    return undefined;
+  },
+  "jest-test-frontend-cov": () => {
+    const srcJestFiles = glob.sync(`${process.cwd()}/src/**/\*.{test,spec}.{js,jsx}`);
+
+    if ($$.test("-d", "_test_") || srcJestFiles.length > 0) {
+      console.info("\nRunning jest unit tests:\n");
+      return mkCmd(
+        `~$jest`,
+        `--config ${archetype.devPath}/config/jest/jest.config.js`
+      )
+    }
+    return undefined;
+  },
   "test-frontend-dev": mkCmd(
     `karma start`,
     `${archetype.devPath}/config/karma/karma.conf.dev.js --colors`