如何在控制器中测试功能？

Question

我想在我的vendor.controller中测试一个名为getTodaysHours的函数。

vendor.controller.js

export class VendorController {
constructor($rootScope, data, event, toastr, moment, _, distanceService, vendorDataService, userDataService, stateManagerService) {
    'ngInject';
    //deps
    this.$rootScope = $rootScope;
    this.toastr = toastr;
    this._ = _;
    this.userDataService = userDataService;
    this.vendorDataService = vendorDataService;
    this.stateManagerService = stateManagerService;
    this.event = event;

    //bootstrap
    data.isDeepLink = true;
    this.data = data;
    this.data.last_update = moment(this.data.updated_at).format('MM/DD/YY h:mm A');
    this.data.distance = distanceService.getDistance(this.data.loc.lng, this.data.loc.lat);
    this.data.todaysHours = this.getTodaysHours();
    this.data.rating_num = Math.floor(data.rating);


    this.hasReviewed = (userDataService.user.reviewed[data._id]) ? true : false;
    this.isGrid = false;
    this.isSearching = false;
    this.hideIntro = true;
    this.menuCollapsed = true;
    this.filterMenuCollapsed = true;

    this.selectedCategory = 'All';
    this.todaysHours = '';
    this.type = '';
    this.searchString = '';

    this.reviewScore = 0;

    this.today = new Date().getDay();

    this.vendorDataService.currentVendor = data;


//get todays hours
getTodaysHours() {
    let today = this.data.hours[new Date().getDay()];
    today.opening_time = today.substring(0,6);
    today.closing_time = today.substring(10,15);


    return (today.opening_time || '9:00am') + ' - ' + (today.closing_time || '5:00pm');
}

vendorData.service.js

export class VendorDataService {
constructor($rootScope, $resource, $q, $state, $stateParams, constant, userDataService, event, localStorageService, searchFilterService) {
    'ngInject';

    //deps
    this.$resource = $resource;
    this.$rootScope = $rootScope;
    this.$q = $q;
    this.$state = $state;
    this.$stateParams = $stateParams;
    this.searchFilterService = searchFilterService;
    this.localStorageService = localStorageService;
    this.userDataService = userDataService;
    this.constant = constant;
    this.event = event;

    //ng resource
    this.vendorResource = this.$resource('api/vendor/:vendor');
    this.vendorReviewResource = $resource('api/vendor/:id', null, {review: {method: 'PATCH'}});
    this.menuResource = this.$resource('api/vendor/menu/:id');
    this.vendorCoordinate = localStorageService.get(constant.storageKey.vendorCoordinate);

    //store current vendor
    this.currentVendor = {
        hours:[
            '10:00AM - 5:00PM',
            '9:00AM - 5:00PM',
            '9:00AM - 5:00PM',
            '9:00AM - 5:00PM',
            '9:00AM - 5:00PM',
            '9:00AM - 5:00PM',
            '10:00AM - 5:00PM'
        ]
    };

}

}

我的规格看起来像这样：

describe('vendor controller', () => {
    let vm;

    beforeEach(angular.mock.module('thcmaps-ui'));
    beforeEach(inject(($controller, vendorDataService) => {
        vm = $controller('VendorController');

    }));

    it('should state store hours for today', () => {
        expect(vm.getTodaysHours).toEqual('9:00AM - 5:00PM');
    });
});

并且出现以下错误：

错误：[$ injector：unpr]未知提供程序：dataProvider <-数据<-VendorController

TypeError：未定义不是/Users/adminuser/Documents/workspace/thcmaps-ui/.tmp/serve/app/index.module.js（第9行）中的对象（评估“ vm.getTodaysHours”）

1. 我不确定是什么导致了第一个错误。
2. 我应该在此附加getTodaysHours函数吗？ 正确的做法是什么？

Answer 1

似乎很明显，Angular找不到您的data提供者。 考虑到它是一个协作者 ，无论如何您应该提供一个模拟/间谍实现。

let vm, data;

beforeEach(() => {
    data = {
        _id: 1,
        updated_at: 'now',
        loc: {
            lng: 123,
            lat: 456
        },
        rating: 1.2
    };

    module('thcmaps-ui');
    inject($controller => {
        vm = $controller('VendorController', {
            data: data
        });
    });
});

---

关于您另一个问题， getTodaysHours()根本不是您的控制器的方法； 您已经在构造函数中定义了它。 将其移至班级正文，即

class VendorController {
    constructor(...) {
        // ...
    }

    getTodaysHours() {
        // ...
    }
}