Test Angular stuff without ngMock.
Micro testing library that allows you to practice TDD in AngularJs applications.
To install it, type:
$ npm install angular-test-runner --save-dev
angular-test-runner
has depedency on jasmine-jquery
and karma-jasmine-jquery
so it is required to add it as well.
// karma.conf.js
module.exports = function(config) {
config.set({
frameworks: ['jasmine-jquery', 'jasmine'],
plugins: ['karma-jasmine-jquery']
// ...
})
}
angular-test-runner was created as a replacement of "official" Angular testing library: ngMock. It was designed to address following shortcommings of ngMock:
$http.flush()
) and DOM interaction (need of $scope.$digest()
)Therefore angular-test-runner tries to address those issues by:
$http.flush()
) and asynchronous on demand,Following example presents tests for simple counter component.
var test = require('angular-test-runner');
var { click, expectElement } = test.actions;
describe('counter component', () => {
var app, server, html;
beforeEach(() => {
app = test.app(['counterApp']);
server = test.http();
});
beforeEach(() => {
html = app.runHtml('<counter value="start"></counter>', {start: 0});
});
it('should render counter value', () => {
html.verify(
expectElement('#counter').toHaveText('0')
);
});
it('should increment counter value by 1', () => {
html.perform(
click.in('button#increment')
);
html.verify(
expectElement('#counter').toHaveText('1')
);
});
it('should increment counter value by 1', () => {
var jsonSentToServer;
server.post('/counter/increment', (req) => {
jsonSentToServer = req.body();
req.sendStatus(200);
});
html.perform(
click.in('button#increment')
);
html.verify(
() => expect(jsonSentToServer).toEqual({ counter: 1 })
);
});
});
Below you can compare angular-test-runner style of testing to traditional ngMock way. Following example was taken from Official Angular Developers Guide:
See more examples
While Protractor is focused on end-to-end testing Angular application as a whole (from a browser perspective), angular-test-runner focuses on testing coherent parts of application by excerising selected components in isolation.
Unlike Protractor in angular-test-runner you don't have to start your backend server nor host your html files on localhost so it is accessible to Selenium. Therefore test runner setup and configuration is much more simple.
Moreover you are not forced to test entire pages at once, but you can exercise only a tiny fragments of your html (e.g. single directive, component or filter a.k.a. pipe).