diff --git a/js/__mocks__/styleMock.js b/js/__mocks__/styleMock.js
new file mode 100644
index 00000000..e69de29b
diff --git a/js/__tests__/MainWindow.js b/js/__tests__/MainWindow.js
new file mode 100644
index 00000000..8371934b
--- /dev/null
+++ b/js/__tests__/MainWindow.js
@@ -0,0 +1,46 @@
+const Winamp = ({
+ media: {
+ addEventListener: jest.fn(),
+ _analyser: null
+ }
+});
+
+const canvasMockify = require('canvas-mock');
+
+function createNodeMock(element) {
+ if (element.type === 'canvas') {
+ const Canvas = window.document.createElement('canvas');
+ canvasMockify(Canvas); // mock canvas functions required by Phaser.js are added
+ return Canvas;
+ }
+ return null;
+}
+
+window.requestAnimationFrame = () => {};
+
+import React from 'react';
+import {Provider} from 'react-redux';
+import renderer from 'react-test-renderer';
+import getStore from '../store';
+
+import MainWindow from '../components/MainWindow';
+
+describe('MainWindow', () => {
+ let store;
+ beforeEach(() => {
+ store = getStore(Winamp);
+ });
+
+ it('renders to snapshot', () => {
+ const options = {createNodeMock};
+ const tree = renderer.create(
+
+
+ ,
+ options).toJSON();
+ expect(tree).toMatchSnapshot();
+ });
+});
diff --git a/js/__tests__/__snapshots__/MainWindow.js.snap b/js/__tests__/__snapshots__/MainWindow.js.snap
new file mode 100644
index 00000000..6a02c84f
--- /dev/null
+++ b/js/__tests__/__snapshots__/MainWindow.js.snap
@@ -0,0 +1,369 @@
+exports[`MainWindow renders to snapshot 1`] = `
+
+
+ Loading...
+
+
+
+
+
+
+
+
+
+
+ 0
+
+
+ 0
+
+
+ 0
+
+
+ 0
+
+
+
+
+
+
+
+
+
+
+
+ W
+
+
+ i
+
+
+ n
+
+
+ a
+
+
+ m
+
+
+ p
+
+
+
+
+
+ 2
+
+
+ .
+
+
+ 9
+
+
+ 1
+
+ ;
+
+
+
+
+ n
+
+
+ u
+
+
+ l
+
+
+ l
+
+ ;
+
+
+
+ n
+
+
+ u
+
+
+ l
+
+
+ l
+
+ ;
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/package.json b/package.json
index a8679fcc..be7bd17f 100644
--- a/package.json
+++ b/package.json
@@ -37,6 +37,7 @@
"babel-polyfill": "^6.20.0",
"babel-preset-es2015": "^6.14.0",
"babel-preset-react": "^6.11.1",
+ "canvas-mock": "0.0.0",
"css-loader": "^0.26.1",
"eslint": "3.13.1",
"eslint-plugin-react": "^6.9.0",
@@ -44,6 +45,7 @@
"gzip-size-cli": "^1.0.0",
"jest-cli": "^18.1.0",
"pretty-bytes-cli": "^2.0.0",
+ "react-test-renderer": "^15.4.2",
"style-loader": "^0.13.1",
"url-loader": "^0.5.7",
"webpack": "^1.14.0",
@@ -60,5 +62,10 @@
"react-redux": "^5.0.2",
"redux": "^3.5.2",
"redux-thunk": "^2.1.0"
+ },
+ "jest": {
+ "moduleNameMapper": {
+ "\\.css$": "/js/__mocks__/styleMock.js"
+ }
}
}