0

我已按照Codelab 和 yeoman 的本教程进行操作。正确实施后，您将使用本地存储来存储 TodoList。我在设置测试时遇到问题，以测试它是否有效。这是我到目前为止所得到的：

'use strict';

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

  // load the controller's module
  beforeEach(module('yeoTodoApp'), module('LocalStorageModule'));

  var MainCtrl,
    scope;

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

  it('should add items to the list', function () {
    var beforeLength = scope.todos.length;
    scope.todo = 'Test 1';
    scope.addTodo();
    var afterLength = scope.todos.length;
    expect(afterLength-beforeLength).toBe(1);
  });
it('should add items to the list then remove', function () {
    var beforeLength = scope.todos.length;
    scope.todo = 'Test 1';
    scope.addTodo();
    scope.removeTodo(0);
    var afterLength = scope.todos.length;
    expect(afterLength-beforeLength).toBe(0);
  });

});

我得到的错误是

第 12 行 col 68 '$httpBackend' 已定义但从未使用过。});

我将如何编写单元测试来放置本地存储？

4

2 回答 2

2

我认为目前这个想法有点嘲笑你的本地存储：

编写单元测试

对于额外的挑战，请重新访问第 8 步中的单元测试，并考虑在代码使用本地存储的情况下如何更新测试。

提示：这不是一个直截了当的答案，需要了解模拟服务。查看 AngularJS 中的单元测试最佳实践，特别是 AngularJS 中的模拟服务和模块部分。

自从提出这个问题以来，情况可能已经发生了变化。无论如何，这是我的解决方案：

'use strict';

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

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

  var MainCtrl,
    scope,
    localStorage, store;

  // Initialize the controller and a mock scope
  beforeEach(inject(function ($controller, $rootScope) {
    scope = $rootScope.$new();

    MainCtrl = $controller('MainCtrl', {
      $scope:scope
      // place here mocked dependencies
    });

    /*mock the localStorageService*/
    store={};

    localStorage = {
      set: function(key, value) {
        store[key] = value;
      },
      get: function(key) {
        return store[key];
      }
    };

  }));

  it('should check the list length', function () {
    expect(MainCtrl.todos.length).toBe(0);
  });

  it('should add items to the list', function () {
    MainCtrl.todoadded = 'Test 1';
    MainCtrl.addTodo();
    expect(MainCtrl.todos.length).toBe(1);
  });

  it('should add then remove an item from the list', function () {
    MainCtrl.todoadded = 'Test 2';
    MainCtrl.addTodo();
    MainCtrl.removeTodo(0);
    expect(MainCtrl.todos.length).toBe(0);
  });

  it('should check that the localstorage is undefined before being set', function() {
    var a=localStorage.get('todos');
    expect(a).toBeUndefined();
  });

  it('should set and get the localstorage', function() {
    localStorage.set('todos', ['Test 3']);
    var a=localStorage.get('todos');
    expect(a).toEqual(['Test 3']);

    localStorage.set('todos', ['Test 4']);
    var b=localStorage.get('todos');
    expect(b).toEqual(['Test 4']); 
  });
});
于 2016-05-19T12:20:53.083 回答
1

您的设置现在是正确的（在您从参数列表中删除 $httpBackend 之后）

Controller: MainCtrl should add items to the list then remove FAILED

这个错误是一个简单的测试错误，这意味着你的代码没有按预期工作（你的第二个测试失败）

我自己会检查 todos 的长度，而不是数学运算的结果。

我会像这样写你的测试：

it('should add items to the list then remove', function () {
  scope.todo = 'Test 1';
  expect(scope.todos.length).toBe(0);
  scope.addTodo();
  expect(scope.todos.length).toBe(1);
  scope.removeTodo(0);
  expect(scope.todos.length).toBe(0);
});

你使用 jasmine 作为测试工具。茉莉花记录的错误正是期望失败的，所以你应该得到类似的东西

expect '1' to be '0'

从那里去！

于 2014-06-23T10:33:58.200 回答