jeudi 27 août 2015

Angular Js: Unit testing for dummies

THE SITUATION:

I am trying to set up the unit testing for my angular app. I have read several material and arrived to a good point where i can see this:

enter image description here

But still i don't see how can can i see the outcome of the actual tests.

THE STEPS:

  1. Create a new blank angular app
  2. Install karma :

    sudo npm install karma --save-dev

  3. Install plugins:

    sudo npm install karma-junit-reporter karma-chrome-launcher karma-firefox-launcher karma-jasmine --save-dev

  4. Install angular-mocks and inject ngMock

  5. karma init (in the questions choose Chrome and Firefox as browser)
  6. karma start (it opens the browser with the green bar as in the image above)

THE CODE:

The controller:

.controller('MainCtrl', function($scope) {

   $scope.greeting = 'hello world!';

 });

In a separate js file i put a basic test:

describe('Hello world test', function() {

beforeEach(module('unittestapp'));

var MainCtrl,
scope;

beforeEach(inject(function ($rootScope, $controller) 
{
    scope = $rootScope.$new();

    MainCtrl = $controller('MainCtrl', 
    {
        $scope: scope
    });
}));

it('says hello world!', function () 
{
    expect(scope.greeting).toEqual('hello world!');
});

});

THE QUESTION:

What is the next step? How can i see the outcome of the actual test?

ANGULAR-MOCKS ISSUE:

In the browser the app crash if there is angular-mocks installed. Giving the following two errors:

ReferenceError: describe is not defined

Error: Unexpected request: GET templates/homepage.html
No more request expected

If I remove ngMock then the app works fine, even though it keeps giving the following error:

ReferenceError: describe is not defined

Aucun commentaire:

Enregistrer un commentaire