Mocha JS
a non-expert intro to a JS test framework
Mocha by Angelo Gulina
Me
Angelo Gulina
Frontend for CAP
Mocha by Angelo Gulina
Covering
what if? and why? and what? and how to?
describe(), it(), assert(), expect()
dont try this at home
Mocha by Angelo Gulina
What if?
what happens if you remove a method declaration but
you dont remove the method call(s)?
Mocha by Angelo Gulina
Mocha by Angelo Gulina
Why me?
Mocha by Angelo Gulina
SPREAD
THE
Mocha by Angelo Gulina
Go to those guys
Eduard Mathias
Mocha by Angelo Gulina
Why?
vs Jasmine
Mocha: no built-in assertion library
Jasmine: has spies for mocking
both: similar API, similar async
vs Jest
Jest: recommended by FB Devs, uses Jasmine, React native
Mocha: more popular, simple API, faster, flexible
Mocha by Angelo Gulina
Why?
Make the code more resilient and less error-prone
Split large files without breaking functionality
Make dependencies explicit
Test Backbone Views
Mocha by Angelo Gulina
What?
A JavaScript Test Framework
Runs in browser and Node.js
Easy to integrate in (our) CI
actually runs manually and in pre-commit hooks
Mocha by Angelo Gulina
What?
Mocha Docs and Instructions
https://mochajs.org/
Useful
https://www.sitepoint.com/unit-test-javascript-mocha-chai/
Mocha by Angelo Gulina
How to?
install
$ npm install --save-dev mocha
run
$ ./node_modules/.bin/mocha
Mocha by Angelo Gulina
How to?
on package.json
scripts: {
test: ./node_modules/.bin/mocha
}
run
$ npm test
Mocha by Angelo Gulina
How to?
mocha setup
scripts: {
test: ./node_modules/.bin/mocha require ./mochaSetup.js
}
By default, mocha looks for the glob ./test/*.js and ./test/*.coffee
scripts: {
test: ./node_modules/.bin/mocha ./dir require ./mochaSetup.js
}
Mocha by Angelo Gulina
()
Tests
as a serie of
assertions and/or expectations you have
on how your code should work.
Mocha by Angelo Gulina
()
so
it().should.work()
actually
it().should.fail()
then
it().should.work()
Mocha by Angelo Gulina
describe( )
One at the beginning of the Test Suite,
another at the beginning of the behaviour youre going to test.
describe(Mocha setup Tests, function () {
describe(When I run the tests, function () {
});
});
Mocha by Angelo Gulina
it( )
Use it t separate tests regarding specific behaviour of your code.
describe(Mocha setup Tests, function () {
describe(When I run the tests, function () {
it(should return something, function () {
});
});
});
Mocha by Angelo Gulina
only( )
Use it for testing and debugging.
Will run the specified case.
describe(Mocha setup Tests, function () {
describe(When I run the tests, function () {
it.only(should return something, function () {
});
});
});
Mocha by Angelo Gulina
assert( )
Use it to actually test (and print out the result of) your code.
describe(Mocha setup Tests, function () {
describe(When I run the tests, function () {
it(should return something, function () {
assert.equal(something, myMethod());
});
});
});
Mocha by Angelo Gulina
beforeEach( )
Runs before each it()
describe(Mocha setup Tests, function () {
beforeEach(function () {
});
});
Mocha by Angelo Gulina
jsdom
Use it to create a DOM on your Node.js environment
$ npm install --save-dev jsdom
https://github.com/tmpvar/jsdom
Mocha by Angelo Gulina
UI Testing
Instead of taking in some arguments and returning a
value, your function will take in some arguments and
return an object representation of your UI.
Always try to think in terms of pure functions,
something goes in, something gets out.
Even if its UI.
Mocha by Angelo Gulina
()
Some
Chai and sinon examples.
https://gist.github.com/mkretschek/902344f1136d3aa7fe40de9348be0e14
Mocha by Angelo Gulina
chai.use( )
// assertions for stubs and spies
chai.use(sinonChai);
// assertions for promises
chai.use(chaiAsPromised);
// assertions for strings
chai.use(chaiString);
// assertions for arrays and objects
chai.use(chaiThings);
Mocha by Angelo Gulina
expect( )
chai provides several readable assertions for simple use cases
expect(isValidEmail(
[email protected])).to.be.true;
expect(isValidEmail('
[email protected]')).to.be.true;
});
Mocha by Angelo Gulina
expect( )
Async tests with promises: the test case can just return a promise.
// Mocha will wait until it's resolved before running
the next test.
it('fetches data from the given base URL', function () {
return getData().then(() => {
expect(fetch).to.have.been.calledWith( );
});
});
Mocha by Angelo Gulina
expect( )
chai-as-promised provides useful assertions for testing promises.
it('returns the retrieved data if no normalisation
function is given', function () {
const send = api.sendData('PUT', /foo');
return expect(send()).to.eventually.equal( );
});
Mocha by Angelo Gulina
expect( )
chai-string helps checking string values
it('strips trailing slashes from the URL', function () {
expect(api.baseUrl).to.not.endWith('/');
});
Mocha by Angelo Gulina
expect( )
chai-things helps checking the content of arrays and objects
it('normalises attributes in the list', function () {
const list = normalizeAttributeList([ ...items ]);
expect(list).to.have.length(2)
.and.all.to.have.property('type')
.and.all.to.have.property('title')
.and.all.to.have.property('property')
.and.all.to.have.property('shortName');
});
Mocha by Angelo Gulina
expect( )
sinon allows you to stub/spy functions and take direct control over their return values
it('returns a rejected promise if the API returns an
error', function () {
window.fetch.returns(Promise.reject( ));
return sender().catch(function () {});
});
Mocha by Angelo Gulina
()
Some
Chai and sinon examples.
https://gist.github.com/mkretschek/902344f1136d3aa7fe40de9348be0e14
Mocha by Angelo Gulina
DO
NOT
TRY
THIS
AT
HOME
Mocha by Angelo Gulina
Useful
Mocha Docs and Instructions
https://mochajs.org/
for PM
https://medium.com/javascript-scene/the-outrageous-cost-
of-skipping-tdd-code-reviews-57887064c412#.l0g4dhm9a
for Dev
https://medium.com/javascript-scene/5-common-
misconceptions-about-tdd-unit-
tests-863d5beb3ce9#.twcvovgic
Mocha by Angelo Gulina
The End
Mocha by Angelo Gulina
