Test for directive watch fails; only fired first time - angularjs

Question

I am attempting to pass a test for my angularjs directive using jasmine.
My directive simply takes what is passed into the attribute (as a one way binding) and replaces the elements text with that value. My directive also watches for changes in the value and updates the elements text accordingly:
return {
restrict: 'A',
scope: {
test: '&'
},
link: function (scope, element, attrs) {
element.text(scope.test());
scope.$watch('test', function (value) {
console.log('WATCH FIRED!');
element.text(scope.test());
});
}
};
My jasmine test attempts to set the value passed into the directive, then change it, and then checks to see if the elements text is different after changing the value:
it('should update when the model updates', function () {
$scope.model = 'hello';
$scope.$digest();
var before = element.text();
$scope.model = 'world';
$scope.$digest();
expect(element.text()).not.toEqual(before);
});
But the test fails everytime. In fact, the elements text is always 'hello' and never gets changed to 'world'.
Plunker: http://plnkr.co/edit/UeUGE88LuQRgeo7I412p?p=preview

Answer 1

This is beacuse you are using one way binding in your directive (&) so changes to the model are not tracked. Try using two way binding = and it should work as expected.
The & binding allows a directive to trigger evaluation of an expression in the context of the original scope, at a specific time. Any legal expression is allowed, including an expression which contains a function call. Because of this, & bindings are ideal for binding callback functions to directive behaviors.
...
return {
restrict: 'A',
scope: {
test: '='
},
link: function (scope, element, attrs) {
element.text(scope.text);
scope.$watch('test', function (value) {
console.log('WATCH FIRED!');
element.text(scope.test);
});
}
};
Plnkr
Or you would need to do:-
scope.$watch(function(){
return scope.test();
}, function (value) {
console.log('WATCH FIRED!');
element.text(scope.test);
});