javascript - Jasmine angularjs - 监视 Controller 初始化时调用的 Angular 本地存储方法

标签 javascript angularjs jasmine angular-local-storage

类似问题:Jasmine angularjs - spying on a method that is called when controller is initialized

在我的 Controller 中,我使用 angular-local-storage 包通过注入(inject)提供 localStorageService。

在我的单元测试中,我想确保从服务中检索数据,所以我监视“get”和“add”方法并模拟它们 (.andCallFake)。

这适用于通过 $scope.$watch 调用的所有方法 - 只要我强制执行 $digest。但是对于在 Controller 初始化时调用的方法,它似乎不起作用。 谁能告诉我为什么这不起作用?

应用>Main.js

angular.module('angularTodoApp')
  .controller('MainCtrl',['$scope','localStorageService',function ($scope, localStorageService) {

    var todosInStore =  localStorageService.get('todos');
    $scope.todos = todosInStore && todosInStore.split('\n') || [];
    //$scope.todos = ['Item 1', 'Item 2', 'Item 3'];

    $scope.$watch('todos', function(){
      localStorageService.add('todos', $scope.todos.join('\n'));
    },true);

    $scope.addTodo  = function() {
      $scope.todos.push($scope.todo);
      $scope.todo = '';
    };

    $scope.removeTodo = function(index) {
      $scope.todos.splice(index,1);
    };
  }]);

测试>Main.js

describe('Controller: MainCtrl', function () {

  // load the controller's module
  beforeEach(module('angularTodoApp'));

  var MainCtrl,
    scope,
    localStorageService,
    store = [];

  // Initialize the controller and a mock scope
  beforeEach(inject(function ($controller, $rootScope, _localStorageService_) {
    scope = $rootScope.$new();
    localStorageService = _localStorageService_;
    MainCtrl = $controller('MainCtrl', {
      $scope: scope,
      localStorageService: _localStorageService_
    });

    //mock localStorageService get/add
    spyOn(localStorageService,'get').andCallFake(function(key){
      return store[key];
    });
    spyOn(localStorageService,'add').andCallFake(function(key, val){
      store[key] = val;
    });
  }));

  it('should retrieve "todos" from the store and assign to scope', function () {
    expect(localStorageService.get).toHaveBeenCalledWith('todos');
    expect(scope.todos.length).toBe(0);
  });

  it('should add items to the list and update the store for key = "todos"', function () {
    scope.todo = 'Test 1';
    scope.addTodo();
    scope.$digest();
    expect(localStorageService.add).toHaveBeenCalledWith('todos', jasmine.any(String));
    expect(scope.todos.length).toBe(1);
  });

除构造函数中的测试外,所有测试均通过:

expect(localStorageService.get).toHaveBeenCalledWith('todos');

最佳答案

原因是 Controller 在您调用 $controller 时初始化,在您的示例中是之前您通过 spyOn 创建 spy 。您的示例的解决方案是将对 $controller 的调用移动到对 spyOn 的调用之后

对于较长的测试套件,为了保持干燥,您可能必须将对 $controller 的调用放在一个单独的函数中,然后您可以在模拟任何所需的服务后调用它。

关于javascript - Jasmine angularjs - 监视 Controller 初始化时调用的 Angular 本地存储方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23049048/

相关文章:

javascript - Jasmine spyOn mongoose 保存

javascript - 一个 stub 如何与 sinon promise ?

javascript - 如何在 Angular/javascript中使用格式(yyyy-dd-mm)在日中 trim 0但不在月份中 trim 0?

javascript - Angular JS 类型错误 : $http is not a function

javascript - getDOM() 在 Angular 2 规范中如何工作

javascript - 使用 await 而不是 Promises 的正确方法是什么?

javascript - Angular 。在指令中生成指令。我的示波器在哪里?

javascript - jquery 全局变量可访问性

javascript - GraphQL 解析器字符串文字

Javascript - 插件不应影响所有选择框