Angular 14升级至15.1.4后ng test提示‘No specs found’求助

• 背景：应用从Angular 4逐步升级到14，再升级至Angular 15.1.4后，ng serve可正常构建启动，但删除.browserslistrc文件后出现测试异常
• 异常现象：执行ng test时，明明存在数百个测试用例，却提示"No specs found"，Angular 14版本测试可正常运行
• 测试浏览器提示：

Incomplete: No specs found, , randomized with seed 89005

• 命令行输出：

> ng test
√ Browser application bundle generation complete.
11 02 2023 14:29:13.412:WARN [karma]: No captured browser, open http://localhost:9876/
11 02 2023 14:29:13.429:INFO [karma-server]: Karma v6.4.1 server started at http://localhost:9876/
11 02 2023 14:29:13.430:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
11 02 2023 14:29:13.436:INFO [launcher]: Starting browser Chrome
11 02 2023 14:29:18.071:INFO [Chrome 109.0.0.0 (Windows 10)]: Connected on socket rK2xPAWwWBFkQCuuAAAB with id 43283367
Chrome 109.0.0.0 (Windows 10): Executed 0 of 0 SUCCESS (0.004 secs / 0 secs)
TOTAL: 0 SUCCESS

• 已尝试操作：移除angular.json中加载Karma配置文件的设置，问题仍未解决，无明显警告或错误

1. 恢复.browserslistrc文件 #

Angular 15对浏览器兼容性配置的依赖更严格，删除该文件可能导致测试构建无法正确识别目标环境，遗漏测试文件。

• 新建.browserslistrc文件，添加基础配置：

last 2 Chrome versions
last 2 Firefox versions
last 2 Edge versions
last 2 Safari versions

• 重新执行ng test验证

2. 检查angular.json测试配置 #

确保test节点下的核心文件路径正确，且覆盖所有测试文件：

"test": {
  "builder": "@angular-devkit/build-angular:karma",
  "options": {
    "main": "src/test.ts",
    "polyfills": "src/polyfills.ts",
    "tsConfig": "tsconfig.spec.json",
    "karmaConfig": "karma.conf.js",
    "assets": ["src/favicon.ico", "src/assets"],
    "styles": ["src/styles.css"],
    "scripts": []
  }
}

• 同步检查tsconfig.spec.json的include规则：

"include": [
  "src/**/*.spec.ts",
  "src/**/*.d.ts"
]

3. 校验karma.conf.js文件匹配规则 #

若使用自定义Karma配置，确保文件指向逻辑正确：

module.exports = function(config) {
  config.set({
    files: [
      { pattern: './src/test.ts', watched: false }
    ],
    preprocessors: {
      './src/test.ts': ['webpack', 'sourcemap']
    }
    // 其他配置项...
  });
};

• 若之前移除了angular.json中的karmaConfig配置，建议恢复并确认路径正确

4. 检查测试文件兼容性 #

Angular 15对TypeScript版本和测试API有更新要求，排查测试文件：

• 用ng lint或tsc --noEmit检查TypeScript语法错误
• 替换过时API，如TestBed.get()改为TestBed.inject()
• 确认导入路径无误，避免测试文件无法被识别

5. 清理缓存重新构建 #

执行命令清理缓存，避免旧构建文件干扰：

rm -rf node_modules dist .angular/cache
npm install
ng test

内容的提问来源于stack exchange，提问作者Phil Huhn