I'm currently facing an issue with my unit test using ES6, AngularJS, Karma/Jasmine, and angular-translate. It seems that I'm unable to get my unit test to pass. I'm not very familiar with how to handle 3rd party modules, such as angular-translate, during unit testing. Below is the code snippet along with the error message I'm encountering. The issue seems to be with the $translateProvider not loading properly.
import CatalogueModule from './catalogue.module'
import CatalogueService from './catalogue.service'
let service,
_$translateProvider;
describe('CatalogueService', () => {
beforeEach(angular.mock.module(CatalogueModule));
beforeEach(() => {
angular.mock.module({
$translateProvider: jasmine.createSpyObj('$translateProvider',
['translations', 'preferredLanguage']
),
$translate: jasmine.createSpyObj('$translate',
['use']
)
});
})
beforeEach(inject(($translateProvider) => {
_$translateProvider = $translateProvider;
_$translateProvider.translations('en', {});
_$translateProvider.preferredLanguage('en');
// service = new CatalogueService();
}));
it('should set the config object after initialization', inject(($translateProvider, CatalogueService) => {
// $translateProvider.use.and.returnValue();
// expect(service.config.headers).to.equal(null);
}));
});
This is the error message I'm seeing:
✖ "before each" hook: WorkFn for "should set the config object after initialization"
Chrome 59.0.3071 (Mac OS X 10.12.3)
Error: [$injector:unpr] Unknown provider: $translateProviderProvider <- $translateProvider
UPDATE - including catalogue.service.js
class CatalogueService {
constructor($http, $q, $translate) {
'ngInject';
this._$http = $http;
this._$q = $q;
this._$translate = $translate;
this.config = {
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'Accept': '******',
'P3-APP-ID': '*****',
'P3-Date': '*****'
}
};
this.catalogue = this.getCatalogue();
}
getCatalogue() {
const lang = this._$translate.use();
const url = `https://somedomain.com/catalog?language_code=${lang}`;
const deferred = this._$q.defer();
this._$http
.get(url, this.config)
.then(
(res) => deferred.resolve(res.data.characters),
(err) => deferred.reject(err)
);
return deferred.promise;
};
getCharacterByCharId(charId) {
return this.catalogue
.then((res) => {
return res.find((character) => {
return character.link_name === charId;
});
});
};
}
export default CatalogueService;