TypeError: angular.element.cleanData is not a function

Question

我在尝试使用 inject()

时在我的 karma 单元测试中遇到以下错误

  Example
    ✗ should wait for promise to resolve and have a result
    Error: timeout of 2000ms exceeded. Ensure the done() callback is being called in this test.

  ✗ "after each" hook for "should wait for promise to resolve and have a result"
    TypeError: angular.element.cleanData is not a function
        at Function.module.$$cleanup (base/app/bower_components/angular-mocks/angular-mocks.js?aa216eb2339283c5ab5aa192023171aa202a2bbd:2776:23)
        at Context.module.$$afterEach (base/app/bower_components/angular-mocks/angular-mocks.js?aa216eb2339283c5ab5aa192023171aa202a2bbd:2746:14)

代码如下：

describe('Example', function() {
  var $q;
  var $rootScope;
  var fakePromise;

  beforeEach(inject(function (_$q_, _$rootScope_) {
    $q = _$q_;
    $rootScope = _$rootScope_;

    fakePromise = function fakePromise(){
      var def = $q.defer();
      setTimeout(function(){
        def.resolve('foo');
      }, 100);

      return def.promise;
    };
  }));

  it('should wait for promise to resolve and have a result', function(){
    return fakePromise().should.eventually.equal('foo');
  });
});

我正在使用 angular 和 angular-mocks 1.5.3.

这是我的业力配置：

  // Karma configuration
  // Generated on Tue Mar 29 2016 14:28:04 GMT-0700 (PDT)

  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: ['mocha', 'chai', 'chai-as-promised', 'sinon'],


      // list of files / patterns to load in the browser
      files: [
        'app/bower_components/angular/angular.js',
        'app/bower_components/angular-mocks/angular-mocks.js',
        'app/bower_components/es5-shim/es5-shim.js',
        'app/bower_components/jquery/dist/jquery.js',
        'app/bower_components/x2js/xml2json.js',
        'app/bower_components/angular/angular.js',
        'app/bower_components/angular-messages/angular-messages.js',
        'app/bower_components/angular-bootstrap/ui-bootstrap-tpls.js',
        'app/bower_components/angular-cookies/angular-cookies.js',
        'app/httpsnippet-browser/dist/restlet-angular-httpsnippet.js',
        'app/bower_components/highlightjs/highlight.pack.js',
        'app/bower_components/angular-highlightjs/angular-highlightjs.js',
        'app/bower_components/marked/lib/marked.js',
        'app/bower_components/angular-marked/angular-marked.js',
        'app/bower_components/angular-pretty-xml/src/angular-pretty-xml.js',
        'app/bower_components/angular-resource/angular-resource.js',
        'app/bower_components/angular-sanitize/angular-sanitize.js',
        'app/bower_components/ace-builds/src-noconflict/ace.js',
        'app/bower_components/ace-builds/src-noconflict/mode-yaml.js',
        'app/bower_components/ace-builds/src-noconflict/ext-language_tools.js',
        'app/bower_components/ace-builds/src-noconflict/ext-searchbox.js',
        'app/bower_components/angular-ui-ace/ui-ace.js',
        'app/bower_components/angular-ui-router/release/angular-ui-router.js',
        'app/bower_components/angular-ui-validate/dist/validate.js',
        'app/bower_components/angular-ui-uploader/dist/uploader.js',
        'app/bower_components/angular-inview/angular-inview.js',
        'app/bower_components/ng-resize/index.js',
        'app/bower_components/bootstrap/dist/js/bootstrap.js',
        'app/bower_components/js-yaml/dist/js-yaml.js',
        'app/bower_components/json3/lib/json3.js',
        'app/bower_components/ngstorage/ngStorage.js',
        'app/bower_components/yaml-js/yaml.js',
        'app/bower_components/async/lib/async.js',
        'app/bower_components/traverse/traverse.js',
        'app/bower_components/path-loader/browser/path-loader.js',
        'app/bower_components/json-refs/browser/json-refs.js',
        'app/bower_components/lodash/lodash.js',
        'app/bower_components/spark-md5/spark-md5.js',
        'app/bower_components/swagger-converter/browser.js',
        'app/bower_components/z-schema/dist/ZSchema-browser-min.js',
        'app/bower_components/visionmedia-debug/dist/debug.js',
        'app/bower_components/swagger-tools/browser/swagger-tools.js',
        'app/bower_components/apply-diff/index.js',
        'app/bower_components/json-editor/dist/jsoneditor.js',
        'app/bower_components/schema-form/dist/schema-form.js',
        'app/bower_components/ng-file-upload/ng-file-upload.js',
        'app/bower_components/json-formatter/dist/json-formatter.js',
        'app/bower_components/raf/index.js',
        'app/bower_components/angular-ui-layout/ui-layout.js',
        'app/bower_components/json-schema-view/dist/json-schema-view.js',
        'app/bower_components/objectpath/lib/ObjectPath.js',
        'app/bower_components/angular-native-dragdrop/draganddrop.js',
        'app/bower_components/d3/d3.js',
        'app/bower_components/angular-translate/angular-translate.js',
        'app/bower_components/json-schema-defaults/lib/defaults.js',
        'app/bower_components/tv4/tv4.js',
        'app/bower_components/angular-schema-form/dist/schema-form.js',
        'app/bower_components/angular-schema-form/dist/bootstrap-decorator.js',
        'app/bower_components/angular-animate/angular-animate.js',
        'app/bower_components/angular-aria/angular-aria.js',
        'app/bower_components/angular-material/angular-material.js',
        'app/bower_components/moment/min/moment-with-locales.js',
        'app/bower_components/js-base64/base64.js',
        'app/bower_components/sway/browser/sway.js',
        'app/bower_components/ngInfiniteScroll/build/ng-infinite-scroll.js',
        'app/bower_components/validator-js/validator.min.js',
        'app/httpsnippet-browser/dist/restlet-angular-httpsnippet.js',
        'app/ace/theme-atom_dark.js',
        'app/core/**/*.js',
        'app/**/*UnitSpec.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: {
        // '**/*.js': ['coverage']
      },


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


      // 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: true,


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

      // // optionally, configure the reporter
      // coverageReporter: {
      //   type : 'html',
      //   dir : 'coverage/'
      // },

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

      // Concurrency level
      // how many browser should be started simultaneous
      concurrency: Infinity
    })
  }

Answer 1

我认为这与 https://github.com/angular/angular.js/issues/14251 是同一个问题（错误消息看起来会有所不同，具体取决于您用于 Karma 测试的浏览器）。我将 Angular 版本从 1.5.3 降级到 1.5.0，错误消失了。我想我们必须等到它在更新的版本中得到修复。

Answer 2

删除重复的 angular.js 并确保所有 angular 库都在使用 1.4.x 解决了我的问题。我有一些使用 1.3.15 和其他 1.4.7

Answer 3

使用相同的 angular 和 angular-mocks 版本解决了我的问题

Answer 4

我遇到了同样的问题，解决这个问题的方法是在我的测试中加载 jquery：

 files: [
      'bower_components/jquery/dist/jquery.js',
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
...
]

从 this comment 中汲取灵感，因为我们还使用 jQuery 和 Angular。

（将我的 Angular 版本从 1.5.3 降级到 1.5.0 也完成了工作，但现在有了我的解决方案，我可以使用最新的 Angular 版本...）

Answer 5

我遇到了同样的问题，解决方法如下：

转到 angular-mocks.js 文件并替换：

angular.element.cleanData(cleanUpNodes);

和

if (angular.element.cleanData) angular.element.cleanData(cleanUpNodes);

在此post中建议：https://rafikitechnology.com/2016/04/26/fixed-issue-with-angular-and-angular-mocks-do-not-agree-jasmine-is-angry/

Answer 6

我在一个非常古老的遗留应用程序中工作，我的问题分为两个部分：

应用母版页中包含的 jQuery 版本太高了旧版本，所以我需要在 angular.
我也把我的 jQuery UI include 移到 angular.js include 上面（有一个错误，这曾经是一个问题，应该在更高版本的 Angular).

Answer 7

我遇到了同样的问题，我通过在 karma 的配置文件 angular 之前的顶部添加 jquery 依赖项来修复它。

  files: [
  { pattern: 'libs/jquery/jquery/dist/jquery.min.js', watched: false },
  { pattern: 'libs/angular/angular/angular.js', watched: false },
  .....]

TypeError: angular.element.cleanData is not a function

TypeError: angular.element.cleanData is not a function

angularjs

karma-runner

angular-mock

karma-mocha