ฉันมีคำสั่งที่จะลบองค์ประกอบ dom เมื่อตรวจสอบสิทธิ์บางอย่าง:
angular.module('app').directive('permissionNeeded', function ($location, $route, SecurityService) {
return {
restrict: 'A',
link: function (scope, element, attributes) {
var permissionNeeded = attributes.permissionNeeded;
if (permissionNeeded) {
if (SecurityService.checkAccess($route.current.name) !== permissionNeeded) {
element.remove();
}
}
}
};
});
Directive ทำงานได้ดี แต่ฉันไม่สามารถทดสอบได้ ดูเหมือนว่าการจัดการ DOM (element.remove()) จะถูกกระตุ้นหลังจากการยืนยันความคาดหวังของฉัน:
it('should not do anything cos permissions are correct', function () {
$route.current = {
name: 'import'
}
var element = compileTemplate('<span permission-needed="W">Some content goes here</span>');
$rootScope.$digest();
expect(element.html()).toBe(''); // FAIL!!! it's still equals to 'Some Content goes here'
});
ฉันเคยเห็นคำตอบบางอย่างเกี่ยวกับ SO เกี่ยวกับการใช้ฟังก์ชัน $timeout เพื่อชะลอการยืนยันความคาดหวัง แต่สิ่งที่ฉันได้ลองแล้วการยืนยันล้มเหลว (element.html() ยังคงเท่ากับ 'เนื้อหาบางส่วนไปที่นี่')
อย่างไรก็ตาม สิ่งที่ตลก (ใช่ไหม) คือถ้าฉันเปลี่ยน dom แทนที่จะลบมันออกในคำสั่งของฉัน การทดสอบของฉันก็โอเค :
angular.module('app').directive('permissionNeeded', function ($location, $route, SecurityService) {
return {
restrict: 'A',
link: function (scope, element, attributes) {
var permissionNeeded = attributes.permissionNeeded;
if (permissionNeeded) {
if (SecurityService.checkAccess($route.current.name) !== permissionNeeded) {
element.html('');
}
}
}
};
});
โดยใช้คำสั่งข้างต้น การทดสอบกำลังผ่านไป
ฉันถูกต้องไหมเมื่อฉันเดาว่าการเรนเดอร์ dom ยังไม่สิ้นสุดเมื่อฉันยืนยัน หากเป็นเช่นนั้น ฉันจะทำอย่างไรเพื่อชะลอการยืนยันหลังจากการแสดงผล DOM
ขอบคุณ
มาติเยอ.