Skip to content

Migrate build system to esbuild and fix e2e code coverage #1011

@chensation

Description

@chensation

Summary

After the Angular 19 update, the build system and e2e code coverage need attention. This issue tracks migrating from the legacy webpack-based builder to esbuild and restoring Cypress e2e code coverage.

Current Problems

  • E2e coverage disabled: CYPRESS_COVERAGE=false was added to CI because the production build has no Istanbul instrumentation, causing OOM crashes and Invalid string length errors in the coverage report afterAll hook.
  • Legacy builder: angular.json uses @angular-devkit/build-angular:browser (webpack). Angular 19+ defaults to the esbuild-based application builder.
  • Dead dependencies: istanbul-instrumenter-loader is referenced in cypress/coverage.webpack.js but not installed. ngx-build-plus is used only for the serve builder.

Tasks

1. Migrate to esbuild application builder

  • Change builder from @angular-devkit/build-angular:browser to @angular-devkit/build-angular:application in angular.json
  • Update build config for esbuild compatibility (mainbrowser, outputPath structure, polyfills format)
  • Remove ngx-build-plus dependency and custom webpack serve config
  • Validate dev server, proxy config, and all build configurations still work
  • Validate CI pipeline (lint, unit tests, e2e) passes

2. Fix e2e code coverage

  • Find an esbuild-compatible approach for Istanbul instrumentation (e.g., custom esbuild plugin or babel-plugin-istanbul via a custom plugin)
  • Update cypress/coverage.webpack.js or replace with esbuild equivalent
  • Add a CI-specific build config with instrumentation, source maps enabled, and optimization off
  • Set NODE_OPTIONS: --max-old-space-size=4096 for the e2e CI step
  • Remove CYPRESS_COVERAGE: false from build.yml once coverage works
  • Verify combined.js merge script and nyc report still function correctly

3. Fix tree component tests after build migration

  • Fix tree tests that break after the build system migration to esbuild

Context

  • Angular 19 application builder uses esbuild + Vite dev server
  • The webpack-based browser builder is deprecated and will be removed in a future Angular version
  • ngx-build-plus and istanbul-instrumenter-loader do not support esbuild

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions