0

这篇文章跟随这个 我已经发布了另一个带有更简单示例的线程

测试代码

 'use strict';

    var app = angular.module('myApp', []);
    app.run(function ($rootScope, Menus) {

        var menus = [
        {
            'permission': null,
            'title': 'Home',
            'link': 'home'
        },
        {
            'permission': 'users',
            'title': 'User',
            'link': 'user_actions.list'
        }
        ];

        $rootScope.menus = [];

        function queryMenu(menus) {
            Menus.query(menus).then(
                function (result) {
                    $rootScope.menus = result.data; 
                },
                function (reason) {
                    throw new Error(reason);
                }
                );
        }
        $rootScope.valueSetInRun = 555;
        queryMenu(menus);
    });
    app.factory('Menus',  function($http) {
        return {
            query : function(menus){
                return $http.get('menus.json');
            }
        }; 
    });
    app.factory('UserFactory', function($http){
        return $http.get('users.json')
    });
    app.controller('MainCtrl', function($scope, UserFactory) {
        $scope.users = [];
        $scope.text = 'Hello World!';
        UserFactory.then(function(data){
            $scope.users =  data.data;
        });
    });

测试

'use strict';

describe('Run', function() {
    beforeEach(module('myApp'));
   var $httpBackend;
    beforeEach(inject(function($rootScope,_$httpBackend_) {
        $httpBackend = _$httpBackend_;
        console.log('beforeEach');
    }));

   afterEach(function() {
        $httpBackend.verifyNoOutstandingExpectation();
        $httpBackend.verifyNoOutstandingRequest();
    });

    it('should allow me to test the run() block', inject(function ($rootScope,$httpBackend) {
        console.log('it block');
        // Doesn't work take a look at https://stackoverflow.com/questions/25363969/karma-angularjs-how-to-test-run-block-with-an-asynchronous-service
        $httpBackend.when('GET', 'menus.json').respond([{id: 1, name: 'Bob'}, {id:2, name: 'Jane'}]);
       $httpBackend.flush();
       expect( $rootScope.valueSetInRun ).toBe(555);
       console.log($rootScope.menus);
  }));
}); 

describe('MainCtrl', function(){
    var scope, $httpBackend;//we'll use these in our tests

    //mock Application to allow us to inject our own dependencies
    beforeEach(module('myApp'));
    //mock the controller for the same reason and include $rootScope and $controller
    beforeEach(inject(function( $controller,_$rootScope_, _$httpBackend_){
        $httpBackend = _$httpBackend_;

        $httpBackend.when('GET', 'users.json').respond([{id: 1, name: 'Bob'}, {id:2, name: 'Jane'}]);

        //create an empty scope
        scope = _$rootScope_.$new();
        //declare the controller and inject our empty scope
        $controller('MainCtrl', {$scope: scope});
        $httpBackend.flush();
    }));

    afterEach(function() {
        $httpBackend.verifyNoOutstandingExpectation();
        $httpBackend.verifyNoOutstandingRequest();
    });

    it('should have variable text = "Hello World!"', function(){
       expect(scope.text).toBe('Hello World!'); 
    });

    it('should fetch list of users', function(){
       //expect(scope.users.length).toBe(2);
       //expect(scope.users[0].name).toBe('Bob');
    });
});

这给了我这个错误

**Error: Unexpected request: GET menus.json
No more request expected**

END UP 查看@scarIz 的回复

beforeEach(module('myApp'));
var $httpBackend;
beforeEach(inject(function( _$httpBackend_) {
    $httpBackend = _$httpBackend_;
    $httpBackend.when('GET', 'menus.json').respond([{
        id: 1, 
        name: 'Bob'
    }])
    $httpBackend.flush();
}));
afterEach(function() {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
});
describe('Init', function() {

    describe('MainCtrl', function(){
        var scope, $httpBackend,$rootScope;//we'll use these in our tests

        //mock Application to allow us to inject our own dependencies

        //mock the controller for the same reason and include $rootScope and $controller
        beforeEach(inject(function( $controller,_$rootScope_, _$httpBackend_){
            $httpBackend = _$httpBackend_;

            $httpBackend.when('GET', 'users.json').respond([{
                id: 1, 
                name: 'Bob'
            }, {
                id:2, 
                name: 'Jane'
            }]);
            $rootScope = _$rootScope_;
            //create an empty scope
            scope = _$rootScope_.$new();
            //declare the controller and inject our empty scope
            $controller('MainCtrl', {
                $scope: scope
            });
            $httpBackend.flush();
        }));

        afterEach(function() {
            $httpBackend.verifyNoOutstandingExpectation();
            $httpBackend.verifyNoOutstandingRequest();
        });

        it('should have variable text = "Hello World!"', function(){
            expect(scope.text).toBe('Hello World!'); 
        });

        it('should fetch list of users', function(){
            expect(scope.users.length).toBe(2);
            expect(scope.users[0].name).toBe('Bob');
             expect( $rootScope.valueSetInRun ).toBe(555);
           console.log($rootScope.menus);
        });
    });
}); 
4

1 回答 1

1

您的错误的原因是Menus.query它将在您为模块执行的每个测试之前运行,myApp因为它在模块的.run()配置中被调用。虽然您在Run测试套件中提供了后端定义,但您还没有为MainCtrl.

因此,为了解决这个问题,您可能希望使用beforeEach在每次测试之前运行的全局块,该块应该在您的规范之前包含在帮助文件中定义:

beforeEach(inject(function($httpBackend) {
  $httpBackend.when('GET', 'menus.json').respond([{id: 1, name: 'Bob'}])
  $httpBackend.flush();
}));
于 2014-08-20T04:12:58.660 回答