diff --git a/src/snek/static/message-list.js b/src/snek/static/message-list.js
index 1b99c99..5cc8756 100644
--- a/src/snek/static/message-list.js
+++ b/src/snek/static/message-list.js
@@ -38,6 +38,18 @@ class MessageList extends HTMLElement {
     })
 
   }
+  isElementVisible(element) {
+    const rect = element.getBoundingClientRect();
+    return (
+        rect.top >= 0 &&
+        rect.left >= 0 &&
+        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
+        rect.right <= (window.innerWidth || document.documentElement.clientWidth)
+    );
+}
+  isScrolledToBottom() {
+      return this.isElementVisible(this.querySelector(".message-list-bottom"));
+  }
   scrollToBottom(force) {
     console.info("Scrolling down")
    // if (force) {
diff --git a/src/snek/templates/web.html b/src/snek/templates/web.html
index fc0d5c9..dec0d12 100644
--- a/src/snek/templates/web.html
+++ b/src/snek/templates/web.html
@@ -184,7 +184,7 @@ app.addEventListener("channel-message", (data) => {
     }
     const lastMessage = messagesContainer.querySelector(".message:last-child");
     const lastElement = messagesContainer.querySelector(".message-list-bottom");
-    const doScrollDown = !lastMessage || isElementVisible(lastMessage);
+    const doScrollDown = messagesContainer.isScrolledToBottom();
     const message = document.createElement("div");
     message.innerHTML = data.html;
     message.style.display = display;
@@ -251,15 +251,7 @@ function updateLayout(doScrollDown) {
 }
 
 // --- Utility: check if element is visible ---
-function isElementVisible(element) {
-    const rect = element.getBoundingClientRect();
-    return (
-        rect.top >= 0 &&
-        rect.left >= 0 &&
-        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
-        rect.right <= (window.innerWidth || document.documentElement.clientWidth)
-    );
-}
+
 
 // --- Utility: check if scrolled past half ---
 function isScrolledPastHalf() {