【问题标题】:Unable to access leafletData object in jasmine tests茉莉花测试中无法访问leafletData对象
【发布时间】:2014-12-22 09:41:28
【问题描述】:

我们正在使用带有传单的 angularjs 来显示地图。除此之外,我们还使用 jasmine(1.3.1.5) + maven 进行测试。在编写的规范中,我们无法访问 LeafletData 对象。控制器是这样的:

  angular.module('TestProject').controller('TestCtrl', ['$scope', 'leafletData',       
         function TestCtrl($scope, leafletData){
         'use strict';
          $scope.map;
          leafletData.getMap().then(function(map) {
                var southWest = L.latLng(-90, -180),
                northEast = L.latLng(90, 180),
                bounds = L.latLngBounds(southWest, northEast);
                mapObj.setMaxBounds(bounds);
                mapObj.options.maxZoom = 19;
                mapObj.options.minZoom = 1;
                $scope.map=map;
                $scope.featureGroup = L.featureGroup().addTo($scope.map);
      });
  }]);

控制器的规格是:

   describe("test controller",function() {
        var scope,leafletData, compile;

        beforeEach(module("TestProject"));

        beforeEach(inject(function($controller, $rootScope, $compile, leafletData) {
            scope = $rootScope.$new();
            compile = $compile;

            $controller('TestCtrl', {
                '$scope' : scope,
                'leafletData' : leafletData
            });
        }));

        it("test function", function() {
            var element = angular.element('<leaflet></leaflet>');
            element = compile(element)(scope);
            expect(leafletData).toBeDefined();
            leafletData.getMap().then(function(map) {
                scope.map = map;
            });
            $rootScope.$digest();
            expect(scope.map.getZoom()).toEqual(1);
            expect(scope.map.getCenter().lat).toEqual(0);
            expect(scope.map.getCenter().lng).toEqual(0);
        });

  });

我们得到的错误是:

1.) 测试控制器它测试功能

我们已经在 angular-leaflet-directive 中专门导入了所有 js 文件,但它似乎不起作用。我们也觉得这可能是角度模块名称差异的问题,我们尝试使用 beforeEach(module("TestProject", "leaflet-directive"));但这也没有解决我们的问题。

请帮助我们解决这个问题!

【问题讨论】:

    标签: angularjs jasmine leaflet


    【解决方案1】:

    leafletData 未定义,因为它是在测试的顶部声明的,但从未为其分配值。这是将注射剂引入测试时要遵循的一般模式:

    describe("test controller",function() {
        var leafletData;
    
        beforeEach(module("TestProject"));
    
        beforeEach(inject(function(_leafletData_) {
            // without this, leafletData will be undefined
            leafletData = _leafletData_;
        }));
    
        it("should be defined", function() {
            expect(leafletData).toBeDefined();
        });
    });
    

    此外,在进行任何单元测试时,应单独测试被测代码。它依赖的任何服务(即在这种情况下为leafletData)以及来自这些服务的响应,都应该被模拟。例如:

    describe("test controller",function() {
        var $q;
        var scope;
        var leafletData;
    
        var mockMapData = {
            // ...
            // some mock map data
            // ...
        };
    
        beforeEach(module("TestProject"));
    
        beforeEach(inject(function(_$controller_, _$rootScope_, _$q_, _leafletData_) {
            scope = _$rootScope_.$new();
            $q = _$q_;
            leafletData = _leafletData_;
    
            // mock the leafletData
            spyOn(leafletData, 'getMap').andReturn($q.when(mockMapData));
    
            _$controller_('TestCtrl', {
                '$scope' : scope
            });
        }));
    
        it("test function", function() {
            scope.$digest();
            expect(scope.map).toEqual(mockMapData);
        });
    });;
    

    【讨论】:

    • 更重要的是,传递给控制器​​的注入leafletData会隐藏声明的var,在测试中访问它时未定义。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-09-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多