Prueba de unidad de una directiva que usa clientHeight - angularjs, unit-testing, angularjs-directiva

Tengo una directiva que vigila al cliente.de un elemento con altura dinámica y establece una variable de alcance para ese valor, pero no puedo averiguar cómo realizar una prueba unitaria. Todo lo que he hecho en las pruebas unitarias, clientHeight siempre devuelve 0. He intentado una varias soluciones diferentes que he leído para problemas similares aquí, pero ninguna de ellas funciona.

Aquí está la directiva:

return {
link: function (scope, element, attrs) {
scope.$watch(function () { return element[0].clientHeight; },
function(newValue, oldValue) {
if (newValue !== oldValue) {
scope.$parent.headerHeight = newValue;
}
}, true);
}
};

Respuestas

Las dimensiones del elemento DOM separado son 0. El elemento debe agregarse a DOM antes de que sus dimensiones se midan y se desgarren al final de la prueba:

element = $compile("<directive>")(scope);
angular.element(document.body).append(element);
scope.$digest();
...
element.remove();

Para realizar una prueba eficiente, aparte de DOM (que es el dominio de las pruebas e2e, no las pruebas unitarias), la función de vigilancia anónima debe estar expuesta al alcance

scope._getHeight = function () { return element[0].clientHeight; };
scope.$watch("_getHeight()", ...);

y se burló, porque se prueba la lógica directiva, no el motor de representación del navegador:

element = $compile("<directive>")(scope);
spyOn(scope, "_getHeight").and.returnValue(100);
scope.$digest();
...