I am having some trouble unit testing the watch method of my directive. The directive requires the its own direcitive so ctrl houses one main method updateHeight
In my controller I have one method
this.updateHeight = function (clientHeight) {
$rootScope.haGlobalAlerts.clientHeight = clientHeight;
};
Inside of my link function I am calling this
ctrl.updateHeight(el.clientHeight);
I have a $watch method that looks for changes
$scope.$watch(function () {
return el.clientHeight;
},
function (newHeight, oldHeight) {
if (first || (newHeight !== oldHeight)) {
first = false;
ctrl.updateHeight(newHeight);
}
});
Identifying how to test and mock a change is really confusing me. In my directive I created scope like so ....
html = angular.element("<div global alerts> </div>")
element = $compile(html)($rootScope);
$rootScope = $rootScope.$new()
// added this to get update height
controller = element.controller('GlobalAlerts')
//setting controller gives me access to controller.updateHeight().
scope = element.scope();
scope does not have access to this. I am not sure how to make a call to it.
If I call
controller.updateHeight() //It is not changing the value.
In my test I have $apply called on the scope
scope.$apply()
Here is my complete test
it("should update client Height", function () {
expect(element[0].clientHeight).to.equal(0);
var newHeight = 20;
controller.updateHeight(newHeight);
scope.$apply();
expect(element[0].clientHeight).to.equal(20);
});
Aucun commentaire:
Enregistrer un commentaire