AngularJS 2.0 - Cách kiểm tra ứng dụng?

Question

Tôi đang xây dựng một ứng dụng AngularJS (sử dụng ES6) mà càng nhiều AngularJS 2.0 càng tốt, vì vậy tôi sẽ không có nhiều công việc với việc di chuyển.

Như bạn đã biết sẽ không có bộ điều khiển như chúng ta biết chúng trong < = v1.4

Ví dụ mã của một trong những chỉ thị của tôi

class LoginSidebar { 

    constructor() { 

    } 

    someMethod(){ 
    } 
} 

LoginSidebar.$inject = []; 

export default function() { 
    return { 
     scope: {}, 
     templateUrl: 'tpl/path/to/loginSidebar.tpl.html', 
     replace: true, 
     controller: LoginSidebar, 
     controllerAs: 'loginSidebarCtrl' 
    }; 
}; 

Đây là những gì app.js của tôi trông giống như

import loginSidebar from "./js/component/loginSidebar/LoginSidebar.js"; 

angular.module('myModule', [ 
    'ngNewRouter', 
    'ngAnimate' 
]) 

    .directive("loginSidebar", loginSidebar); 

Như bạn có thể thấy tôi không có .controller() ở đó, vậy tôi phải thử nghiệm các phương thức trong lớp như thế nào?

PS. Tôi đã thử sử dụng Karma-Jasmine, nhưng tôi phải kiểm tra toàn bộ chỉ thị và nếu tôi làm như vậy, tôi nhận được lỗi tôi đã viết ở đây: AngularJS & Karma-Jasmine - How to ignore templateUrl to avoid "Unexpected request: GET .../.html"

Answer 1

Bạn có thể xác định bộ điều khiển với tên chung và sau đó tham chiếu nó theo chỉ thị :

//LoginSidebarController.js 
class LoginSidebarController { 
    // controller code here 
} 

export default LoginSidebarController 

//LoginSidebarDirective.js 
export default function() { 
    return { 
     scope: {}, 
     templateUrl: 'tpl/path/to/loginSidebar.tpl.html', 
     replace: true, 
     controller: 'LoginSidebarController', 
     controllerAs: 'loginSidebarCtrl' 
    }; 
}; 

//app.js 
import loginSidebarDirective from "./js/component/loginSidebar/LoginSidebarDirective.js"; 
import LoginSidebarController from "./js/component/loginSidebar/LoginSidebarController.js"; 

angular.module('myModule', []) 
    .directive('loginSidebar', loginSidebarDirective) 
    .controller('LoginSidebarController', LoginSidebarController) 

Sau đó, bạn có thể yêu cầu bộ điều khiển làm bộ điều khiển thông thường khác để kiểm tra độc lập với chỉ thị.

Là cách thứ hai bạn có thể truy cập bộ điều khiển thông qua phương thức angular.element().controller('loginSidebar'). Một cái gì đó như thế này:

var testElm = angular.element('<login-sidebar />'); 
$compile(testElm); 
testElm.controller('loginSidebar')