如何从Jest覆盖率报告中排除Angular HTML模板文件

针对Angular 12 + Jest 26.0.24场景下，覆盖率报告纳入独立HTML模板文件的问题，直接通过Jest的coveragePathIgnorePatterns配置项即可解决，具体方案如下：

配置修改步骤 #

在你的jest.config.js中新增coveragePathIgnorePatterns配置，指定需要排除的文件类型：

module.exports = {
    displayName: 'f-assets',
    preset: '../../jest.preset.js',
    setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
    globals: {
        'ts-jest': {
            tsconfig: '<rootDir>/tsconfig.spec.json',
            stringifyContentPathRegex: '\\.(html|svg)$',
            isolatedModules: true,
        },
    },
    coverageDirectory: '../../coverage/libs/f-assets',
    // 添加该行，排除html/svg文件的覆盖率统计
    coveragePathIgnorePatterns: ['\\.(html|svg)$'],
    transform: {
        '^.+\\.(ts|js|html)$': 'jest-preset-angular',
    },
    snapshotSerializers: [
        'jest-preset-angular/build/serializers/no-ng-attributes',
        'jest-preset-angular/build/serializers/ng-snapshot',
        'jest-preset-angular/build/serializers/html-comment',
    ],
    reporters: [
      'default'
    ],
    transformIgnorePatterns: [
        "node_modules/(?!ngx-json-viewer|lodash-es)"
    ]
};

配置说明 #

• coveragePathIgnorePatterns是Jest原生配置，用于指定不参与覆盖率统计的文件路径正则匹配规则。
• 这里的\\.(html|svg)$会匹配所有以.html或.svg结尾的文件，直接排除在覆盖率报告之外。
• 如果需要更精确的范围（比如仅排除src/app目录下的模板），可以调整正则为src/app/.+\\.(html|svg)$。

额外说明 #

无需修改ts-jest的stringifyContentPathRegex配置，该配置仅用于将HTML/SVG文件转换为字符串供测试使用，与覆盖率统计的排除逻辑互不冲突。

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