diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png index 3057e147e0..9e36cc0db4 100644 --- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png +++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:6f50563410762eac81d2279c1f1ae92118c3bd0a4b6e15e32a7b375663a25328 -size 42912 +oid sha256:6319b548e149c182c773e5a59351b9d72a9cc495408d618f43255f9806ac169f +size 43149 diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png index 48affa16cc..37a5ca4185 100644 --- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png +++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:b87afbbe37f14403b5064a6fd10fb1232b2f7e1ced059cd47e6a90db36cae705 -size 42086 +oid sha256:699d781b168131443286c0127666860a315670277c4278b84605b181806000ab +size 42338 diff --git a/projects/element-ng/chat-messages/si-chat-container.component.ts b/projects/element-ng/chat-messages/si-chat-container.component.ts index b131246e76..b75a76f1e3 100644 --- a/projects/element-ng/chat-messages/si-chat-container.component.ts +++ b/projects/element-ng/chat-messages/si-chat-container.component.ts @@ -55,6 +55,7 @@ export class SiChatContainerComponent implements AfterContentInit, OnDestroy { private scrollDebounceMs = 7; // ~144fps private resizeObserver: ResizeObserver | undefined; private contentObserver: MutationObserver | undefined; + private lastScrollHeight = 0; /** * The color variant to apply to the container. @@ -145,9 +146,15 @@ export class SiChatContainerComponent implements AfterContentInit, OnDestroy { } this.resizeObserver = new ResizeObserver(() => { - this.debouncedScrollToBottom(); + const element = container.nativeElement; + const currentScrollHeight = element.scrollHeight; + if (currentScrollHeight > this.lastScrollHeight) { + this.debouncedScrollToBottom(); + } + this.lastScrollHeight = currentScrollHeight; }); + this.lastScrollHeight = container.nativeElement.scrollHeight; this.resizeObserver.observe(container.nativeElement); }