Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Injetando controllers, services e diretivas com Jasmine + Angular

Referente ao curso Jasmine: Testes automatizados em JavaScript

por Andrey M. Patrício
| 44.2k xp | 5 posts

Tenho a seguinte estrutura:

app.module.js

(function() {
    'use strict';
    angular.module('app', []);
})();

app.controller.js

(function() {
    'use strict';
    angular.module('app').controller('AppController', AppController);

    AppController.$inject = [];

    function AppController() {
        var vm = this;

        vm.objeto = [ {
            "id" : "00",
            "nome" : "Teste 01",
            "telefone" : "999990001",
            "cidade" : "Jambuti do Serrado"
        } ]        
    }
})();

teste.spec.js

describe('AppController', function() {

    var $controller, vm;

    beforeEach(module('app'));

    beforeEach(inject(function(_$controller_){
        $controller = _$controller_;
        vm = $controller('AppController');
    }));

    it('Teste qualquer', function () {
        expect(1).toBe(1);
    });
});

karma.conf.js

module.exports = function(config) {
  config.set({      
    basePath: '',    
    frameworks: ['jasmine'],  
    files: [
      'bower_components/jquery/dist/jquery.js',
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'tests/*.spec.js'
    ],  
    exclude: [
    ],  
    preprocessors: {
        '**/*.html': ['ng-html2js'],
        '**/*.js': ['sourcemap']
    },
    reporters: ['dots', 'junit'],
    junitReporter: {
        outputFile: 'test-results.xml'
    },
    ngHtml2JsPreprocessor: {
        stripPrefix: 'tests/'
    },
    port: 9876,
    colors: true,
    logLevel: config.INFO,
    autoWatch: true,
    browsers: ['PhantomJS'],
    singleRun: true
  })
}

Ao executar o teste, estou tendo o seguinte problema:

forEach@C:/Users/user.user/git/gitlab/bower_components/angular/angular.js:341:24 loadModules@C:/Users/user.user/git/gitlab/bower_components/angular/angular.js:4466:12 createInjector@C:/Users/user.user/git/gitlab/bower_components/angular/angular.js:4391:22 workFn@C:/Users/user.user/git/gitlab/bower_components/angular-mocks/angular-mocks.js:2513:60 C:/Users/user.user/git/gitlab/bower_components/angular/angular.js:4506:53 Caso eu não efetue o inject, não tenho problemas com a execução dos testes. Alguma luz? Obrigado desde já. :)

3 respostas
por Mario Souto
| 377.3k xp | 735 posts
Alura Scuba Team Instrutor e Desenvolvedor

Andrey, você precisa fazer sem o inject por algum motivo especifico?

Acredito que este link pode ti dar uma ajudinha também \o

https://docs.angularjs.org/api/ngMock/function/angular.mock.inject

por Andrey M. Patrício
| 44.2k xp | 5 posts

Opa Mário, tudo bom?

Alterando um pouco a estrutura do meu teste, deixei dessa maneira:

describe('App Controller Spec', function() {

    var controller, commons, labels, vm, scope, meuService;

    var modalInstance = {
            params: {
                objeto: {}
            },
        };


    beforeEach(module('app'));

    beforeEach(inject(function(_$controller_, _$rootScope_) {

        scope = _$rootScope_.$new();
        controller = _$controller_;

        vm = controller('MeuController', {
            $scope : scope,
            $commons : commons,
            $modalInstance : modalInstance,
            Labels : {},
            MeuService: meuService
        });
    }));

    it('Então o controller deve ser corretamente injetado', function() {});

});

O problema é que ele solicita que eu implemente todos os componentes utilizados no meu controller como no trecho onde faço "vm = ...". Tudo bem, até me deparar com problemas desse tipo:

        TypeError: 'undefined' is not an object (evaluating '$commons.$promiseTracker')
            at Controller (C:/Users/andrey.patricio/git/gitlab/src/modal-historico.controller.js:14)
            at invoke (C:/Users/andrey.patricio/git/gitlab/bower_components/angular/angular.js:4570)
            at instantiate (C:/Users/andrey.patricio/git/gitlab/bower_components/angular/angular.js:4578)
            at C:/Users/andrey.patricio/git/gitlab/bower_components/angular/angular.js:9460
            at C:/Users/andrey.patricio/git/gitlab/bower_components/angular-mocks/angular-mocks.js:1961
            at C:/Users/andrey.patricio/git/gitlab/tests/app.spec.js:24
            at invoke (C:/Users/andrey.patricio/git/gitlab/bower_components/angular/angular.js:4570)
            at workFn (C:/Users/andrey.patricio/git/gitlab/bower_components/angular-mocks/angular-mocks.js:2524)
        Error: Declaration Location
            at C:/Users/andrey.patricio/git/gitlab/bower_components/angular-mocks/angular-mocks.js:2493
            at C:/Users/andrey.patricio/git/gitlab/tests/app.spec.js:27
            at C:/Users/andrey.patricio/git/gitlab/tests/app.spec.js:35

Empaquei :(

solução!
por Andrey M. Patrício
| 44.2k xp | 5 posts

Para resolver o meu problema, eu simplesmente deveria mockar o construtor do meu controller.

beforeEach(inject(function(_$controller_, _$rootScope_) {
        scope = _$rootScope_.$new();
        controller = _$controller_;

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