Jasmine 使用 AngularJS 测试，Object [object Object] 没有方法 apply

Question

在我的新项目中，我一直在摆弄 AngularJS 和 Jasmine。我在 Jasmine 方面有相当丰富的经验，但之前没有将它与 AngularJS 结合使用。我正在尝试编写一个非常非常简单的单元测试，但我无法让它工作。我只是根据文档做一个非常简单的测试：

describe("Controller tests", function () {

    describe("LoginController", function () {

        var scope = {};

        beforeEach(inject(function ($rootScope, $controller) {
            scope = $rootScope.$new();
            $controller(LoginController, {
                $scope: scope
            });
        }));

        it("should prepare the login page", function () {
            scope.prepareLoginPage();
        });

    });

});

但是，它根本不起作用。 LoginController 是一个非常基本的函数，没有什么特别之处。当我尝试 Jasmine HTML 运行器时，我得到以下输出：

TypeError: Object [object Object] has no method 'apply'
TypeError: Object [object Object] has no method 'apply'
    at jasmine.Block.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:1064:23)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)
    at jasmine.Spec.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2376:16)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)
    at jasmine.Suite.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2521:16)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)
    at jasmine.Suite.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2521:16)
TypeError: Cannot call method 'prepareLoginPage' of undefined
TypeError: Cannot call method 'prepareLoginPage' of undefined
    at null.<anonymous> (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/angularjs/seabirds/controllersTest.js:18:29)
    at jasmine.Block.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:1064:23)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)
    at jasmine.Spec.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2376:16)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)
    at jasmine.Suite.execute (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2521:16)
    at jasmine.Queue.next_ (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2096:37)
    at jasmine.Queue.start (file:///Users/geroen_joris/Development/Source/LifeWatchINBO/SeaBirds/src/test/javascript/lib/jasmine-1.3.1/jasmine.js:2049:10)

问题似乎出在 beforeEach() 中，因为它会接受的唯一语法是：

beforeEach(function() { ... });

但即使我引入了这个（这与AngularJS documentation 矛盾），控制器和范围仍然没有初始化。有人指点一下吗？

我正在使用 Jasmine 1.3.1 和 AngularJS 1.0.7。

Answer 1

显然LoginController 没有在 jasmine 的规范范围内定义。 您应该在应用程序的模块中定义您的控制器：

angular.module("myApp, []).controller("LoginController", function($scope) {});

..并在规范中使用$controller("LoginController", {}) 实例化它。

Answer 2

好的，我知道出了什么问题。我假设您可以像运行任何其他 Jasmine 测试一样运行测试，这意味着：使用 SpecRunner.html 文件。

然而，这不是真的。您只能使用 Karma 运行 AngularJS 测试。虽然这看起来合乎逻辑，但老实说，我发现它确实不合逻辑。 最重要的一点是，您甚至看到您正在加载一个 JASMINE_ADAPTER（在您的 karma 配置文件中），它基本上覆盖了 Jasmine 测试框架的一部分。老实说，我发现这是一个非常糟糕的解决方案，并且与 AngularJS 团队的预期不同。如果您开始像他们那样覆盖框架的内部，那么您正在寻找解决方案，即从长远来看，这不是一条你想走的路。

我已经写了一段时间的 JS 测试，发现 Jasmine 非常轻量级，并且易于实现。我之前的项目之一，我们使用了 KnockoutJS。我当时实现了 Jasmine，以便能够为 JS 做 TDD。这很容易，而且效果很好。 因此，对于这项任务，我选择使用 AngularJS 作为一种技术，因为在稍微摆弄了一下之后，我对它的工作方式非常感兴趣。我承认，我没有尝试编写单元测试，因为它们都是基于 Jasmine 的，而且看起来很简单。就我而言，重要的经验教训。

现在，我需要安装 Node.JS、Karma 和 PhantomJS 才能在我们的构建服务器上运行这些测试。

在我的书中，AngularJS 只是丢了很多分。我什至怀疑整个测试设置的投资是否值得选择框架。我承认，AngularJS 在许多层面上都优于许多竞争对手——但没有什么，而且真的没有什么比能够编写经过全面测试的软件（最好是 TDD 风格）更重要。哦，是的，Karma 似乎是炸弹，所有目录的自动检查等等 - 但想想看：你需要拖入它的所有依赖项（这不是微不足道的）才能使用它。 Pure Jasmine 开箱即用，在 Maven 构建中无头，配置最少。

哼哼。无感。