fix(Chat): ui.Chat() should never scroll a parent element of the chat container element

Author: cpsievert

js/chat/chat.ts

@@ -528,11 +528,13 @@ class ChatContainer extends LightElement {
 
 // ------- Register custom elements and shiny bindings ---------
 
-customElements.define(CHAT_MESSAGE_TAG, ChatMessage);
-customElements.define(CHAT_USER_MESSAGE_TAG, ChatUserMessage);
-customElements.define(CHAT_MESSAGES_TAG, ChatMessages);
-customElements.define(CHAT_INPUT_TAG, ChatInput);
-customElements.define(CHAT_CONTAINER_TAG, ChatContainer);
+if (!customElements.get(CHAT_MESSAGES_TAG)) {
+  customElements.define(CHAT_MESSAGE_TAG, ChatMessage);
+  customElements.define(CHAT_USER_MESSAGE_TAG, ChatUserMessage);
+  customElements.define(CHAT_MESSAGES_TAG, ChatMessages);
+  customElements.define(CHAT_INPUT_TAG, ChatInput);
+  customElements.define(CHAT_CONTAINER_TAG, ChatContainer);
+}
 
 window.Shiny.addCustomMessageHandler(
   "shinyChatMessage",
@@ -561,3 +563,5 @@ window.Shiny.addCustomMessageHandler(
     el.dispatchEvent(evt);
   }
 );
+
+export { CHAT_CONTAINER_TAG };

js/markdown-stream/markdown-stream.ts

@@ -6,6 +6,8 @@ import ClipboardJS from "clipboard";
 import hljs from "highlight.js/lib/common";
 import { Renderer, parse } from "marked";
 
+import { CHAT_CONTAINER_TAG } from "../chat/chat";
+
 import {
   LightElement,
   createElement,
@@ -282,6 +284,11 @@ class MarkdownElement extends LightElement {
     while (el) {
       if (el.scrollHeight > el.clientHeight) return el;
       el = el.parentElement;
+      if (el?.tagName === CHAT_CONTAINER_TAG) {
+        // Stop searching for scrollable parents if we reach <shiny-chat-container>.
+        // If the chat is scrollable, a scrollable element would've been found already.
+        break;
+      }
     }
     return null;
   }