Unit Testing your React / Redux app (@BucharestJS)
0 likes273 views
The document discusses various JavaScript testing frameworks and utilities including Jest, Mocha, Chai, and Sinon.js, emphasizing their uses in unit testing for React applications. It suggests a preferred combination of Enzyme and Mocha with Chai for optimal testing practices and highlights the importance of writing tests before production code. Additional resources and tools for testing, mocking, and code coverage are also provided.
![Mocha is a JavaScript test framework
running on Node.js and in the browser.
var assert = require('assert');
describe('Array', function() {
describe('#indexOf()', function() {
it('should return -1 when the value is not present', function() {
assert.equal(-1, [1,2,3].indexOf(4));
});
});
});](https://image.slidesharecdn.com/unit-testing-react-redux-at-bucharestjs-180201082954/85/Unit-Testing-your-React-Redux-app-BucharestJS-10-320.jpg)
Unit Testing your React / Redux app (@BucharestJS)
- 8. Jest: Capture snapshots of React trees or other serializable values to simplify testing and to analyze how state changes over time. describe('Welcome (Snapshot)', () => { it('Welcome renders hello world', () => { const json = renderer.create(<Welcome />).toJSON(); expect(json).toMatchSnapshot(); }); });
- 10. Mocha is a JavaScript test framework running on Node.js and in the browser. var assert = require('assert'); describe('Array', function() { describe('#indexOf()', function() { it('should return -1 when the value is not present', function() { assert.equal(-1, [1,2,3].indexOf(4)); }); }); });
- 12. Sinon.js spies, stubs and mocks for JavaScript. Works with any unit testing framework. it('makes a GET request for todo items', function () { sinon.stub(jQuery, 'ajax'); getTodos(42, callbackFunction); assert(jQuery.ajax.calledWithMatch({ url: '/todo/42/items' })); });
- 16. To recap... ● I wouldn’t recommend Jest ● I’d rather use: Enzyme + Mocha + Chai + Sinon ● Try to test the ES6 classes rather than the React components