一个带有因果报应的Angular2应用程序jasmine抛出多级目录结构的错误

时间:2017-01-17 21:24:11

标签: javascript angular jasmine karma-jasmine

我正在使用当前的4.0.0-beta.1版本构建一个Angular 2应用程序。经过几个小时的挣扎,我得到了业力。我现在正试图让茉莉花重言式测试(true = true)运行,但业力报告“Uncaught ReferenceError:describe is not defined”。以下是相关的代码部分。

karma.conf.js

module.exports = function(config) {
config.set({

basePath: '',
frameworks: ['jasmine'],
// these plugins seem to be necessary. Without them, an error about a missing require in app.component.js occurs in karma
plugins: [
  require('karma-jasmine'),
  require('karma-chrome-launcher'),
  require('karma-htmlfile-reporter')
],

files: [
  'src/client/app/*.js',
  'src/client/app/components/**/*.js'
], 

1st.spec.ts

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By }  from '@angular/platform-browser';
import { DebugElement } from '@angular/core';

////////  SPECS  /////////////
describe('1st tests', () => {
  it('true is true', () => expect(true).toBe(true));
});

1st.spec.ts文件位于'src / client / app / * .js'文件夹中,该文件夹在文件中指定:karma.conf.js数组

缺少什么?你如何让Angular2识别茉莉花功能?我没有将任何测试组件导入app.module.ts,因为我没有看到任何教程提到这一点。这是秘密吗?那是什么呢?

1 个答案:

答案 0 :(得分:0)

经过数周的阅读教程,业力博客和购买ng-book2后,我发现当app.component.ts在目录结构中处于几个级别时,没有人描述如何设置测试配置。 Karma文档可以解释这一点,但是文档是如此冗长和抽象,没有例子,我无法从中获得任何意义。我还发现Angular的快速入门应用程序有各种各样的秘密调味品和#39;使业力和茉莉花测试,例如,karma-test-shim.js(你无法通过npm获得)。

在没有上述文档的帮助下,我重新开始使用Angular的安装程序。安装程序使用systemjs。 AngularCLI使用Webpack。了解这一点。它对我的解决方案和长期行动产生了影响。 Jasmine测试为Angular Setup的快速入门提供了现成的工作。我将目录结构轻推到我的多层次并调整了大量的东西,以找到保持业力和优势的配置。茉莉花工作。底线 - Systemjs和karma.config.js都必须一起改变。只有其中一个的变化只会产生新的和新颖的控制台错误。

Systemjs - 将地图对象中的app:更改为您的路径。就我而言,它的

map: {
  app: 'src/client/app',
  // the rest of map
}

karma.conf.js - 更改module.exports函数中的appBase和appSrcBase

var appBase    = 'src/client/app/';  //originally appBase='app/';
var appSrcBase = 'src/client/app/';

控制台错误让它听起来像@angular束路径中的问题。那里的变化只是创造了不同的错不要被吸进来。

希望这可以节省您大量时间在具有真实生活目录结构的应用程序上进行测试。