Skip to content

Commit 1f7dec6

Browse files
sahalsaadjustin808
authored andcommitted
#444 Migrate JS tests to Jest (#445)
1 parent ca12852 commit 1f7dec6

File tree

8 files changed

+1704
-265
lines changed

8 files changed

+1704
-265
lines changed

client/.eslintrc.yml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ parser: babel-eslint
44
extends: eslint-config-shakacode
55

66
plugins:
7+
- jest
78
- react
89

910
globals:
@@ -12,8 +13,8 @@ globals:
1213

1314
env:
1415
browser: true
16+
jest/globals: true
1517
node: true
16-
mocha: true
1718

1819
rules:
1920
import/extensions: [2, { js: "never", jsx: "never" }]

client/app/bundles/comments/components/CommentBox/CommentList/Comment/Comment.spec.jsx

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { React, expect, TestUtils } from 'libs/testHelper';
1+
import { React, TestUtils } from 'libs/testHelper';
22

33
import Comment from './Comment';
44

@@ -14,13 +14,12 @@ describe('Comment', () => {
1414
<Comment author="Frank" text="Hi!" />,
1515
);
1616

17-
// TODO: Setup testing of CSS Modules classNames
18-
// const comment = findRenderedDOMComponentWithTag(component, 'div');
19-
// expect(comment.className).to.equal('comment');
20-
// const author = findRenderedDOMComponentWithTag(component, 'h2');
21-
// expect(author.className).to.equal('comment-author');
17+
const comment = findRenderedDOMComponentWithTag(component, 'div');
18+
expect(comment.className).toEqual('comment');
19+
const author = findRenderedDOMComponentWithTag(component, 'h2');
20+
expect(author.className).toEqual('commentAuthor js-comment-author');
2221
const text = findRenderedDOMComponentWithTag(component, 'span');
23-
expect(text.className).to.equal('js-comment-text');
22+
expect(text.className).toEqual('js-comment-text');
2423
});
2524

2625
it('shows the author', () => {
@@ -29,7 +28,7 @@ describe('Comment', () => {
2928
);
3029

3130
const author = findRenderedDOMComponentWithClass(component, 'js-comment-author');
32-
expect(author.textContent).to.equal('Frank');
31+
expect(author.textContent).toEqual('Frank');
3332
});
3433

3534
it('shows the comment text in markdown', () => {
@@ -38,6 +37,6 @@ describe('Comment', () => {
3837
);
3938

4039
const comment = findRenderedDOMComponentWithClass(component, 'js-comment-text');
41-
expect(comment.textContent).to.equal('Hi!\n');
40+
expect(comment.textContent).toEqual('Hi!\n');
4241
});
4342
});

client/app/bundles/comments/components/CommentBox/CommentList/CommentList.spec.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { React, expect, TestUtils } from 'libs/testHelper';
1+
import { React, TestUtils } from 'libs/testHelper';
22
import { List, Map } from 'immutable';
33

44
import CommentList from './CommentList';
@@ -39,9 +39,9 @@ describe('CommentList', () => {
3939
/>,
4040
);
4141
const list = scryRenderedComponentsWithType(component, Comment);
42-
expect(list.length).to.equal(2);
43-
expect(list[0].props.author).to.equal('Frank');
44-
expect(list[1].props.author).to.equal('Furter');
42+
expect(list.length).toEqual(2);
43+
expect(list[0].props.author).toEqual('Frank');
44+
expect(list[1].props.author).toEqual('Furter');
4545
});
4646

4747
it('renders an alert if errors', () => {
@@ -54,6 +54,6 @@ describe('CommentList', () => {
5454
);
5555

5656
const alert = findRenderedDOMComponentWithTag(component, 'strong');
57-
expect(alert.textContent).to.equal('Comments could not be retrieved. ');
57+
expect(alert.textContent).toEqual('Comments could not be retrieved. ');
5858
});
5959
});

client/app/libs/testHelper.js

Lines changed: 0 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,8 @@
11
/* eslint-disable import/no-extraneous-dependencies */
22
import React from 'react';
33
import TestUtils from 'react-dom/test-utils';
4-
import jsdom from 'jsdom/lib/old-api';
5-
import chai from 'chai';
6-
import chaiImmutable from 'chai-immutable';
7-
8-
const doc = jsdom.jsdom('<!doctype html><html><body></body></html>');
9-
const win = doc.defaultView;
10-
11-
global.document = doc;
12-
global.window = win;
13-
14-
// from mocha-jsdom https://github.com/rstacruz/mocha-jsdom/blob/master/index.js#L80
15-
function propagateToGlobal(window) {
16-
Object.keys(window).forEach((key) => {
17-
if (key in global) return;
18-
global[key] = window[key];
19-
});
20-
}
21-
22-
// take all properties of the window object and also attach it to the
23-
// mocha global object
24-
propagateToGlobal(win);
25-
26-
// everything we need for our tests
27-
const {
28-
assert, expect,
29-
} = chai;
30-
31-
chai.use(chaiImmutable);
324

335
export {
346
React,
35-
chai,
36-
assert,
37-
expect,
387
TestUtils,
398
};

client/app/libs/testNullCompiler.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

client/package.json

Lines changed: 19 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
"homepage": "https://github.com/shakacode/react-webpack-rails-tutorial",
2727
"scripts": {
2828
"postinstall": "npm rebuild node-sass",
29-
"test": "NODE_PATH=./app mocha --require babel-core/register --require ./app/libs/testHelper.js --require ./app/libs/testNullCompiler.js 'app/**/*.spec.@(js|jsx)'",
30-
"test:debug": "yarn run test -- --debug-brk",
29+
"test": "NODE_PATH=./app jest",
30+
"test:debug": "NODE_PATH=./app node --inspect-brk jest --runInBand",
3131
"start": "babel-node server-express.js",
3232
"build:production:client": "NODE_ENV=production webpack -p --config webpack.client.rails.build.config.js",
3333
"build:production:server": "NODE_ENV=production webpack -p --config webpack.server.rails.build.config.js",
@@ -101,22 +101,35 @@
101101
},
102102
"devDependencies": {
103103
"babel-eslint": "^8.0.2",
104+
"babel-jest": "^23.4.2",
104105
"body-parser": "^1.18.2",
105-
"chai": "^4.1.2",
106-
"chai-immutable": "^1.6.0",
107106
"eslint": "^4.11.0",
108107
"eslint-config-shakacode": "^16.0.0",
109108
"eslint-import-resolver-webpack": "^0.8.3",
110109
"eslint-plugin-import": "^2.8.0",
110+
"eslint-plugin-jest": "^21.22.0",
111111
"eslint-plugin-jsx-a11y": "^6.0.2",
112112
"eslint-plugin-react": "^7.5.1",
113113
"estraverse-fb": "^1.3.2",
114114
"express": "^4.16.2",
115-
"jsdom": "^11.4.0",
116-
"mocha": "^4.0.1",
115+
"identity-obj-proxy": "^3.0.0",
116+
"jest": "^23.5.0",
117117
"pug": "^2.0.0-rc.4",
118118
"react-transform-hmr": "^1.0.4",
119+
"regenerator-runtime": "^0.12.1",
119120
"sleep": "^5.1.1",
120121
"webpack-dev-server": "^2.9.4"
122+
},
123+
"jest": {
124+
"moduleNameMapper": {
125+
"\\.scss$": "identity-obj-proxy"
126+
},
127+
"setupFiles": [
128+
"./app/libs/testHelper.js"
129+
],
130+
"testRegex": "./app/.*.spec\\.jsx?$",
131+
"transform": {
132+
"^.+\\.jsx?$": "babel-jest"
133+
}
121134
}
122135
}

0 commit comments

Comments
 (0)