Repository navigation
fix(cases): break the EformCasesModule import cycle in case-edit components - #8159
Merged
Merged
Conversation
…onents
CaseEditElementComponent and CaseEditNavComponent listed EformCasesModule
in their standalone `imports`, while EformCasesModule imports and exports
those same components. In the production bundle the module class is
defined after the components, so their eager `dependencies` arrays held
`undefined`. At runtime Angular threw NG0919 ("Cannot read @directive
metadata ... runtime circular dependency") and app-case-edit-element never
rendered, e.g. in the case-complete modal.
Both components only needed the module to render themselves recursively.
A standalone component can already use its own selector, so the module
import is removed and nothing replaces it.
CaseEditSwitchComponent <-> ElementContainerComponent is a direct cycle
of the same kind: the bundle defined the switch before the container, so
the switch's dependency list captured `undefined` for element-container.
Both sides now import each other through forwardRef, so the compiler
emits a lazy `dependencies: () => [...]` closure that works whichever
order the bundler picks.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
There was a problem hiding this comment.
🟢 Approval recommended
The focused dependency changes preserve recursive rendering, and no blocking issues were identified.
No open issues 🎉
What changed in this PR
Fixes circular Angular dependencies that prevented case-edit components from rendering in the case-complete modal.
Changes:
- Removes unnecessary
EformCasesModuleimports from recursive standalone components. - Uses
forwardReffor the mutual switch/container dependency.
| File | Description |
|---|---|
| eform-client/src/app/common/modules/eform-cases/components/case-edit/case-elements/element-container/element-container.component.ts | Defers the switch component dependency. |
| eform-client/src/app/common/modules/eform-cases/components/case-edit/case-edit-switch/case-edit-switch.component.ts | Defers the container component dependency. |
| eform-client/src/app/common/modules/eform-cases/components/case-edit/case-edit-element/case-edit-element.component.ts | Removes the circular module import. |
| eform-client/src/app/common/modules/eform-cases/components/case-edit-nav/case-edit-nav.component.ts | Removes the circular module import. |
Review effort: Balanced
This was referenced Oct 18, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
While debugging the backendconfiguration Playwright tests, the browser logged NG0919 ("Cannot read @directive metadata ... runtime circular dependency").
app-case-edit-elementnever rendered inside the case-complete modal.Cause
CaseEditElementComponentandCaseEditNavComponenthadEformCasesModulein their standaloneimports, andEformCasesModuleimports and exports those same components. In the built chunk the module is defined after the components, so their eagerdependenciesarrays heldundefined.CaseEditSwitchComponentandElementContainerComponentimport each other directly. The bundle defined the switch first (ueat offset 21921), and itsdependencies:[…,kt,…]referenced the container (kt), which wasn't assigned until offset 23102. So nestedelement-containers were dropped as well.A scan of every component, directive and pipe under
src/appfor imports of a local NgModule that refers back to the importing class found only these two module cycles.Fix
EformCasesModulefrom both components. They only used it to render themselves recursively, and a standalone component can already use its own selector, so nothing replaces it.CaseEditSwitchComponentandElementContainerComponentnow import each other throughforwardRef(() => …). The compiler then emitsdependencies: () => [...], which is resolved lazily and works whichever order the bundler picks.Verification
npx ng build: bundle generated, no errors. Only the existing NG8113 warnings remain, none of them in the touched components.app-case-edit-element→dependencies:[t,…](itself plus concrete imports, no module);app-case-edit-nav→[t,NgFor,NgIf]; switch and container →dependencies:()=>[…].npx ng test --watch=false: 3535 passed, 9 skipped. The only failures (3) are intime-planning-pn/help/playwright-tour-seed.spec.ts, from a locally synced, untracked plugin folder that isn't part of this repo, and they have nothing to do with this change.🤖 Generated with Claude Code