向 angular 项目添加其他规范文件，未正确加载/定义？

Question

警告：我不是这个项目的作者。 最初写这篇文章的人已不在该组织工作，目前我似乎是最了解这个主题的人。

对javascript和单元测试有点了解，所以成功添加了one.spec.js文件。 我尝试为另一个模块添加第二个，重用了很多规范设置，但它立即坏了。

项目资源：

• 节点 12.16.1
• 茉莉节点业力：“^1.6.1”
• 业力：“^6.3.12”

./karma.conf.js的内容：

module.exports = function(config) {
  config.set({
    basePath: './public',
    frameworks: ['jasmine', 'jquery-3.2.1'],
    files: [
        "../node_modules/angular/angular.js",
        "../node_modules/angular-mocks/angular-mocks.js",
        "../node_modules/bootstrap/dist/js/bootstrap.js",
        "../public/**/*.js",
    ],
    exclude: [
    ],
    preprocessors: {
    },
    client: {
        captureConsole: true
    },
    browserConsoleLogOptions: {
        terminal: true,
        level: ""
    },
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['FirefoxHeadless', 'ChromeHeadlessNoSandbox', 'PhantomJS'],
    customLaunchers: {
        ChromeHeadlessNoSandbox: {
            base: 'ChromeHeadless',
            flags: ['--no-sandbox']
        },
        FirefoxHeadless: {
            base: 'Firefox',
            flags: ['-headless'],
        }
    },
    singleRun: false,
    concurrency: Infinity
  })
}

最初我添加了./public/controllers.spec.js以匹配现有的./public/controllers.js 。 这些单元测试通过并继续这样做。

昨天我添加了./public/backups/backupcontrollers.spec.js以匹配./public/backups/backupcontrollers.js 。 ./public/backups/backupcontrollers.js的内容：

/**
 * Angular controller.
 */

'use strict'
const backupApp = angular.module('backup', [])
const backupTypePath = 'elasticsearch'

backupApp.controller('BackupFormController', ['$scope', '$filter', '$http', function ($scope, $filter, $http) {
  console.log('Started BackupFormController')
  $scope.itemInstances = []
  $scope.fetchStatus = 'Ready!'
  $scope.processSelection = function (item, backupType = backupTypePath) {
    $scope.currentItem = item.metadata.name
    $scope.getBackup(backupType)
    console.log('currentItem after selecting from dropdown: ' + $scope.currentItem)
  }
  $scope.init = function (backupType = backupTypePath) {
    $scope.refreshItemInstances(backupType)
    console.log('currentItem after loading page for first time: ' + $scope.currentItem)
  }
  $scope.getBackup = function (backupType = backupTypePath) {
    const path = `/v1/backup/${backupType}`
    $scope.fetchStatus = `Fetching Backups for Item ${$scope.currentItem}...`
    console.log(`Fetching backups for item from ${path}`)
    $http.get('/api', { headers: { path: path, item: $scope.currentItem } })
      .success(function (data, status, headers, config) {
        console.log(`Got data from GET on path ${path}, HTTP status ${status}: ${JSON.stringify(data)}`)
        if (typeof data === 'string' || data instanceof String) {
          $scope.backups = data.split(/\r?\n/)
        } else {
          $scope.backups = data
        }
        $scope.fetchStatus = 'Ready!'
        console.log('Done fetching backup list for item:' + $scope.currentItem + '!')
      })
      .error(function (data, status, header, config) {
        console.log(data)
        $scope.fetchStatus = 'Ready!'
      })
  }
  // Refresh the list of displayed Item instances
  $scope.refreshItemInstances = function (backupType = backupTypePath) {
    console.log('Fetching list of all items in the system ...')
    $scope.fetchStatus = 'Fetching Items ... '
    $http.get('/env')
      .success(function (data, status, headers, config) {
        console.log(data)
        for (let i = 0; i < data.length; i++) {
          $scope.itemInstances.push(data[i])
        }
        $scope.currentItem = $scope.itemInstances[0].metadata.name
        console.log('Done fetching list of all items!')
        console.log('currentItem after fetching list of all items: ' + $scope.currentItem)
        $scope.fetchStatus = 'Ready!'
        $scope.getBackup(backupType)
      })
      .error(function (data, status, header, config) {
        console.log(data)
        $scope.fetchStatus = 'Ready!'
      })
  }
}])

./public/backups/backupcontrollers.spec.js的内容：

describe('BackupFormController', function () {
  let $controller, $rootScope, $httpBackend
  beforeEach(module('backup'))
  const mockBackupString = 'string of backup data'
  const mockBackupData = {
    body: mockBackupString
  }
  const mockItemsUnsorted = [
    {
      metadata: {
        name: 'prod-mock-1',
        spec: 'asdf',
        status: 'ok'
      },
      notes: []
    },
    {
      metadata: {
        name: 'dev-mock-1',
        spec: 'asdf',
        status: 'ok'
      },
      notes: []
    },
    {
      metadata: {
        name: 'integ-mock-1',
        spec: 'asdf',
        status: 'ok'
      },
      notes: []
    }
  ]
  beforeEach(inject(function ($injector) {
    $rootScope = $injector.get('$rootScope')
    const $controller = $injector.get('$controller')
    $httpBackend = $injector.get('$httpBackend')
    const mockEnv = $httpBackend.when('GET', '/env')
      .respond(mockItemsUnsorted)
    const mockAPI = $httpBackend.when('GET', '/api')
      .respond(mockBackupString)
    const createController = function () {
      return $controller('BackupFormController', { '$scope': $rootScope })
    }
  }))
  describe('$scope.getBackup', function () {
    beforeEach(function () {
      spyOn(console, 'log')
    })
    it('should GET /api and set $scope.backups', function () {
      controller = createController()
      console.log('Dumping fetchStatus: ', $rootScope.fetchStatus)
      $rootScope.init()
      $httpBackend.flush()
      expect($rootScope.backups).toEqual(mockBackupString)
      expect(console.log).toHaveBeenCalled()
    })
  })
})

这个新规范似乎根本无法正常工作； 当我运行npm test时，我看到了来自./public/controllers.spec.js的正常成功测试，但也：

Chrome Headless 105.0.5195.125 (Mac OS 10.15.7) BackupFormController $scope.getBackup should GET /api and set $scope.backups FAILED
    ReferenceError: createController is not defined
        at UserContext.<anonymous> (backup/backupcontrollers.spec.js:51:7)
        at <Jasmine>

这是关于 ./public/backups/backupcontrollers.spec.js 的唯一./public/backups/backupcontrollers.spec.js 。

有没有人遇到过这个？ 我发现了一些关于包含 angular-mocks 的帖子，但正如您在 karma.conf.js 中看到的那样，它被包含在内。