当前位置: 首页 > 面试题库 >

使用Karma进行角度测试:“未定义模块”

卫华奥
2023-03-14
问题内容

我知道这个问题已经被问过很多次了,而且我知道在大多数情况下人们会丢失angular-mocks.js文件。

我遇到了同样的问题,试图在模块上测试工厂。不幸的是,我一直遇到测试方面的问题(为什么要使用Angular,为什么要假设windowdocument对象?),未定义模块的状态。我很茫然。我也尝试过使用angular.mocks.module,但随后收到一条消息,提示未定义Angular。我究竟做错了什么?

值得注意的是,我正在使用gulp作为任务运行程序。我的gulpfile(尚未完善,任务未链接):

var gulp = require('gulp'),

    uglify = require('gulp-uglify'),
    jshint = require('gulp-jshint'),
    jasmine = require('gulp-jasmine'), 
    karma = require('gulp-karma'),

    paths = {
        scripts: "scripts/*.js",
        spec: "spec/*.js",
        dist: "dist"
    };

gulp.task('prepare', function () {
    return gulp.src(paths.scripts)
        .pipe(jshint())
        .pipe(jshint.reporter('default'))
        .pipe(uglify())
        .pipe(gulp.dest(paths.dist))
});

gulp.task('test', function () {
    gulp.src([paths.scripts, paths.spec])
        .pipe(karma({
            configFile: 'karma.conf.js',
            action: 'run'
        }));
});

gulp.task('default', ['prepare', 'test']);

我的karma.conf.js,由karma init生成:

// Karma configuration
// Generated on Fri Mar 14 2014 14:24:30 GMT-0400 (EDT)

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

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
      './lib/angular/angular.min.js',
      './lib/angular-mocks/angular-mocks.js',
      './src/*.js',
      './spec/*.js'
    ],


    // list of files to exclude
    exclude: [

    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {

    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['Chrome'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

最后,我的测试套件(尚无任何设置,如果我可以克服这个障碍,我们会很好的):

/* Tests for memento.js. */

describe('memento core test suite', function () {
    var memento;

    beforeEach(module('Memento'));

    beforeEach(function() {
        inject(function(_memento_) {
            memento = _memento_;
        });
    });

    // Check functions.
      // check to see if it has the expected function
    it('should match expected interface', function () { 
        expect(angular.isFunction(memento.canUndo)).toBe(true);
        expect(angular.isFunction(memento.canRedo)).toBe(true);
        expect(angular.isFunction(memento.undo)).toBe(true);
        expect(angular.isFunction(memento.redo)).toBe(true);
        expect(angular.isFunction(memento.push)).toBe(true);
    });

    it('should initialize', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should push() a changed object', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should not push() an unchanged object', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should return original object on undo()', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should return modified object on redo()', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should not undo() if at beginning of stack', function () {
        this.fail(Error('Test not implemented'));
    });

    it('should not redo() if at end of stack', function () {
        this.fail(Error('Test not implemented'));
    });

    // TODO: Implement revert to original, clearing history.
    // 
    // it('should return seed object on revert()', function () {
    //  this.fail(Error('Test not implemented'));
    // });

    // it('should clear the stack on clear()', function () {
    //  this.fail(Error('Test not implemented'));
    // });
});

有人看到什么不对吗?我不确定是否确实缺少某些明显的东西-
我可以多用一副或多副。我本来以为我可以在没有Karma的情况下将其作为一个简单的Jasmine测试套件运行,但是由于Angular的缘故,出现了问题。如果无法正常工作,我可能只使用npm的Angular包并更改Angular模块,使其支持CommonJS


感谢大家!希望我没有疯。

编辑:我已经包括了我的依赖。

  "devDependencies": {
    "gulp": "~3.5.6",
    "gulp-uglify": "~0.2.1",
    "gulp-jshint": "~1.5.0",
    "gulp-jasmine": "~0.2.0",
    "angular": "~1.2.10",
    "karma": "~0.12.0",
    "gulp-karma": "0.0.4",
    "karma-jasmine": "~0.2.2",
    "karma-chrome-launcher": "~0.1.2"
  }

问题答案:

指出未定义模块/角度的消息表示尽管您的karma.conf.js文件中列出了您的angular-mocks.js文件,但尚未加载。

您遇到的问题是gulp-
karma忽略了karma.conf.js文件数组。当您在gulpfile中的gulp.src中传递字符串或glob时,就会发生这种情况。

要解决此问题,请为gulp.src传递一个假文件的字符串,例如“ ./foobar”,这将导致使用karma.conf.js文件中的files数组代替。

gulp.task('test', function () {
  gulp.src('./foobar')
    .pipe(karma({
      configFile: 'karma.conf.js',
      action: 'run'
    }));
});

希望这可以帮助!

参考:https :
//github.com/lazd/gulp-karma/issues/9



 类似资料:
  • 我现在有一个小应用程序,它使用Keycloak来拥有一个SSO。但是,当我想对main.component.ts进行ng测试时,我遇到了标准的'It Wall Create'测试失败的问题,我得到了以下错误消息: 从“./main.component”导入{MainComponent};从“../app.topbar.component”导入{AppTopBarComponent};从'../ap

  • 问题内容: 我有一个带有Rails后端的单页Angular应用程序。我在文件中使用标签,但是当我使用Karma运行前端单元测试时,我得到了: 我在我的主要.js文件中执行此操作: 因此,有什么方法可以在业力实际呈现的页面中注入元素?否则,告诉Angular / Karma在运行单元测试时忽略此错误? 更新资料 这个Google Groups线程 和这个GitHub问题都描述了这个问题,但是在两种情

  • 问题内容: 我正在尝试使用Swift 2的新声明将我的类暴露给测试目标。但是我收到此编译器错误: 是包含我要公开的类的模块。如何摆脱这个错误? 问题答案: 在主要目标中,您需要将构建选项设置为“是”。 根据下面@earnshavian的评论,应仅根据苹果发行说明在调试版本中使用此选项:“启用可测试性版本设置应仅在Debug配置中使用,因为它禁止不依赖于不从内部导出内部符号的优化应用或框架” htt

  • 问题内容: 我试图添加一个自定义过滤器,但是如果使用以下代码: 但是,如果这样做,我会在Firebug中得到:“ ReferenceError:angular未定义”。 应用程序的其余部分工作正常,我在标签div中使用ng-app而不在html标签中使用ng- app,并且在https://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.

  • 问题内容: 我有以下几点: 当我在VS2014中构建它时,它给了我一条错误消息: 有人可以告诉我如何避免出现此消息吗? 问题答案: 解决此问题的一种方法是修改您的并将其设置为预定义变量之一,如Jayantha所说。 看起来像这样:

  • 我正在使用jasmine的karma,并按照在线指南安装了 和其他必需品 我跑了 和 它打开了一个外部铬浏览器,显示因果报应是相关的。我为一个函数写了一个简单的单元测试,它似乎没有运行任何测试 这是我的karma配置文件。 我的单元测试 我要测试的控制器中的特定功能 当我运行因果报应时,控制台上显示的是什么 附加信息:我正在使用AngularJS和RubyonRails。我知道有茉莉宝石可以帮助我