Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(devtools): fix issue with virtual scroll viewport in the directive forest (#54912)

Browse source 
In some cases the height of the viewport wasn't calculated correctly because of extension tabs quirks. This commit fixes this issue.

Fixes #53704

PR Close #54912
This commit is contained in:
Matthieu Riegler 2024-03-17 14:56:46 +01:00 committed by Andrew Kushnir
parent 9258160598
commit ce094b227c
1 changed files with 14 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
View file

@ -16,6 +16,7 @@ import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
ElementRef,
EventEmitter,
HostListener,
Input,
@ -99,11 +100,13 @@ export class DirectiveForestComponent {
readonly itemHeight = 18;
private _initialized = false;
private resizeObserver: ResizeObserver;
constructor(
private _tabUpdate: TabUpdate,
private _messageBus: MessageBus<Events>,
private _cdr: ChangeDetectorRef,
private elementRef: ElementRef,
) {
this.subscribeToInspectorEvents();
this._tabUpdate.tabUpdate$.pipe(takeUntilDestroyed()).subscribe(() => {
@ -114,6 +117,17 @@ export class DirectiveForestComponent {
});
}
});
// In some cases there a height changes, we need to recalculate the viewport size.
this.resizeObserver = new ResizeObserver(() => {
this.viewport.scrollToIndex(0);
this.viewport.checkViewportSize();
});
this.resizeObserver.observe(this.elementRef.nativeElement);
}
ngOnDestroy(): void {
this.resizeObserver.disconnect();
}
subscribeToInspectorEvents(): void {