Currently, I am conducting a test on an Angular directive using the spec provided below:
'use strict';
describe('playerInfo directive', function() {
var element;
var scope;
beforeEach(module('gameApp'));
beforeEach(module('templates'));
beforeEach(inject(function($rootScope, $compile) {
scope = $rootScope.$new();
element = '<player-info></player-info>';
element = $compile(element)(scope);
scope.digest();
}));
it('should replace the element with the appropriate content', function() {
expect(element.html()).toContain('Score:');
});
});
Here is my directive code:
'use strict';
angular.module('gameApp')
.directive('playerInfo', playerInfo);
function playerInfo() {
var directive = {
link: link,
restrict: 'E',
replace: true,
templateUrl: '/app/player/playerInfo.directive.html',
controller: 'PlayerInfoController',
controllerAs: 'playerInfo'
};
return directive;
function link(scope, element) {
var address = angular.element(element[0].getElementsByClassName('blur'));
address.on('click', function() {
address.css({'-webkit-filter': 'none'});
});
}
}
I keep encountering the error message
TypeError: 'undefined' is not an object (evaluating 'moment.utc')
.
UPDATE: It appears that the issue is not with my controller. The problem lies within my usage of the angular-moment directive twice in the HTML template of my directive:
<div>{{playerInfo.game.date | amDateFormat: 'MMMM Do, YYYY'}} - <b am-time-ago="playerInfo.game.date"></b></div>
This seems to be the cause of the error, but I am uncertain about how to resolve it. I have included both
src/assets/bower_components/moment/moment.js
and src/assets/bower_components/angular-moment/angular-moment.js
in the files
array of karma.config.js
.