From 2b6f9a65d8ec25b835ba5f8e8600a7a80206e314 Mon Sep 17 00:00:00 2001
From: Reimar <mail@reim.ar>
Date: Mon, 13 Oct 2025 19:18:05 +0200
Subject: [PATCH] auto-scroll console

---
 src/playground_console.js | 20 +++++++++++++-------
 style.css                 |  1 +
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/playground_console.js b/src/playground_console.js
index 5bb31d0..e25a640 100644
--- a/src/playground_console.js
+++ b/src/playground_console.js
@@ -102,32 +102,38 @@ export class PlaygroundConsole {
         }
     }
 
+    #addTopLevelEntry(entryType, ...args) {
+        this.#addEntry(entryType, "", this.elem, ...args);
+
+        this.elem.scrollTop = this.elem.scrollHeight;
+    }
+
     addInput() {
-        this.#addEntry("input", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("input", ...arguments);
     }
 
     log() {
-        this.#addEntry("log", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("log", ...arguments);
     }
 
     dir() {
-        this.#addEntry("dir", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("dir", ...arguments);
     }
 
     debug() {
-        this.#addEntry("debug", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("debug", ...arguments);
     }
 
     info() {
-        this.#addEntry("info", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("info", ...arguments);
     }
 
     warn() {
-        this.#addEntry("warn", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("warn", ...arguments);
     }
 
     error() {
-        this.#addEntry("error", "", this.elem, ...arguments);
+        this.#addTopLevelEntry("error", ...arguments);
     }
 
     clear() {
diff --git a/style.css b/style.css
index d1883f4..7fb4849 100644
--- a/style.css
+++ b/style.css
@@ -108,6 +108,7 @@ div#buttons button {
     display: flex;
     flex-direction: column;
     gap: 5px;
+    scroll-behavior: smooth;
 }
 
 #console pre {