Add karma to run unit tests

This commit is contained in:
Surma
2018-05-29 23:03:22 +01:00
parent 7042491257
commit 668acf2698
6 changed files with 2492 additions and 163 deletions

113
karma.conf.js Normal file
View File

@@ -0,0 +1,113 @@
const fs = require("fs");
function readJsonFile(path) {
// TypeScript puts lots of comments in the default `tsconfig.json`, so you
// cant use `require()` to read it. Hence this hack.
return eval("(" + fs.readFileSync(path).toString("utf-8") + ")");
}
const typeScriptConfig = readJsonFile("./tsconfig.json");
const babel = readJsonFile("./.babelrc");
module.exports = function(config) {
const options = {
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: "",
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ["mocha", "chai", "karma-typescript"],
// list of files / patterns to load in the browser
files: [
{
pattern: "test/**/*.ts",
type: "module"
},
{
pattern: "src/**/*.ts",
included: false
}
],
// list of files / patterns to exclude
exclude: [],
// preprocess matching files before serving them to the browser // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
"src/**/*.ts": ["karma-typescript", "babel"],
"test/**/*.ts": ["karma-typescript", "babel"]
},
babelPreprocessor: {
options: babel
},
karmaTypescriptConfig: {
// Inline `tsconfig.json` so that the right TS libs are loaded
...typeScriptConfig,
// Coverage is a thing that karma-typescript forces on you and only
// creates problems. This is the simplest way of disabling it that I
// could find.
coverageOptions: {
exclude: /.*/
}
},
mime: {
// Default mimetype for .ts files is video/mp2t but we need
// text/javascript for modules to work.
"text/javascript": ["ts"]
},
plugins: [
// Load all modules whose name starts with "karma" (usually the default).
"karma-*",
// We dont have file extensions on our imports as they are primarily
// consumed by webpack. With Karma, however, this turns into a real HTTP
// request for a non-existent file. This inline plugin is a middleware
// that appends `.ts` to the request URL.
{
"middleware:redirect_to_ts": [
"value",
(req, res, next) => {
if (req.url.startsWith("/base/src")) {
req.url += '.ts';
}
next();
}
]
}
],
// Run our middleware before all other middlewares.
beforeMiddleware: ["redirect_to_ts"],
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ["progress"],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: false,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ["ChromeHeadless"],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: true,
// These custom files allow us to use ES6 modules in our tests.
// Remove these 2 lines (and files) once https://github.com/karma-runner/karma/pull/2834 lands.
customContextFile: "test/context.html",
customDebugFile: "test/debug.html"
};
config.set(options);
};

2436
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -9,7 +9,7 @@
"start": "webpack serve --host 0.0.0.0 --hot",
"build": "webpack -p",
"lint": "eslint src",
"test": "npm run build && mocha -R spec"
"test": "npm run build && mocha -R spec && karma start"
},
"eslintConfig": {
"extends": [
@@ -32,6 +32,9 @@
"build/*"
],
"devDependencies": {
"@types/chai": "^4.1.3",
"@types/karma": "^1.7.3",
"@types/mocha": "^5.2.0",
"@types/node": "^9.4.7",
"@types/webassembly-js-api": "0.0.1",
"babel-loader": "^7.1.4",
@@ -62,9 +65,15 @@
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.0.6",
"if-env": "^1.0.4",
"karma": "^2.0.2",
"karma-babel-preprocessor": "^7.0.0",
"karma-chai": "^0.1.0",
"karma-chrome-launcher": "^2.2.0",
"karma-mocha": "^1.3.0",
"karma-typescript": "^3.0.12",
"loader-utils": "^1.1.0",
"mini-css-extract-plugin": "^0.3.0",
"mocha": "^5.1.1",
"mocha": "^5.2.0",
"node-sass": "^4.7.2",
"optimize-css-assets-webpack-plugin": "^4.0.0",
"prettier": "^1.12.1",

41
test/context.html Normal file
View File

@@ -0,0 +1,41 @@
<!DOCTYPE html>
<!--
This file is taken from https://github.com/karma-runner/karma/pull/2834. It allows us to use ES6 module imports in our test suite files.
-->
<!--
This is the execution context.
Loaded within the iframe.
Reloaded before every execution run.
-->
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
</head>
<body>
<!-- The scripts need to be in the body DOM element, as some test running frameworks need the body
to have already been created so they can insert their magic into it. For example, if loaded
before body, Angular Scenario test framework fails to find the body and crashes and burns in
an epic manner. -->
<script src="context.js"></script>
<script type="text/javascript">
// Configure our Karma and set up bindings
%CLIENT_CONFIG%
window.__karma__.setupContext(window);
// All served files with the latest timestamps
%MAPPINGS%
</script>
<!-- Dynamically replaced with <script> tags -->
%SCRIPTS%
<!-- Since %SCRIPTS% might include modules, the `loaded()` call needs to be in a module too.
This ensures all the tests will have been declared before karma tries to run them. -->
<script type="module">
window.__karma__.loaded();
</script>
<script nomodule>
window.__karma__.loaded();
</script>
</body>
</html>

43
test/debug.html Normal file
View File

@@ -0,0 +1,43 @@
<!doctype html>
<!--
This file is taken from https://github.com/karma-runner/karma/pull/2834. It allows us to use ES6 module imports in our test suite files.
-->
<!--
This file is almost the same as context.html - loads all source files,
but its purpose is to be loaded in the main frame (not within an iframe),
just for immediate execution, without reporting to Karma server.
-->
<html>
<head>
%X_UA_COMPATIBLE%
<title>Karma DEBUG RUNNER</title>
<link href="favicon.ico" rel="icon" type="image/x-icon" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
</head>
<body>
<!-- The scripts need to be at the end of body, so that some test running frameworks
(Angular Scenario, for example) need the body to be loaded so that it can insert its magic
into it. If it is before body, then it fails to find the body and crashes and burns in an epic
manner. -->
<script src="context.js"></script>
<script src="debug.js"></script>
<script type="text/javascript">
// Configure our Karma
%CLIENT_CONFIG%
// All served files with the latest timestamps
%MAPPINGS%
</script>
<!-- Dynamically replaced with <script> tags -->
%SCRIPTS%
<!-- Since %SCRIPTS% might include modules, the `loaded()` call needs to be in a module too.
This ensures all the tests will have been declared before karma tries to run them. -->
<script type="module">
window.__karma__.loaded();
</script>
<script nomodule>
window.__karma__.loaded();
</script>
</body>
</html>

9
test/lib/util.ts Normal file
View File

@@ -0,0 +1,9 @@
import {bitmapToImageData} from "../../src/lib/util";
const expect = chai.expect;
describe("util.bitmapToImageData", function () {
it("is a function", function () {
expect(bitmapToImageData).to.be.a('function');
});
});