Replace Karma / Mocha with Jest (#415)

* Remove mocha / karma setup * Replace innerText with textContent to make jest working innerText is not standard and therfore not supported by jsdom. Also according to this article https://kellegous.com/j/2013/02/27/innertext-vs-textcontent/ innerText is much slower than textContent. * Drop dynamic require * Setup jest * Reimplement fixture loading * Minimal required changes to make jest working * upgrade nodejs version * Make loadPlugins an object instead of a function See https://github.com/OctoLinker/browser-extension/pull/415/files#diff-63ac5d48d83927921b7bcdb2b5a8d124R50 * fixup! Minimal required changes to make jest working * Using path.posix.join to fix Windows issues
OctoLinker · Dec 19, 2017 · e50f339 · e50f339
1 parent ec40563
commit e50f339
Show file tree

Hide file tree

Showing 24 changed files with 1,376 additions and 998 deletions.
diff --git a/.appveyor.yml b/.appveyor.yml
@@ -1,6 +1,6 @@
 # Test against this version of Node.js
 environment:
-  nodejs_version: "6"
+  nodejs_version: "8"
 
 cache:
  - "%LOCALAPPDATA%\\Yarn"

diff --git a/.babelrc b/.babelrc
@@ -1,4 +1,9 @@
 {
+  "env": {
+    "test": {
+      "presets": ["env"]
+    }
+  },
   "plugins": [
     "transform-object-rest-spread",
     ["transform-react-jsx", { "pragma": "h" }]

diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,9 +1,9 @@
 module.exports = {
   extends: ['airbnb', 'prettier'],
-  plugins: ['prettier', 'react', 'mocha'],
+  plugins: ['prettier', 'react'],
   env: {
-    browser: true,
-    mocha: true
+    jest: true,
+    browser: true
   },
   settings: {
     react: {
@@ -37,15 +37,6 @@ module.exports = {
     'no-restricted-syntax': 0,
     'consistent-return': 0,
     'array-callback-return': 0,
-    'mocha/no-exclusive-tests': 2,
-    'mocha/no-skipped-tests': 2,
-    'mocha/no-pending-tests': 2,
-    'mocha/handle-done-callback': 2,
-    'mocha/no-global-tests': 2,
-    'mocha/no-return-and-callback': 2,
-    'mocha/no-sibling-hooks': 2,
-    'mocha/no-identical-title': 2,
-    'mocha/no-top-level-hooks': 2
   },
   globals: {
     fixture: true,

diff --git a/.travis.yml b/.travis.yml
@@ -7,7 +7,7 @@ addons:
       - google-chrome-stable
 language: node_js
 node_js:
-  - 6
+  - 8
 cache:
   yarn: true
 # Use npm > 4 to fix https://github.com/npm/npm/issues/14042

diff --git a/karma.conf.js b/karma.conf.js
diff --git a/lib/load-plugins.js b/lib/load-plugins.js
@@ -1,13 +1,25 @@
-// Load all plugins from /lib/plugins/*/index.js.
-// For more information about dynamic require see
-// https://webpack.github.io/docs/context.html
-
-export default function loadPlugins() {
-  function requireAll(requireContext) {
-    return requireContext
-      .keys()
-      .map(pluginPath => requireContext(pluginPath).default);
-  }
-
-  return requireAll(require.context('./plugins', false, /[^/]*.js$/));
-}
+export { default as BowerManifest } from './plugins/bower-manifest.js';
+export { default as Composer } from './plugins/composer-manifest.js';
+export { default as CSS } from './plugins/css.js';
+export { default as Docker } from './plugins/docker.js';
+export { default as DotNetCore } from './plugins/dot-net-core.js';
+export { default as DotNet } from './plugins/dot-net.js';
+export { default as Rubygems } from './plugins/gemfile-manifest.js';
+export { default as Go } from './plugins/go.js';
+export { default as Haskell } from './plugins/haskell.js';
+export { default as Homebrew } from './plugins/homebrew-manifest.js';
+export { default as HTML } from './plugins/html.js';
+export { default as Java } from './plugins/java.js';
+export { default as JavaScript } from './plugins/javascript.js';
+export { default as Less } from './plugins/less.js';
+export {
+  default as NodejsRelativePath,
+} from './plugins/nodejs-relative-path.js';
+export { default as NpmManifest } from './plugins/npm-manifest.js';
+export { default as Python } from './plugins/python.js';
+export { default as RequirementsTxt } from './plugins/requirements-txt.js';
+export { default as Ruby } from './plugins/ruby.js';
+export { default as Rust } from './plugins/rust.js';
+export { default as Sass } from './plugins/sass.js';
+export { default as TypeScript } from './plugins/typescript.js';
+export { default as Vim } from './plugins/vim.js';
diff --git a/lib/plugin-manager.js b/lib/plugin-manager.js
@@ -54,6 +54,7 @@ function getPluginsForGithubClasses(plugins, classList) {
 
 export default class {
   constructor(plugins) {
+    plugins = Object.values(plugins);
     this._pluginsList = plugins;
     this._plugins = buildPluginCache(plugins);
   }

diff --git a/lib/plugins/go.js b/lib/plugins/go.js
@@ -1,9 +1,9 @@
-import { join, dirname } from 'path';
+import { posix, dirname } from 'path';
 import { go } from '../../packages/helper-grammar-regex-collection/index.js';
 
 function goFile({ path, target }) {
   const list = [];
-  const basePath = join(dirname(path), target);
+  const basePath = posix.join(dirname(path), target);
   const filename = target.slice(target.lastIndexOf('/') + 1);
 
   list.push(`/${filename}.go`);

diff --git a/lib/plugins/javascript.js b/lib/plugins/javascript.js
@@ -1,4 +1,4 @@
-import { join, dirname, extname } from 'path';
+import { posix, dirname, extname } from 'path';
 import concatMap from 'concat-map';
 import {
   REQUIRE,
@@ -21,7 +21,7 @@ function getTopModuleName(target) {
 export function javascriptFile({ path, target }) {
   const list = [];
   const extName = ['.js', '.jsx', '.ts', '.tsx', '.ls', '.json'];
-  const basePath = join(dirname(path), target);
+  const basePath = posix.join(dirname(path), target);
   const pathExt = extname(path);
   const fileExt = extname(basePath);
 

diff --git a/lib/plugins/nodejs-relative-path.js b/lib/plugins/nodejs-relative-path.js
@@ -1,4 +1,4 @@
-import { join, dirname } from 'path';
+import { posix, dirname } from 'path';
 import {
   NODEJS_RELATIVE_PATH,
   NODEJS_RELATIVE_PATH_JOIN,
@@ -10,7 +10,7 @@ export default {
   name: 'NodejsRelativePath',
 
   resolve({ target, path }) {
-    return `{BASE_URL}${join(dirname(path), target)}`;
+    return `{BASE_URL}${posix.join(dirname(path), target)}`;
   },
 
   getPattern() {

diff --git a/lib/plugins/ruby.js b/lib/plugins/ruby.js
@@ -1,4 +1,4 @@
-import { join } from 'path';
+import { posix } from 'path';
 import { REQUIRE } from '../../packages/helper-grammar-regex-collection/index.js';
 import liveResolverQuery from '../resolver/live-resolver-query.js';
 
@@ -11,9 +11,9 @@ export default {
     // https://github.com/github/pages-gem/blob/master/lib/github-pages/dependencies.rb
 
     if (isPath) {
-      const basePath = join(path.split('/lib/')[0], 'lib');
+      const basePath = posix.join(path.split('/lib/')[0], 'lib');
 
-      return `{BASE_URL}${join(basePath, `${target}.rb`)}`;
+      return `{BASE_URL}${posix.join(basePath, `${target}.rb`)}`;
     }
 
     return [liveResolverQuery({ type: 'rubygems', target })];

diff --git a/lib/plugins/sass.js b/lib/plugins/sass.js
@@ -1,4 +1,4 @@
-import { join } from 'path';
+import { posix } from 'path';
 import pathParse from 'path-parse';
 import { CSS_IMPORT } from '../../packages/helper-grammar-regex-collection/index.js';
 import relativeFile from '../resolver/relative-file.js';
@@ -9,7 +9,7 @@ export default {
 
   resolve({ path, target }) {
     const { dir, name } = pathParse(target);
-    const prefixedTarget = join(dir, `_${name}`);
+    const prefixedTarget = posix.join(dir, `_${name}`);
 
     return [
       relativeFile({ path, target: `${prefixedTarget}.scss` }),

diff --git a/lib/resolver/relative-file.js b/lib/resolver/relative-file.js
@@ -1,5 +1,5 @@
-import { join, dirname } from 'path';
+import { posix, dirname } from 'path';
 
 export default function({ path, target }) {
-  return `{BASE_URL}${join(dirname(path), target)}`;
+  return `{BASE_URL}${posix.join(dirname(path), target)}`;
 }
diff --git a/package.json b/package.json
@@ -2,14 +2,14 @@
   "name": "OctoLinker",
   "version": "4.15.1",
   "engines": {
-    "node": ">=6.0.0"
+    "node": ">=8.0.0"
   },
   "main": "lib/app.js",
   "scripts": {
     "lint": "eslint .",
     "pretest": "npm run lint",
-    "test": "karma start",
-    "test:watch": "karma start --no-single-run --auto-watch",
+    "test": "jest",
+    "test:watch": "jest --watch",
     "version": "json -I -f assets/manifest.json -e \"this.version='`json -f package.json version`'\" && git add assets/manifest.json",
     "package": "npm run build && web-ext build --source-dir dist --artifacts-dir out --overwrite-dest",
     "release": "webstore upload --source dist --auto-publish",
@@ -20,8 +20,15 @@
     "firefox-open": "npm run build && npm run firefox-launch --",
     "firefox-launch": "web-ext run --source-dir dist --pref startup.homepage_welcome_url=https://github.com/OctoLinker/browser-extension/blob/master/package.json"
   },
+  "jest": {
+    "setupFiles": [
+      "./test/_setup.js"
+    ]
+  },
   "dependencies": {
     "JSONPath": "^0.11.2",
+    "babel-preset-env": "^1.6.1",
+    "babel-preset-jest": "^21.2.0",
     "builtins": "^1.0.3",
     "chrome-promise": "^2.1.1",
     "concat-map": "^0.0.1",
@@ -34,6 +41,7 @@
     "github-url-from-git": "^1.5.0",
     "github-url-from-username-repo": "^1.0.2",
     "giturl": "^1.0.0",
+    "jest": "^21.3.0-beta.14",
     "jquery": "^3.2.1",
     "linkstate": "^1.1.0",
     "path-parse": "^1.0.5",
@@ -60,23 +68,10 @@
     "eslint-config-prettier": "^2.6.0",
     "eslint-plugin-import": "^2.7.0",
     "eslint-plugin-jsx-a11y": "^6.0.2",
-    "eslint-plugin-mocha": "^4.11.0",
     "eslint-plugin-prettier": "^2.3.1",
     "json": "^9.0.4",
     "json-loader": "^0.5.7",
-    "karma": "^1.7.1",
-    "karma-chrome-launcher": "^2.2.0",
-    "karma-detect-browsers": "^2.2.5",
-    "karma-firefox-launcher": "^1.0.0",
-    "karma-fixture": "^0.2.6",
-    "karma-html2js-preprocessor": "^1.1.0",
-    "karma-mocha": "^1.3.0",
-    "karma-mocha-reporter": "^2.2.4",
-    "karma-phantomjs-launcher": "^1.0.2",
-    "karma-sourcemap-loader": "^0.3.7",
-    "karma-webpack": "^2.0.4",
     "mkdirp": "^0.5.1",
-    "mocha": "^4.0.0",
     "npm-run-all": "^4.1.1",
     "prettier": "^1.7.4",
     "sinon": "^4.0.1",

diff --git a/packages/blob-reader/helper.js b/packages/blob-reader/helper.js
@@ -122,7 +122,7 @@ function readLine(el) {
   // Each array element represents a single line.
   // Therefore we can get ride of the newline here.
   const ret = {
-    value: el.innerText.replace(/\n/, ''),
+    value: el.textContent.replace(/\n/, ''),
     lineNumber,
   };
 
@@ -140,9 +140,8 @@ function readLine(el) {
 function readLines(el) {
   if (el.classList.contains('highlight')) {
     const issueCode = el.getElementsByTagName('pre');
-
     if (issueCode.length) {
-      return issueCode[0].innerText.split(/\n/).map((line, index) => ({
+      return issueCode[0].textContent.split(/\n/).map((line, index) => ({
         value: line,
         lineNumber: index + 1,
       }));

diff --git a/test/_setup.js b/test/_setup.js
@@ -0,0 +1,18 @@
+import fs from 'fs';
+import path from 'path';
+
+global.chrome = {};
+global.chrome.runtime = {
+  sendMessage: jest.fn(),
+};
+
+global.fixture = {
+  load: file => {
+    const fullPath = path.join(__dirname, '..', file);
+    const fixture = fs.readFileSync(fullPath);
+    document.body.innerHTML = fixture.toString();
+  },
+  cleanup: () => {
+    document.body.innerHTML = '';
+  },
+};
diff --git a/test/click-handler.test.js b/test/click-handler.test.js
@@ -30,7 +30,7 @@ describe('click-handler', () => {
     $link.remove();
   });
 
-  after(() => {
+  afterAll(() => {
     sandbox.restore();
   });
 

diff --git a/test/load-plugins.test.js b/test/load-plugins.test.js
@@ -1,9 +1,9 @@
 import assert from 'assert';
-import loadPlugins from '../lib/load-plugins.js';
+import * as loadPlugins from '../lib/load-plugins.js';
 
 describe('load-plugins', () => {
   it('returns an array of objects', () => {
-    const plugins = loadPlugins();
+    const plugins = Object.values(loadPlugins);
 
     assert(Array.isArray(plugins));
 

diff --git a/test/main-lib.js b/test/main-lib.js
diff --git a/test/main-packages.js b/test/main-packages.js
diff --git a/test/pattern-preset.test.js b/test/pattern-preset.test.js
@@ -1,5 +1,5 @@
 import assert from 'assert';
-import loadPlugins from '../lib/load-plugins.js';
+import * as loadPlugins from '../lib/load-plugins.js';
 
 describe('pattern-preset', () => {
   describe('githubClasses', () => {
@@ -14,7 +14,9 @@ describe('pattern-preset', () => {
         );
       });
 
-      const presets = loadPlugins().map(plugin => plugin.getPattern());
+      const presets = Object.values(loadPlugins).map(plugin =>
+        plugin.getPattern(),
+      );
       for (const [lang, value] of Object.entries(presets)) {
         value.githubClasses.forEach(className => {
           if (!className.includes('highlight')) {