Allow multiple REPLs on one page

Allow multiple REPLs on one page

Author: savannahostrowski

src/embed.ts

@@ -44,10 +44,11 @@ declare global {
   var pyreplInfo: string;
   var pyreplStartupScript: string | undefined;
   var pyreplReadonly: boolean;
-  var browserConsole: any;
+  var currentBrowserConsole: any;
 }
 
 let pyodidePromise: Promise<PyodideInterface> | null = null;
+let consoleCodePromise: Promise<string> | null = null;
 
 let currentOutput: Terminal | null = null;
 
@@ -191,6 +192,13 @@ function getPyodide(): Promise<PyodideInterface> {
     return pyodidePromise;
 }
 
+function getConsoleCode(): Promise<string> {
+  if (!consoleCodePromise) {
+    consoleCodePromise = fetch("/python/console.py").then((r) => r.text());
+  }
+  return consoleCodePromise;
+}
+
 function init() {
     if (document.readyState === "loading") {
         document.addEventListener("DOMContentLoaded", setup);
@@ -329,7 +337,8 @@ function createHeader(config: PyreplConfig): HTMLElement {
     return header;
 }
 
-async function createRepl(container: HTMLElement) {
+// Create terminal UI without initializing Python (fast, shows background immediately)
+function createTerminal(container: HTMLElement): { term: Terminal; config: PyreplConfig } {
     injectStyles();
 
     const config = parseConfig(container);
@@ -354,6 +363,10 @@ async function createRepl(container: HTMLElement) {
     });
     term.open(termContainer);
 
+    return { term, config };
+}
+
+async function createRepl(container: HTMLElement, term: Terminal, config: PyreplConfig) {
     const pyodide = await getPyodide();
     await pyodide.loadPackage("micropip");
 
@@ -389,13 +402,18 @@ async function createRepl(container: HTMLElement) {
     }
 
     // Load and start the Python REPL
-    const consoleCode = await fetch('/python/console.py').then(r => r.text());
+    const consoleCode = await getConsoleCode();
     pyodide.runPython(consoleCode);
-    pyodide.runPythonAsync('await start_repl()');
+    pyodide.runPythonAsync("await start_repl()");
 
-    // Keep browserConsole reference alive for input handling
-    const browserConsole = pyodide.globals.get('browser_console');
-    globalThis.browserConsole = browserConsole;
+    // Wait for Python to set currentBrowserConsole
+    while (!(globalThis as any).currentBrowserConsole) {
+      await new Promise((resolve) => setTimeout(resolve, 10));
+    }
+    const browserConsole = (globalThis as any).currentBrowserConsole;
+
+    // Clear it so next REPL can set its own
+    (globalThis as any).currentBrowserConsole = null;
 
     // Only attach input handler if not readonly
     if (!config.readonly) {
@@ -441,7 +459,16 @@ async function setup() {
         return;
     }
 
-    containers.forEach(createRepl);
+    // Create all terminals first (fast, shows backgrounds immediately)
+    const repls = Array.from(containers).map(container => ({
+        container,
+        ...createTerminal(container)
+    }));
+
+    // Then initialize Python REPLs sequentially (avoids race conditions)
+    for (const { container, term, config } of repls) {
+        await createRepl(container, term, config);
+    }
 }
 
 init();

src/python/console.py

@@ -110,10 +110,19 @@ def repaint(self):
         pass
 
 
-browser_console = BrowserConsole(js.term)
+async def start_repl():
+    # Create a new console for this terminal instance
+    browser_console = BrowserConsole(js.term)
 
+    # Capture startup script before JS moves to next REPL and overwrites it
+    startup_script = getattr(js, "pyreplStartupScript", None)
+    theme_name = getattr(js, "pyreplTheme", "catppuccin-mocha")
+    info_line = getattr(js, "pyreplInfo", "Python 3.13 (Pyodide)")
+    readonly = getattr(js, "pyreplReadonly", False)
+
+    # Expose to JS so it can send input (signals JS can proceed to next REPL)
+    js.currentBrowserConsole = browser_console
 
-async def start_repl():
     import micropip
     import rlcompleter
     import re
@@ -125,7 +134,6 @@ async def start_repl():
     from pygments.formatters import Terminal256Formatter
 
     lexer = Python3Lexer()
-    theme_name = getattr(js, "pyreplTheme", "catppuccin-mocha")
     formatter = Terminal256Formatter(style=theme_name)
 
     def syntax_highlight(code):
@@ -141,20 +149,32 @@ def write(self, data):
         def flush(self):
             pass
 
-    sys.stdout = TermWriter()
-    sys.stderr = TermWriter()
+    term_writer = TermWriter()
+
+    # Custom exec that redirects stdout/stderr to this REPL's terminal
+    import contextlib
 
-    def displayhook(value):
-        if value is not None:
-            repl_globals["_"] = value
-            browser_console.term.write(repr(value) + "\r\n")
+    def exec_with_redirect(code, globals_dict):
+        old_displayhook = sys.displayhook
 
-    sys.displayhook = displayhook
+        def displayhook(value):
+            if value is not None:
+                globals_dict["_"] = value
+                browser_console.term.write(repr(value) + "\r\n")
+
+        sys.displayhook = displayhook
+        try:
+            with (
+                contextlib.redirect_stdout(term_writer),
+                contextlib.redirect_stderr(term_writer),
+            ):
+                exec(code, globals_dict)
+        finally:
+            sys.displayhook = old_displayhook
 
     def clear():
         browser_console.clear()
-        info = getattr(js, "pyreplInfo", "Python 3.13 (Pyodide)")
-        browser_console.term.write(f"\x1b[90m{info}\x1b[0m\r\n")
+        browser_console.term.write(f"\x1b[90m{info_line}\x1b[0m\r\n")
 
     class Exit:
         def __repr__(self):
@@ -163,7 +183,6 @@ def __repr__(self):
         def __call__(self):
             browser_console.term.write("exit is not available in the browser\r\n")
 
-    global repl_globals
     repl_globals = {
         "__builtins__": __builtins__,
         "clear": clear,
@@ -173,7 +192,6 @@ def __call__(self):
     completer = rlcompleter.Completer(repl_globals)
 
     # Run startup script if one was provided (silently, just to populate namespace)
-    startup_script = getattr(js, "pyreplStartupScript", None)
     if startup_script:
         try:
             # Temporarily suppress stdout/stderr during startup
@@ -207,7 +225,7 @@ def get_word_to_complete(line):
         return match.group(0) if match else ""
 
     # In readonly mode, don't show prompt or accept input
-    if getattr(js, "pyreplReadonly", False):
+    if readonly:
         return
 
     browser_console.term.write(PS1)
@@ -302,7 +320,7 @@ def get_word_to_complete(line):
                 source = "\n".join(lines)
                 try:
                     code = compile(source, "<console>", "single")
-                    exec(code, repl_globals)
+                    exec_with_redirect(code, repl_globals)
                     history.append(source)
                     history_index = len(history)
                 except SystemExit:
@@ -332,7 +350,7 @@ def get_word_to_complete(line):
                         history.append(source)
                         history_index = len(history)
                     try:
-                        exec(code, repl_globals)
+                        exec_with_redirect(code, repl_globals)
                     except SystemExit:
                         pass
                     except Exception as e: