Skip to content

fix(devtools): stop zoom transition when disposing the tree visualizer - #71975

Open
MeAkib wants to merge 2 commits into
angular:mainfrom
MeAkib:devtools/router-tree-zoneless-tests
Open

MeAkib wants to merge 2 commits into
angular:mainfrom
MeAkib:devtools/router-tree-zoneless-tests

Conversation

@MeAkib

@MeAkib MeAkib commented Nov 11, 2026

Copy link
Copy Markdown
Contributor

What is the current behavior?

Snapping to a node in the tree visualizer starts a 500ms d3 zoom transition that is not interrupted on dispose(). If the visualizer is destroyed mid-transition, d3-zoom keeps reading the size of the detached SVG and throws:

NotSupportedError: Failed to read the 'value' property from 'SVGLength'

The router tree spec ran with provideZoneChangeDetection() (with a TODO to migrate), and its single fixture.detectChanges() never ran the visualizer's render effect, so the tree was never drawn and this path was not covered.

Issue Number: N/A

What is the new behavior?

Two commits:

  1. fix(devtools): interrupt any running transition in TreeVisualizer.dispose().
  2. refactor(devtools): run the router tree spec zoneless (remove provideZoneChangeDetection() and the TODO, replace fixture.detectChanges() with await fixture.whenStable()). The tree is now rendered and snapped to the root, which fails with the error above without the first commit.

Snapping to a node starts a 500ms d3 zoom transition that was not
interrupted on dispose. If the tree visualizer is destroyed mid-transition,
d3-zoom keeps reading the size of the now detached SVG and throws
`NotSupportedError: Failed to read the 'value' property from 'SVGLength'`.

Interrupt any running transition in `dispose()`.

Tested with the router tree spec running zoneless (next commit), which fails
with the error above without this change.
Remove `provideZoneChangeDetection()` from the router tree spec and replace
`fixture.detectChanges()` with `await fixture.whenStable()`.

With zones, the single `detectChanges()` never ran the visualizer's render
effect, so the tree was never drawn. Running zoneless now covers rendering
and the initial snap to root, which relies on the previous fix.

Tested with `pnpm bazel test
//devtools/projects/ng-devtools/src/lib/devtools-tabs/router-tree:test_chromium`.
@pullapprove
pullapprove Bot requested a review from eduhmc November 11, 2026 21:02
@ngbot ngbot Bot added this to the Backlog milestone Nov 11, 2026
@JeanMeche
JeanMeche requested review from hawkgs and removed request for eduhmc November 11, 2026 21:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant