WebStorm breakpoints not pausing after Angular 8 and 9 upgrade

Question

The issue

We have an Angular 7.2 CLI multi-project app with shared libraries. We upgraded to Angular 8 and then Angular 9. After the upgrade to Angular 8 WebStorm no longer pauses on breakpoints when debugging in the projects that consume shared libraries. The breakpoints in the library that has no dependencies on the other projects always pause as expected.

What we have tried so far

We re-did the upgrade many times one item at a time until we determined that the issue started when we upgrade @angular/core which also upgrades typescript. We then created a new multi-project app using the CLI from scratch following the Angular directions here: https://angular.io/guide/file-structure We setup two libraries. common and common-child. We added a test in common-child that imports a util class from common. The test in common will pause on breakpoints but the test in common-child will not. We have uploaded this repo here: https://github.com/chef55555/debug-issue

Our environment

• WebStorm 2020.2.1
• Node 14.4.0 and 14.3.0
• Windows 10 and CentOS 7.8.2003

Steps to reproduce

• Clone repo https://github.com/chef55555/debug-issue
• Change directory into repo
• Run npm ci
• Run npm run build
• Open project in WebStorm
• Set a breakpoint in projects/common/src/lib/shared/shared.util.spec.ts or projects/common/src/lib/shared/shared.util.ts
• Debug projects/common/src/lib/shared/shared.util.spec.ts in WebStorm
• The breakpoint should pause and it does.
• Stop Karma server (this seems to be a best practice before running tests from a different project)
• Set a breakpoint in projects/common-child/src/lib/child.spec.ts
• Debug projects/common-child/src/lib/child.spec.ts in webstorm
• The breakpoint should pause but it does not.

If I remove or comment out lines 1 and 5 in projects/common-child/src/lib/child.spec.ts, then the breakpoints will pause. Sometimes I have to restart the Karma server to get the breakpoint to pause after making this change.

There are two ways to import a shared library file, using direct import like

import { SharedUtil } from '../../../common/src/lib/shared/shared.util';

or setting a "paths" entry in tsconfig and then referencing the compiled library like this

import { SharedUtil } from 'common';

We have found that when we use the first import style, the breakpoints still pause, but when we use the second import style they do not. We use this way of importing shared libraries extensively in our real project.

Root cause

All of this leads us to believe that there is some issue in WebStorm with debugging projects that use local shared libraries on Angular 8 or later.

Any ideas?

Answer 1

该问题已在WEB-44080 上进行跟踪，请关注它（和链接的票证）以获取更新