Javascript 因果报应+；PhantomJS TypeError:undefined不是对象（评估scope.jackpot）

我对单元测试还是很陌生，老实说，我甚至想不出任何测试方法，但我无法构建我的应用程序，除非我至少有一个测试用例，所以我尝试在控制器中最小的代码块上创建最简单的测试用例，但它似乎不起作用

我相信这是我的测试用例中的一个错误，而不是我控制器的代码本身，因为当我使用

grunt-service

在浏览器中查看我的应用程序时，控制台不会显示任何错误

这就是它给我的错误：

PhantomJS 2.1.1 (Linux 0.0.0) Controller: MainCtrl should attach a list of jackpot to the scope FAILED
/home/elli0t/Documents/Yeoman Projects/monopoly/app/bower_components/angular/angular.js:3746:53
forEach@[native code]
forEach@/home/elli0t/Documents/Yeoman Projects/monopoly/app/bower_components/angular/angular.js:323:18
loadModules@/home/elli0t/Documents/Yeoman Projects/monopoly/app/bower_components/angular/angular.js:3711:12
createInjector@/home/elli0t/Documents/Yeoman Projects/monopoly/app/bower_components/angular/angular.js:3651:22
workFn@/home/elli0t/Documents/Yeoman Projects/monopoly/app/bower_components/angular-mocks/angular-mocks.js:2138:60
TypeError: undefined is not an object (evaluating 'scope.jackpot') in /home/elli0t/Documents/Yeoman Projects/monopoly/test/spec/controllers/main.js (line 20)
/home/elli0t/Documents/Yeoman Projects/monopoly/test/spec/controllers/main.js:20:17
PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.04 secs / 0.007 secs)

这是我的测试用例：

  it('should attach a list of jackpot to the scope', function () {
    expect(scope.jackpot.length).toBe(2);
  });

这是我试图运行测试的代码块：

var countInJackpot = localStorageService.get('jackpot');
$scope.jackpot = countInJackpot || [
  {
    letter: '$',
    prize: '$1,000,000 Cash',
    numbers: ['$611A','$612B','$613C','$614D','$615E','$616F','$617G','$618F'],
    count: [0,0,0,0,0,0,0,0]
  },
  {
    letter: '?',
    prize: '$500,000 Vacation Home',
    numbers: ['?619A','?620B','?621C','?622D','?632E','?624F','?625G','?626H'],
    count: [0,0,0,0,0,0,0,0]
  }
];

目前，我真的只想写一个简单的测试用例，这样我就可以构建这个应用程序了。我目前正在研究单元测试，但我仍然觉得自己还没有准备好编写更复杂的测试用例。我会留到以后

如果需要的话，我已经将文件的全部内容包括在一个参考要点中，如果需要的话，我可以包括karma.conf.js的内容

---

我希望您能够测试

localStorageService

有数据和无数据的两种情况。为此，请为

localStorageService

（请参阅）创建一个spy，并编写如下测试

'use strict';

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

var scope, localStorageService, localData;

beforeEach(function() {
    localData = {};

    module('monopolyApp');

    localStorageService = jasmine.createSpyObj('localStorageService', ['get', 'set']);
    localStorageService.get.and.callFake(function(key) {
        return localData[key];
    });

    inject(function($rootScope) {
        scope = $rootScope.$new();
    });
});

it('assigns jackpots from local storage if present', inject(function($controller) {
    localData.jackpot = 'whatever, does not matter';

    $controller('MainCtrl', {
        $scope: scope,
        localStorageService: localStorageService
    });

    expect(localStorageService.get).toHaveBeenCalledWith('jackpot');
    expect(scope.jackpot).toBe(localData.jackpot);
}));

it('assigns jackpots from default array if none present in local storage', inject(function($controller) {
    $controller('MainCtrl', {
        $scope: scope,
        localStorageService: localStorageService
    });

    expect(localStorageService.get).toHaveBeenCalledWith('jackpot');
    expect(scope.jackpot.length).toEqual(2);

    // maybe include some other checks like
    expect(scope.jackpot[0].letter).toEqual('$');
    expect(scope.jackpot[1].letter).toEqual('?');
}));

});

---

在您的测试用例中，范围应该是$scope

或

您可能还没有设置要在控制器中加载的测试环境

这是我的一个测试控制器的例子。。。角度使设置有点难以学习，但一旦你了解了流程。太棒了：）

我将尝试添加尽可能多的注释来解释每一篇文章。。。但是如果你需要澄清，请告诉我。您可能正在使用jasmine，但请记住，这是mocha，我使用的是通过karma.conf加载的angular mock库

describe('myController', function() {
  var $scope,
    createController;

  // Runs before each test. Re-extantiating the controller we want to test.
  beforeEach(inject(function($injector) {
    // Get hold of a scope (i.e. the root scope)
    $scope = $injector.get('$rootScope');

    // The $controller service is used to create instances of controllers
    var $controller = $injector.get('$controller');

    createController = function() {
      // Creates the controller instance of our controller.
      //    We are injecting $scope so we will have access to it
      //    after the controllers code runs
      return $controller('myCtrl', {
        '$scope': $scope
      });
    };
  }));

  describe('#myFunction', function() {
    it('jackpot should contain two objects', function() {
      expect($scope.jackpot.length).to.equal(2);
    });
  });
});

希望这有帮助。以下是我用来学习的一些资源：）祝你好运

---

测试中如何定义

范围？似乎这就是问题的症结所在，我忘了在我原来的帖子中包含要点链接，但我现在已经添加了它，我也会在这个评论中发布它。我会在注释中发布代码本身，但它似乎忽略了注释中的缩进，使超过一行的内容更难阅读。这是主控器下面底部的文件TackOverflow代码格式化需要4个空格的左缩进。是的，我使用的是Jasmine。我使用的方法与我在Yeoman教程中使用的方法相同，该教程涵盖了单元测试的基本知识，并且以这种方式定义范围，而不使用$对于教程中的简单todo应用程序来说似乎很好，但不适用于我制作的应用程序。谢谢你的资源，我一定会查出来的！您在描述它是如何完成的方面做得很好，但我对单元测试的语法仍然有点困惑……可能是因为它在mocha中，我一直在使用Jasmine，直到现在，但感谢您提供的信息！这是整个脚本文件，而不是我已经在使用的吗？我注意到您没有将MainCtrl作为变量包含在内，这不是必需的吗？很抱歉，我对单元测试非常陌生，所以我仍在努力理解这一切。不过，感谢您提供了一个深入的示例，一旦我弄明白了一切都在做什么，我就会尝试它。@Elliottreging现在是；最初我排除了
descripe
包装器，但现在我添加了它。我没有将控制器分配给变量，因为它没有意义，也没有在任何地方使用。谢谢，我不想只是复制/粘贴它，我宁愿用你的帖子作为参考手工写出来，因为它会更好地留在我的脑海中，我只是不想清除我的脚本来编写你的版本，最后把东西遗漏掉。我现在正在尝试，并会让你知道它是如何进行的@Elliottreging那很好。我无意让你复制/粘贴它。如果你有任何问题，只要问一下两项考试都不及格。这一次我有点不知所措，我甚至不明白控制台的错误消息试图告诉我什么。我已经将错误包括在一个要点中，以及下面的测试脚本中，因为我可能因为没有复制/粘贴而弄糟了一些东西……你知道这里出了什么问题吗。抱歉，我对单元测试还是有点陌生，我仍然在努力理解您发布的代码是如何工作的。