Fix the initialization of the messages component (#60)

* Fix the messages in the component at initilization * Fix tests on unread ? * Fix tests on unread
jupyterlab · Jul 1, 2024 · 2a9d68f · 2a9d68f
1 parent e9bda5e
commit 2a9d68f
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/packages/jupyter-chat/src/components/chat-messages.tsx b/packages/jupyter-chat/src/components/chat-messages.tsx
@@ -44,7 +44,7 @@ type BaseMessageProps = {
  */
 export function ChatMessages(props: BaseMessageProps): JSX.Element {
   const { model } = props;
-  const [messages, setMessages] = useState<IChatMessage[]>([]);
+  const [messages, setMessages] = useState<IChatMessage[]>(model.messages);
   const refMsgBox = useRef<HTMLDivElement>(null);
   const inViewport = useRef<number[]>([]);
 

diff --git a/packages/jupyterlab-collaborative-chat/ui-tests/tests/jupyterlab_collaborative_chat.spec.ts b/packages/jupyterlab-collaborative-chat/ui-tests/tests/jupyterlab_collaborative_chat.spec.ts
@@ -1605,8 +1605,11 @@ test.describe('#markUnread', () => {
   test.describe('with previous unread message', () => {
     test.beforeEach(async ({ page }) => {
       const newMessagesList = [message];
-      // Add new message to the document.
-      for (let i = 1; i < 30; i++) {
+      // Add new messages to the document.
+      // We need to add many messages because they are currently marked unread
+      // before being fully rendered by the markdownRenderer. Many messages are marked
+      // unread even if they are not in the viewport after render.
+      for (let i = 1; i < 50; i++) {
         newMessagesList.push({
           type: 'msg',
           id: UUID.uuid4(),
@@ -1643,7 +1646,7 @@ test.describe('#markUnread', () => {
 
       await expect(button).toBeAttached();
       await expect(navigationBottom).toBeAttached();
-      expect(navigationBottom).toHaveClass(/jp-chat-navigation-unread/);
+      await expect(navigationBottom).toHaveClass(/jp-chat-navigation-unread/);
 
       await button.click();
       await expect(navigationBottom).not.toHaveClass(
@@ -1665,7 +1668,7 @@ test.describe('#markUnread', () => {
 
       await expect(button).toBeAttached();
       await expect(navigationBottom).toBeAttached();
-      expect(navigationBottom).toHaveClass(/jp-chat-navigation-unread/);
+      await expect(navigationBottom).toHaveClass(/jp-chat-navigation-unread/);
 
       await button.click();
       await expect(navigationBottom).not.toHaveClass(