chore(package): switch to Jest

.babelrc

@@ -25,9 +25,7 @@
       ]
     },
     "test": {
-      "plugins": [
-        ["istanbul", { "include": ["src"] }]
-      ]
+      "presets": [["@babel/env"], "@babel/react"]
     }
   }
 }

.circleci/config.yml

@@ -45,7 +45,7 @@ jobs:
           command: yarn lint
       - run:
           name: Test JavaScript
-          command: yarn test
+          command: yarn test -w=4
       - run:
           name: Report coverage
           command: bash <(curl -s https://codecov.io/bash)

config.js

@@ -5,7 +5,6 @@ import path from 'path'
 // ------------------------------------
 const env = process.env.NODE_ENV || 'development'
 const __DEV__ = env === 'development'
-const __TEST__ = env === 'test'
 const __PROD__ = env === 'production'
 
 const envConfig = {
@@ -51,18 +50,17 @@ const config = {
   // ----------------------------------
   // Compiler Configuration
   // ----------------------------------
-  compiler_devtool: (__DEV__ || __TEST__) && 'cheap-source-map',
+  compiler_devtool: __DEV__ && 'cheap-source-map',
   compiler_globals: {
     'process.env': {
       NODE_ENV: JSON.stringify(env),
     },
     __DEV__,
     __PATH_SEP__: JSON.stringify(path.sep),
-    __TEST__,
     __PROD__,
   },
   compiler_hash_type: __PROD__ ? 'chunkhash' : 'hash',
-  compiler_fail_on_warning: __TEST__ || __PROD__,
+  compiler_fail_on_warning: __PROD__,
   compiler_output_path: paths.base(envConfig.dir_docs_dist),
   compiler_public_path: '/',
   compiler_stats: {

docs/.eslintrc

@@ -1,7 +1,6 @@
 {
   "globals": {
     "__DEV__": false,
-    "__TEST__": false,
     "__PATH_SEP__": false,
     "__PROD__": false
   },

package.json

@@ -36,13 +36,31 @@
     "prestart": "yarn satisfied --fix yarn",
     "start": "gulp --series dll docs",
     "satisfied": "satisfied --skip-invalid",
-    "pretest": "yarn satisfied && gulp dll build:docs:docgen",
-    "test": "cross-env NODE_ENV=test node -r @babel/register ./node_modules/karma/bin/karma start karma.conf.babel.js",
-    "test:watch": "yarn test --no-single-run",
+    "pretest": "yarn satisfied && gulp build:docs:docgen",
+    "test": "cross-env NODE_ENV=test jest --coverage",
+    "test:watch": "yarn test --watchAll",
     "tsd:lint": "tslint \"./index.d.ts\" \"./src/**/*.d.ts\" \"./src/**/*.tsx\" \"./test/**/*.d.ts\" \"./test/**/*.tsx\"",
     "tsd:lint:fix": "yarn tsd:lint --fix",
     "tsd:test": "gulp build:dist:commonjs:tsd && tsc -p ./ && rm test/typings.js"
   },
+  "jest": {
+    "coverageDirectory": "./coverage/",
+    "coverageReporters": [
+      "json",
+      "lcov"
+    ],
+    "moduleFileExtensions": [
+      "js",
+      "json"
+    ],
+    "moduleNameMapper": {
+      "^docs/(.*)$": "<rootDir>/docs/$1",
+      "^src/(.*)$": "<rootDir>/src/$1",
+      "^test/(.*)$": "<rootDir>/test/$1"
+    },
+    "setupTestFrameworkScriptFile": "<rootDir>/test/setupTests.js",
+    "testRegex": "/test/specs/(modules)/(Accordion|Checkbox|Dimmer)/.*-test\\.js$"
+  },
   "lint-staged": {
     "**/*.{js,jsx}": [
       "prettier --write",
@@ -86,21 +104,19 @@
     "@babel/register": "^7.0.0-beta.49",
     "@babel/standalone": "^7.0.0-beta.49",
     "@types/react": "^16.0.0",
+    "babel-core": "^7.0.0-0",
     "babel-eslint": "^8.2.3",
+    "babel-jest": "^23.4.0",
     "babel-loader": "^8.0.0-beta.3",
     "babel-plugin-filter-imports": "^2.0.0",
-    "babel-plugin-istanbul": "^4.1.6",
     "babel-plugin-lodash": "^3.2.11",
     "babel-plugin-transform-react-handled-props": "^1.0.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.13",
     "babel-polyfill": "7.0.0-beta.3",
-    "chai": "^4.1.1",
-    "chai-enzyme": "beta",
     "connect-history-api-fallback": "^1.3.0",
     "copy-to-clipboard": "^3.0.8",
     "cross-env": "^5.1.4",
     "debug": "^3.0.1",
-    "dirty-chai": "^2.0.1",
     "doctoc": "^1.3.0",
     "doctrine": "^2.0.0",
     "enzyme": "^3.3.0",
@@ -109,7 +125,6 @@
     "eslint-config-airbnb": "^15.1.0",
     "eslint-plugin-import": "^2.7.0",
     "eslint-plugin-jsx-a11y": "^5.1.1",
-    "eslint-plugin-mocha": "^4.11.0",
     "eslint-plugin-react": "^7.2.1",
     "express": "^4.15.4",
     "faker": "^4.1.0",
@@ -120,20 +135,11 @@
     "html-webpack-plugin": "^2.30.1",
     "husky": "^0.14.3",
     "imports-loader": "^0.7.1",
+    "jest": "^23.4.0",
     "js-beautify": "^1.6.14",
-    "json-loader": "^0.5.7",
-    "karma": "^1.7.0",
-    "karma-chrome-launcher": "^2.2.0",
-    "karma-cli": "^1.0.1",
-    "karma-coverage": "^1.1.2",
-    "karma-mocha": "^1.3.0",
-    "karma-mocha-reporter": "^2.2.3",
-    "karma-webpack-with-fast-source-maps": "^1.10.2",
     "leven": "^2.1.0",
     "lint-staged": "^7.2.0",
-    "mocha": "^3.5.0",
     "prettier": "^1.12.0",
-    "puppeteer": "1.3.0",
     "raw-loader": "^0.5.1",
     "react": "^16.0.0",
     "react-ace": "^5.1.2",
@@ -143,14 +149,11 @@
     "react-hot-loader": "^4.1.3",
     "react-router": "^4.1.2",
     "react-router-dom": "^4.1.2",
-    "react-test-renderer": "^16.0.0",
     "require-dir": "^0.3.2",
     "rimraf": "^2.6.1",
     "satisfied": "^1.1.2",
     "semantic-ui-css": "^2.3.1",
     "simulant": "^0.2.2",
-    "sinon": "^5.0.10",
-    "sinon-chai": "^3.1.0",
     "ta-scripts": "^2.5.2",
     "through2": "^2.0.3",
     "tslint": "^5.10.0",

src/elements/Label/Label.js

@@ -118,9 +118,7 @@ export default class Label extends Component {
   static Group = LabelGroup
 
   handleClick = (e) => {
-    const { onClick } = this.props
-
-    if (onClick) onClick(e, this.props)
+    _.invoke(this.props, 'onClick', e, this.props)
   }
 
   handleIconOverrides = predefinedProps => ({

src/modules/Rating/RatingIcon.js

@@ -1,5 +1,6 @@
 import cx from 'classnames'
 import keyboardKey from 'keyboard-key'
+import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'
 
@@ -55,32 +56,24 @@ export default class RatingIcon extends Component {
   }
 
   handleClick = (e) => {
-    const { onClick } = this.props
-
-    if (onClick) onClick(e, this.props)
+    _.invoke(this.props, 'onClick', e, this.props)
   }
 
   handleKeyUp = (e) => {
-    const { onClick, onKeyUp } = this.props
-
-    if (onKeyUp) onKeyUp(e, this.props)
-
-    if (onClick) {
-      switch (keyboardKey.getCode(e)) {
-        case keyboardKey.Enter:
-        case keyboardKey.Spacebar:
-          e.preventDefault()
-          onClick(e, this.props)
-          break
-        default:
-      }
+    _.invoke(this.props, 'onKeyUp', e, this.props)
+
+    switch (keyboardKey.getCode(e)) {
+      case keyboardKey.Enter:
+      case keyboardKey.Spacebar:
+        e.preventDefault()
+        _.invoke(this.props, 'onClick', e, this.props)
+        break
+      default:
     }
   }
 
   handleMouseEnter = (e) => {
-    const { onMouseEnter } = this.props
-
-    if (onMouseEnter) onMouseEnter(e, this.props)
+    _.invoke(this.props, 'onMouseEnter', e, this.props)
   }
 
   render() {

src/views/Feed/FeedLabel.js

@@ -33,7 +33,7 @@ function FeedLabel(props) {
     <ElementType {...rest} className={classes}>
       {content}
       {Icon.create(icon, { autoGenerateKey: false })}
-      {createHTMLImage(image)}
+      {createHTMLImage(image, { autoGenerateKey: false })}
     </ElementType>
   )
 }

test/.eslintrc

@@ -1,19 +1,13 @@
 {
   "env": {
     "browser": true,
-    "node": true,
-    "mocha": true
+    "jest": true,
+    "node": true
   },
   "globals": {
-    "enzyme": false,
-    "expect": false,
     "mount": false,
-    "shallow": false,
-    "render": false
+    "shallow": false
   },
-  "plugins": [
-    "mocha"
-  ],
   "rules": {
     "jsx-a11y/alt-text": 0,
     "jsx-a11y/tabindex-no-positive": 0