Directiva AngularJS probando un elm.on () vinculante
-
21-12-2019 - |
Pregunta
Im Obtención de errores en mis pruebas de unidad con la siguiente directiva:
.directive('flashMessage', function() {
return {
restrict: "E",
replace: true,
template: "<div class='alert alert-{{flash.alert}}'>{{flash.msg}}</div>",
scope: {
flash: "="
},
link: function(scope, elem, attrs)
{
elem.on('click', function() {
elem.hide('slow');
});
scope.$watch('flash', function() {
if (scope.flash) {
elem.slideDown('slow');
} else {
elem.hide();
}
});
}
};
})
La prueba de la unidad:
describe('Flash Messenger', function()
{
var elm, html, scope;
beforeEach(module('common.directives'));
beforeEach(inject(['$compile', '$rootScope', function($c, $r) {
$compile = $c;
$rootScope = $r.$new();
elm = angular.element('<flash-message flash="flash"></flash-message>');
console.log('BEFORE', elm);
$compile(elm)($rootScope);
$rootScope.$digest();
}]));
// tests start here
it('should have an alert of success', function()
{
$rootScope.flash = {"alert":"success", "msg":"Success"};
$rootScope.$digest();
});
});
El resultado:
LOG: 'BEFORE', Object{0: <flash-message flash="flash"></flash-message>, length: 1}
Chrome 34.0.1847 (Windows 8) Flash Messenger should have an alert of success FAILED
TypeError: undefined is not a function
at link (E:/Repos/sandown/Source/Dev/site/js/directives.js?80b1c100e6d9acbd3c73fe2379761915ab1e05c0:9:18839)
at k (E:/Repos/sandown/Source/Dev/site/client-src/angular-1.1.5/angular.min.js?8e113b67065c1c7245ea2e7aa89ea86860f32a85:44:444)
at e (E:/Repos/sandown/Source/Dev/site/client-src/angular-1.1.5/angular.min.js?8e113b67065c1c7245ea2e7aa89ea86860f32a85:40:139)
at E:/Repos/sandown/Source/Dev/site/client-src/angular-1.1.5/angular.min.js?8e113b67065c1c7245ea2e7aa89ea86860f32a85:39:205
at null.<anonymous> (E:/Repos/sandown/Source/Dev/site/tests/unit/directives.test.js:12:16)
at Object.d [as invoke] (E:/Repos/sandown/Source/Dev/site/client-src/angular-1.1.5/angular.min.js?8e113b67065c1c7245ea2e7aa89ea86860f32a85:28:304)
at workFn (E:/Repos/sandown/Source/Dev/site/tests/lib/angular/angular-mocks.js:1876:20)
Error: Declaration Location
at window.inject.angular.mock.inject (E:/Repos/sandown/Source/Dev/site/tests/lib/angular/angular-mocks.js:1862:25)
at null.<anonymous> (E:/Repos/sandown/Source/Dev/site/tests/unit/directives.test.js:7:13)
at E:/Repos/sandown/Source/Dev/site/tests/unit/directives.test.js:1:1
De lo que puedo ver es que el olmo no tiene la función .on o la función .slidownown.¿Cómo voy a probar esto?
Solución
El problema es que el orden de los archivos cargados en el archivo karma.conf.js fue el problema.Lo cambié para que Jquery esté cargado primero y el problema ahora se resuelve :)
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow