Skip to content

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

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
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions