diff --git a/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.spec.ts b/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.spec.ts index 95609075a7e1..d25d11ca0b8c 100644 --- a/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.spec.ts +++ b/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.spec.ts @@ -70,6 +70,14 @@ examples.forEach((activeConversation) => { let examplePost: Post; const course = { id: 1 } as Course; + beforeAll(() => { + (window as any).ResizeObserver = class { + observe() {} + unobserve() {} + disconnect() {} + }; + }); + beforeEach(async () => { vi.useFakeTimers(); TestBed.configureTestingModule({ diff --git a/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.ts b/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.ts index c5a5b07dedc4..ce295e7dba04 100644 --- a/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.ts +++ b/src/main/webapp/app/communication/course-conversations-components/layout/conversation-messages/conversation-messages.component.ts @@ -266,6 +266,18 @@ export class ConversationMessagesComponent implements OnInit, AfterViewInit, OnD childList: true, subtree: true, }); + + const resizeObserver = new ResizeObserver((event, observer) => { + const entry = event.first(); + if (entry && entry.contentRect.height) { + // Stop observing as soon as height is non-zero + observer.unobserve(el); + } + if (!this.createdNewMessage && this.posts.length > 0) { + this.scrollToStoredId(); + } + }); + resizeObserver.observe(el); } ngOnDestroy(): void { @@ -286,6 +298,8 @@ export class ConversationMessagesComponent implements OnInit, AfterViewInit, OnD } if (savedScrollId) { requestAnimationFrame(() => this.goToLastSelectedElement(savedScrollId, this.isOpenThreadOnFocus)); + } else { + this.scrollToBottomOfMessages(); } }