javascript - test - Pruebas angulares con Karma: "el módulo no está definido"

karma-jasmine

Question

Sé que esta pregunta se ha hecho muchas veces, y sé que en la mayoría de los casos a las personas les falta el archivo angular-mocks.js .

Me estoy encontrando con el mismo problema, intentando probar una fábrica en un módulo. Desafortunadamente, sigo encontrándome con problemas con las pruebas (¿por qué Angular, oh por qué debe suponer una window y un objeto de document ?), Que indican que el módulo no está definido. Estoy perdido También he intentado usar angular.mocks.module, pero luego aparece un mensaje que dice que Angular no está definido. ¿Qué estoy haciendo mal?

De nota, estoy usando gulp como un corredor de tareas. Mi gulpfile (aún no perfecto, las tareas no están vinculadas):

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'']);

Mi karma.conf.js, generado por el 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
  });
};

Y finalmente, mi suite de pruebas (nada está configurado aún, si puedo superar este obstáculo, vamos a estar bien):

/* 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''));
    // });
});

¿Alguien ve algo mal? No estoy seguro de si hay algo realmente obvio que me falta, podría usar un par de ojos extra, o muchos. Originalmente pensé que sería capaz de ejecutar esto como un simple conjunto de pruebas de Jasmine sin Karma, pero debido a Angular, eso tiene problemas. Si no puedo hacer que esto funcione, podría usar el paquete angular de npm y alterar mi módulo angular para que sea compatible con CommonJS ...

¡Gracias a todos! Espero no estar loco

Editar: he incluido mis dependencias de desarrollo.

  "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"
  }

Answer 1

El mensaje que indica que el módulo / angular no está definido significa que su archivo angular-mocks.js no se está cargando, a pesar de que lo tiene en la lista de su archivo karma.conf.js.

El problema que estás experimentando es gulp-karma ignorando tu matriz de archivos karma.conf.js. Esto sucede cuando pasas una cadena o un globo terráqueo a gulp.src en el gulpfile.

Para evitar esto, pase gulp.src una cadena para un archivo falso, "./foobar" por ejemplo, y esto causará que la matriz de archivos en el archivo karma.conf.js se use en su lugar.

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

¡Espero que esto ayude!

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