使用无法运行单元测试的Angular Seed项目

Question

更新

我正在遍历业力模块，查找表示chrome的代码，并尝试不成功地切换到firefox，如果有人也知道我应该去哪里，我也会很高兴。

---

我希望有人熟悉角种子。 我写了一个小角度的js网络应用程序，我想为此编写一些测试，所以今天我正在学习茉莉和业力。 我发现有角种子已安装了这些库，因此我花了整整一天的时间将项目移至有角种子。

我在运行单元测试时遇到问题，出现以下错误

Chrome 32.0.1700 (Mac OS X 10.8.4) ERROR
    Uncaught Error: Bootstrap requires jQuery

有趣的是，当我启动服务器时，在chrome dev控制台中，jquery文件实际上已正确加载到我的网络上，并确保它们在bootstrap.min.js之前出现。

在我的index.html文件中，这些脚本位于底部

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>       
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>

在身体结束之前

该网站已启动并正在运行，Chrome开发者控制台上没有错误。

角种子带有package.json文件（我想运行npm install将模块安装在角种子目录中）

我包括了jquery并且无论如何都安装了jquery模块，这是我的第二次尝试。

"jquery" : "~2.1.0-rc1"

我什至去下载了jquery的未压缩文件，并从js / vendor文件夹中的index.html中链接了它。 我已经取消链接了。 这些文件仍然存在于我的js / vendor文件夹中。

运行此后，我得到上面的错误

scripts/test.sh

这可能是一个镀铬的问题，我不太确定。 我将看看是否可以切换到使用Firefox进行测试。 感谢您提供任何帮助或解决此问题的想法。

如果有帮助，这是我的controllersSpec.js文件

'use strict';

/* jasmine specs for controllers go here */

describe('RootPage', function(){
  var rootCtrl; 
  beforeEach(module("backpageApp"))
  beforeEach(inject(function ($controller) {
    rootCtrl = $controller("RootCtrl"); 
  }))

  describe("RootCtrl", function() {
    it("should have listings", function() {
        expect(rootCtrl.listings).toBe(true)
    })
  })
})

Answer 1

您需要在业力配置文件中列出测试依赖项。 如果查看/scripts/test.sh的内容，则可以看到它的全部功能。

$BASE_DIR/../node_modules/karma/bin/karma start $BASE_DIR/../config/karma.conf.js $*

..so会调用karma启动脚本并将其传递给karma.conf.js。 打开karma.conf.js文件，您可以看到角度种子项目附带的依赖项。 jQuery不存在，因为Angular不需要它，但是您的应用程序需要它。 您也应该在其中添加bootstrap.js文件...

 files : [
  'app/lib/angular/angular.js',
  'app/lib/angular/angular-*.js',
  'test/lib/angular/angular-mocks.js',
  'app/js/**/*.js',
  'test/unit/**/*.js'
],

我将下载jquery文件，以便您可以指向本地副本。 例如...

 files : [
  'app/lib/jquery/jquery.js',
  'js/vendor/bootstrap.min.js',
  'app/lib/angular/angular.js',
  'app/lib/angular/angular-*.js',
  'test/lib/angular/angular-mocks.js',
  'app/js/**/*.js',
  'test/unit/**/*.js'
],

Answer 2

我不确定您是否已执行所有步骤，但是无论如何，以下是运行Angular-Karma-Jasmine的步骤：

1. 您需要安装nodejs ，业力运行在节点顶部

2. 您需要从命令窗口执行的“ Node Packaged Modules”中安装karma：

     npm install -g业力 

3. 如果您打算在Chrome和Firefox上运行此程序，并且要在Windows上运行此程序，则需要添加2个环境变量 ：

CHROME_BIN = [Crome installation path/chrome.exe]
   FIREFOX_BIN =[Firefox installation path/firefox.exe]

4.一旦可以执行，请使用命令窗口返回项目文件夹：

karma init

只需按回车，直到完成为止。 最重要的是，这将创建一个名为：

karma.config.js

在我的项目中，此文件如下所示，您可能会在不同的设置中包含一些有用的注释：

module.exports = function(config) {
      config.set({    
        basePath: '',    
        frameworks: ['jasmine'],    
        files: [
          '../app/*.js',
          '../app/lib/angular.js',
          '../app/lib/angular-route.min.js',
          '../app/lib/angular-mocks.js',         
          '../app/app.js',
          'controllers/*.js',
          'services/*.js',
        ],    
        exclude: [
        ],    
        reporters: ['progress'],    
        port: 9876,    
        colors: true,    
        logLevel: config.LOG_INFO,    
        autoWatch: true,    
        browsers: ['Chrome','Firefox'],
        captureTimeout: 60000,
        singleRun: false
      });
    };

重要提示：确保在配置中包括了角模， inject功能在该模块上。

5.返回命令窗口，导航karma.config.js文件所在的karma.config.js ，然后执行：

karma start

警告：如果您在专案中加入了较新版本的jasmine（也许是2.0.0），则在2014年1月21日之前下载的Karma版本会使用jasmine 1.3.1，可能会发现该版本与karma-jasmine使用的版本之间存在一些差异 。

在这一点上，你会很高兴。

关于从SpecRunner文件中运行茉莉花，可能会有一些差异，但我想这可能是另一个问题的话题。