基于Yeoman搭建的Angular应用编写Karma测试遇问题

我太懂这种感受了——用Yeoman生成的Angular项目自带了现成的Karma/Jasmine测试模板，本来以为改完业务代码就能顺手写测试，结果刚上手就卡壳。结合你提到的场景，我给你整理一套适配自定义代码的测试编写和排查思路：

第一步：先把测试的基础依赖配置捋顺 #

Yeoman生成的测试文件已经帮你搭好了$controller和$rootScope的注入框架，但如果你的控制器用到了额外服务（比如你代码里的$lo大概率是$log吧？），一定要在测试的beforeEach块里把所有依赖都补全，不然肯定会报依赖注入错误。举个标准的初始化示例：

describe('MainController', function() {
  var MainController, $scope, $log;

  // 加载应用模块
  beforeEach(module('myApp'));

  // 注入所需服务并初始化控制器
  beforeEach(inject(function(_$controller_, _$rootScope_, _$log_) {
    $scope = _$rootScope_.$new();
    $log = _$log_;
    // 这里的依赖要和控制器里的参数完全对应
    MainController = _$controller_('MainController', {
      $scope: $scope,
      $log: $log
    });
  }));
});

⚠️ 重点：控制器里的依赖名称必须和测试注入的完全一致，比如控制器写的是$log，测试里就不能写成$logger。

第二步：针对自定义函数写测试的通用流程 #

假设你在主控制器里加了个业务函数$scope.processOrder，可以按照以下步骤写测试：

1. 先验证函数是否存在 #

这是最基础的校验，确保控制器把函数正确挂载到了$scope上：

it('should have processOrder function defined on $scope', function() {
  expect(angular.isFunction($scope.processOrder)).toBe(true);
});

2. 测试核心业务逻辑 #

比如这个函数的作用是把订单状态从pending改成completed，测试就可以这么写：

it('should update orderStatus to "completed" when processOrder is called', function() {
  // 初始化测试数据
  $scope.orderStatus = 'pending';
  // 调用目标函数
  $scope.processOrder();
  // 断言结果符合预期
  expect($scope.orderStatus).toBe('completed');
});

3. 测试依赖服务的调用（如果有） #

如果函数里用到了$log、$http这类服务，还要验证服务是否被正确触发：

it('should log a success message after processing order', function() {
  $scope.processOrder();
  // 检查$log的info日志里是否包含预期内容
  expect($log.info.logs).toContain(['Order processed successfully']);
});

第三步：常见坑点排查 #

如果测试还是报错，先检查这几个高频问题：

• 依赖未注入：如果报错Unknown provider: XXXProvider，立刻检查测试的beforeEach里有没有注入控制器用到的所有服务，以及module('myApp')是否正确加载了应用模块。
• 函数挂载方式不对：如果提示$scope.XXX is not a function，看看控制器里是不是用了controllerAs语法（比如this.processOrder），这种情况测试里要通过控制器实例来调用函数，而不是$scope。
• 异步逻辑未处理：如果函数里有$http请求或者$timeout异步操作，必须用$httpBackend模拟接口响应，或者用$timeout.flush()触发回调，不然测试会因为异步未完成而断言失败。

内容的提问来源于stack exchange，提问作者Parin Gandhi