我如何像这样为$ cookieStore编写测试？

Question

我有2个角色：一个是admin，另一个是普通用户。 管理员可以导航到项目详细信息页面，而普通用户则不能。 因此，我将用户登录时的角色存储在“全局” cookie中。 我从cookieStore获得他们的角色，以检查哪个可以导航到item-detail页面。 此功能运行良好。 但是，我不知道如何在checkUserRole函数中为$ cookieStore编写测试：

angular.module('config', ['ui.router'])
.config(function($stateProvider, $urlRouterProvider) 
{
    $urlRouterProvider.otherwise('/login');
    $stateProvider
    .state('login', 
    {
        url: '/login',
        templateUrl: 'login-page.html',
        controller: 'LoginController'
    })
    .state('index',
    {
        url: '/index',
        templateUrl: 'bridge.html'
    })
    .state('item-detail',
    {
        url: '/index/item-detail/:Name',
        templateUrl: 'item-detail.html',
        controller: 'myCtrl',
        resolve:
        {
            checkUserRole: function($cookieStore)
            {
                if($cookieStore.get('globals').currentUser.userRole === 'user')
                {
                    return state.go('index');
                }
            }
        }
    });
});

而且，这是我的测试用例：

describe('config', function()
{
    var $scope, $state, $cookieStore, userRole;
    beforeEach(function()
    {
        module('config', function($provide)
        {
            $provide.value('$cookieStore', { get: 'globals' });
        });
        inject(function($injector, $templateCache)
        {
            $scope = $injector.get('$rootScope');
            $state = $injector.get('$state');
            $cookieStore = $injector.get('$cookieStore');
            $templateCache.put('login-page.html', '');
            $templateCache.put('bridge.html', '');
            $templateCache.put('item-detail.html', '');
        });
    });
    it('home page', function()
    {
        $scope.$apply();
        expect($state.current.name).toBe('login');
        expect($state.current.templateUrl).toBe('login-page.html');
        expect($state.current.controller).toBe('LoginController');
    });
    it('login page', function()
    {
        $scope.$apply(function()
        {
            $state.go('login');         
        });
        expect($state.current.name).toBe('login');
        expect($state.current.templateUrl).toBe('login-page.html');
        expect($state.current.controller).toBe('LoginController');
    });
    it('items page', function()
    {
        $scope.$apply(function()
        {
            $state.go('index');         
        });
        expect($state.current.name).toBe('index');
        expect($state.current.templateUrl).toBe('bridge.html');
    });
    it('item-detail page', function()
    {
        spyOn($cookieStore, 'get').and.callFake(function()
        {
            return 'user';
        });
        expect($cookieStore.get('globals')).toBe('user');
        $scope.$apply(function()
        {
            $state.go('item-detail');
        });
        expect($state.current.name).toBe('item-detail');
        expect($state.current.templateUrl).toBe('item-detail.html');
        expect($state.current.controller).toBe('myCtrl');
        expect($state.href('item-detail', { Name: 'lumia-950'})).toEqual('#/index/item-detail/lumia-950');
    });
});

我的问题是：如何为$cookieStore.get('globals').currentUser.userRole编写测试？ 或者我该如何模拟它来测试用户的角色是用户呢？

Answer 1

我不知道您使用的是什么版本的angular，但现在不建议使用$cookieStore ，而是改用$cookies （ 请参阅doc ）。

至少有3种方式进行：

将Jasmine与Angular $cookie （来自v1.4.x）：

describe('config module', function(){
    var $cookies;

    beforeEach(function(){
        angular.mock.module('config');
        angular.mock.inject(function(_$cookies_){
            $cookies  = _$cookies_;
        });
    });

    it('should have a "globals" cookie with "user" value', function(){
        var globals = $cookies.getObject('globals');

        expect(globals.currentUser.userRole).toBe('user');
    });
});

将Jasmine与纯JavaScript结合使用 ：

describe('config module', function(){
    it('should have a "globals" cookie with "user" value', function(){
        var globals = document.cookie.replace(/(?:(?:^|.*;\s*)globals\s*\=\s*([^;]*).*$)|^.*$/, "$1");
        globals = JSON.parse(globals);

        expect(globals.currentUser.userRole).toBe('user');
    });
});

将Jasmine与量角器配合使用（e2e测试）：

describe('config module', function(){
    it('should have a "globals" cookie with "user" value', function(){
        var globals = JSON.parse(browser.manage().getCookie('globals'));
        expect(globals.currentUser.userRole).toBe('user');
    });
});

在这里，量角器为我们提供了browser全局变量，以处理与浏览器相关的行为。

请注意， JSON.parse()用于取消序列化cookie字符串值，并将其解析为可用的JavaScript对象。

例如：

var obj = JSON.parse('{ "foo" : "bar" }');
console.log(obj.foo);    //print 'bar' in the console

重要：

在您的应用程序中，仅将1.4.7版本的Angular库与Angular 1.4.7 Core一起使用。

让我知道是否有帮助。