Javascript 类型错误：'；未定义'；不是函数（计算'；angular.element（window.width（）'；）

嗨，我有一个非常复杂的应用程序，我一直在为它编写Karma单元测试。我有很多测试都是成功编写和运行的，但后来我在应用程序中做了一些更改，现在我收到了大量错误。我盯着它看了好几个小时，还是想不出来

我得到的错误是：

TypeError: 'undefined' is not a function (evaluating 'angular.element(window).width()')
    at /Users/Desktop/app/scripts/app.js:9
    at invoke (/Users/Desktop/app/bower_components/angular/angular.js:3869)
    at /Users/Desktop/app/bower_components/angular/angular.js:3715

我的配置文件如下所示

// Karma configuration
// http://karma-runner.github.io/0.10/config/configuration-file.html

module.exports = function(config) {
  config.set({
    // base path, that will be used to resolve files and exclude
    basePath: '',

    // testing framework to use (jasmine/mocha/qunit/...)
    frameworks: ['jasmine'],

    // 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/angular-resource/angular-resource.js',
  'app/bower_components/angular-cookies/angular-cookies.js',
  'app/bower_components/angular-sanitize/angular-sanitize.js',
  'app/bower_components/angular-route/angular-route.js',
  'app/bower_components/angular-bootstrap/*.js',
  'app/bower_components/angular-ui-date/src/date.js',
  'app/bower_components/angular-ui-sortable/*.js',
  'app/bower_components/angular-ui-router/src/*.js',
  'app/bower_components/d3/*.js',
  'app/bower_components/nvd3/*.js',
  'app/bower_components/angularjs-nvd3-directives/src/directives/*.js',
  'app/bower_components/jquery/dist/*.js',
  'app/bower_components/ng-grid/*.js',
  'app/bower_components/ng-grid/build/*.js',
  'app/bower_components/ng-grid/plugins/*.js',
  'app/scripts/app.js',
  'app/bower_components/angular',
  'app/scripts/*.js',
  'app/scripts/**/*.js',
  'app/scripts/***/**/*.js',
  'test/client/spec/**/*.js'
    ],

// list of files / patterns to exclude
exclude: [
'app/bower_components/*/angular-scenario.js', 
'app/bower_components/angular-ui-router/src/compat.js',
'app/bower_components/angularjs-nvd3-directives/src/directives/intro.js',
'app/bower_components/angularjs-nvd3-directives/src/directives/outro.js'
],

// web server port
port: 8080,

// level of logging
logLevel: config.LOG_INFO,


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


// Start this browser
browsers: ['PhantomJS'],

//Coverage Options
preprocessors: {
  'app/scripts/**.js': 'coverage'
},
reporters: ['dots', 'coverage']

});
};

我正在测试的控制器：

angular.module("vizApp").controller("BasicSearchCtrl", function ($rootScope, $scope, SearchService) {
    "use strict";

    $scope.searchContent = null;

    $scope.$watch("searchContent", function (newVal, oldVal, scope) {
    SearchService.setBasicSearch($scope.searchContent);
    });

});

我写的测试是：

describe("Controller: BasicSearchCtrl", function () {
    "use strict";
    var scope, BasicSearchController, httpBackend, searchSerivce;

    //load the controller"s module
    beforeEach(module("vizApp"));

    beforeEach(function () {
        angular.mock.inject(function ($injector) {
        httpBackend = $injector.get("$httpBackend");
        });
    });

//initialize the controller and a mock scope
beforeEach(inject(function ($controller, $rootScope, $injector) {

    // create a new child scope
    scope = $rootScope.$new();

    scope.SearchService = $injector.get("SearchService");

    //create a new instance of basic search controller
    BasicSearchController = $controller("BasicSearchCtrl", { $scope: scope });

}));

//check the initial state of the search content
it("very basic search", function () {

    expect(scope.searchContent).toBeUndefined;
    expect(scope.SearchService.basicSearch).toBeUndefined;

});

但是我一直在得到这个神秘的错误…关于app.js上的第9行，但是app.js看起来像这样，所以我不明白

angular.module('vizApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ui.bootstrap',
'ui.router',
'nvd3ChartDirectives',
'ngGrid',
'ui.sortable',
'ui.date'
]).config(function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {

'use strict';

// For any unmatched url, redirect to /
$urlRouterProvider.otherwise('/');

width（）不受angular支持，angular内部依赖于jqLite

---

您必须包含jquery并使用jquery的width（）函数，或者最好还是插入Angular的$window服务并使用$window[0]。innerWidth或$window[0]。offsetWidth或$window[0]。clientWidth。

如果您确实想使用jquery而不是jqlite，那么您的模拟配置就是问题：

---

只需将jquery.js移动到文件列表中的第一个位置。如果jquery在angular.js之后，您只会得到一个没有viewport方法的jqlite对象。

您是否尝试过在调试器（例如chrome控制台）中单步执行测试？是的，我有……但很难理解我在哪里遇到了问题。当我的控制器尝试注入httpbackendcheck时，似乎一切都崩溃了这个答案我以前见过，但这里的解决方案似乎是在注入你正在测试的控制器之前注入父控制器…然而，在我的应用程序中，我认为mybasicsearch控制器没有父控制器？请先删除karma配置中的覆盖率预处理器，以获得错误的正确行号。