大佬教程收集整理的这篇文章主要介绍了单元测试 – 包含routeChangeSuccess的AngularJS Test Controller,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是控制器的代码.
navListModule.controller('NavListCtrl',['$scope','NavList',function ($scope,NavList) { $scope.$on('$routeChangesuccess',function (event,routeData) { var stationId = routeData.params.stationId; if ((stationId !== null) && (stationId !== undefined)) { $scope.stationId = stationId; var navList = NavList; $scope.menuOptions = navList.getMenuOptions(stationId); } }); } ]);
这是我在单元测试中到目前为止所提出的.
'use Strict'; describe('unit tesTing navListModule',function () { var scope,ctrl,LOCATIOn; describe('test NavListCtrl',function () { beforeEach(module('shipApp.navListModule')); // mock NavListservice for tesTing purposes var mockNavListservice = { getMenuOptions: function (stationId) { // set default menu options var menuOptions = [ { name: "Alerts",pageURL: "alerts" },{ name: "Reports",pageURL: "reports" },{ name: "Run Close Outs",pageURL: "cloSEOuts" } ]; // add admin menu option if stationId set to Admin if (stationId.toUpperCase() == 'Admin'.toUpperCase()) { menuOptions.push( { name: "Admin",pageURL: "admin" } ); } return menuOptions; } }; beforeEach(inject(function ($rootScope,$controller,$LOCATIOn) { scope = $rootScope.$new(); ctrl = $controller('NavListCtrl',{ $scope: scope,NavList: mockNavListservice }); LOCATIOn = $LOCATIOn; })); it('should expect stationId to be undefined if stationId not defined in route parameters',function () { expect(scope.stationId).toBeUndefined(); }); it('should expect scope.$on not to be called if no change in route',function () { spyOn(scope,'$on'); expect(scope.$on).not.toHaveBeenCalled(); }); it('should expect scope.$on to be called on change in route','$on'); scope.$on('$routeChangesuccess',routeData) {}); expect(scope.$on).toHaveBeenCalled(); }); it('should expect stationId to be defined in route parameters if route is #/:stationId/path',inject(function ($routeParams) { LOCATIOn.path('/Admin/alerts'); var LOCATIOnElements = LOCATIOn.path().subString(LOCATIOn.path().indexOf('/') + 1).split('/'); var stationId = LOCATIOnElements[0]; $routeParams.stationId = stationId; expect($routeParams.stationId).toEqual('Admin'); })); it('should expect menuOptions array to be returned when getMenuOptions function is called',function () { var stationId = 'Admin'; var menuOptions = NavListCtrl.getMenuOptions(stationId); }); }); });
我只是在学习Angular,所以我不确定我是否正确地设置了测试.我是否应该创建测试以确保在$routeChangesuccess事件发生之前不会发生控制器逻辑?如果是这样,我该如何编写这样的测试?另外,测试getMenuOptions(最后一次测试)调用的正确方法是什么?请告诉我测试此控制器的正确方法.
提前致谢,
肖恩
在尝试了jvandemo的一些测试和一些帮助之后,我已经提出了控制器的单元测试以及底层服务.如果我做错了,请告诉我.
'use Strict'; describe('unit tesTing navListModule',function () { beforeEach(module('shipApp.navListModule')); /***** Controllers *****/ describe('test NavListCtrl',function () { var ctrl,scope,NavList,$httpBACkend,$LOCATIOn,$route,$routeParams; // mock the http BACkend for r@R_607_9981@ng beforeEach(module(function() { return function(_$httpBACkend_) { $httpBACkend = _$httpBACkend_; $httpBACkend.when('GET','views/alerts/alerts.html').respond('alerts'); $httpBACkend.when('GET','views/alerts/reports.html').respond('reports'); $httpBACkend.when('GET','views/alerts/cloSEOuts.html').respond('cloSEOuts'); $httpBACkend.when('GET','views/alerts/admin.html').respond('admin'); $httpBACkend.when('GET','views/shared/error.html').respond('not found'); }; })); // add $routeProvider mock beforeEach(module(function ($routeProvider) { $routeProvider.when('/:stationId/alerts',{ templateUrl : 'views/alerts/alerts.html',controller : 'AlertsCtrl' }); $routeProvider.when('/:stationId/reports',{ templateUrl : 'views/reports/reports.html',controller : 'ReportsCtrl' }); $routeProvider.when('/:stationId/cloSEOuts',{ templateUrl : 'views/cloSEOuts/cloSEOuts.html',controller : 'CloSEOutsCtrl' }); $routeProvider.when('/:stationId/admin',{ templateUrl : 'views/admin/admin.html',controller : 'AdminCtrl' }); $routeProvider.when('/@R_502_2480@',{ templateUrl : 'views/shared/error.html',controller : 'ErrorCtrl' }); $routeProvider.when('/',{ redirectTo : '/MasterPL/alerts' }); $routeProvider.when('/:stationId',{ redirectTo : '/:stationId/alerts' }); $routeProvider.when(':stationId',{ redirectTo : '/:stationId/alerts' }); $routeProvider.when('',{ redirectTo : '/MasterPL/alerts' }); $routeProvider.otherwise({ redirectTo: '/@R_502_2480@' }); })); beforeEach(inject(function ($rootScope,_$LOCATIOn_,_$route_,_$routeParams_) { // mock NavList service var mockNavListservice = { getMenuOptions: function (stationId) { // set default menu options var menuOptions = [ { name: "Alerts",pageURL: "alerts" },{ name: "Reports",pageURL: "reports" },{ name: "Run Close Outs",pageURL: "cloSEOuts" } ]; // add admin menu option if stationId set to Admin if (stationId.toUpperCase() == 'Admin'.toUpperCase()) { menuOptions.push( { name: "Admin",pageURL: "admin" } ); } return menuOptions; } }; NavList = mockNavListservice; scope = $rootScope.$new(); $LOCATIOn = _$LOCATIOn_; $route = _$route_; $routeParams = _$routeParams_; ctrl = $controller('NavListCtrl',$routeParams: $routeParams,NavList: NavList }); })); it('should expect stationId and menuOptions to be undefined if stationId not defined in route parameters',function () { expect(scope.stationId).toBeUndefined(); expect(scope.menuOptions).toBeUndefined(); }); it('should expect scope.$on not to be called if no change in route',routeData) {}); expect(scope.$on).toHaveBeenCalled(); }); it('should not parse $routeParameters before $routeChangesuccess',function () { $LOCATIOn.path('/Admin/alerts'); scope.$apply(); expect(scope.stationId).toBeUndefined(); }); it('should expect scope values to be set after $routeChangesuccess is fired for LOCATIOn /stationId/path',function () { $LOCATIOn.path('/Admin/alerts'); scope.$apply(); $httpBACkend.flush(); expect(scope.stationId).toEqual('Admin'); expect(scope.menuOptions).not.toBeUndefined(); }); it('should expect NavList.getMenuOptions() to have been called after $routeChangesuccess is fired for LOCATIOn /stationId/path',function () { spyOn(NavList,'getMenuOptions').andCallThrough(); $LOCATIOn.path('/Admin/alerts'); scope.$apply(); $httpBACkend.flush(); expect(NavList.getMenuOptions).toHaveBeenCalled(); expect(scope.menuOptions.length).not.toBe(0); }); }); /***** services *****/ describe('test NavList service',function () { var scope,NavList; beforeEach(inject(function ($rootScope,_NavList_) { scope = $rootScope.$new(); NavList = _NavList_; })); it('should expect menuOptions array to be returned when getMenuOptions function is called',function () { var stationId = 'Admin'; var menuOptions = NavList.getMenuOptions(stationId); expect(menuOptions.length).not.toBe(0); }); it('should expect admin menu option to be in menuOptions if stationId is Admin',function () { var stationId = 'Admin'; var menuOptions = NavList.getMenuOptions(stationId); var hasAdminOption = false; for (var i = 0; i < menuOptions.length; i++) { if (menuOptions[i].name.toUpperCase() == 'Admin'.toUpperCase()) { hasAdminOption = true; break; } } expect(hasAdminOption).toBe(true); }); it('should not expect admin menu option to be in menuOptions if stationId is not Admin',function () { var stationId = 'MasterPl'; var menuOptions = NavList.getMenuOptions(stationId); var hasAdminOption = false; for (var i = 0; i < menuOptions.length; i++) { if (menuOptions[i].name.toUpperCase() == 'Admin'.toUpperCase()) { hasAdminOption = true; break; } } expect(hasAdminOption).toBe(false); }); }); });
> $routeChangesuccess:您无需测试核心AngularJS功能.当您依赖$routeChangesuccess在某个时刻运行代码时,AngularJS团队及其测试套件负责确保$routeChangesuccess正常工作.
> getMenuOptions():由于此方法是您注入的服务的一部分,因此您可以创建一个单独的单元测试来测试NavList服务并将最后一个测试移动到该套件.由于您是单元测试,因此为每个组件(控制器,服务等)创建单独的测试套件是一种很好的做法,以保持组织良好和紧凑.
希望有所帮助!
以上是大佬教程为你收集整理的单元测试 – 包含routeChangeSuccess的AngularJS Test Controller全部内容,希望文章能够帮你解决单元测试 – 包含routeChangeSuccess的AngularJS Test Controller所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。