diff --git a/src/common.tsx b/src/common.tsx
index ac3463b..0a90b52 100644
--- a/src/common.tsx
+++ b/src/common.tsx
@@ -267,12 +267,22 @@ export function ActionItem(p: { action: ActionInfo, identifierSubstring?: string
 
     function createTerminal(websocket: string){
         const NewWindow = window.open('', '', 'width=800 height=600')!
-        NewWindow.document.write('<div id="root" width="100%" height="100%"/>')
-        
-        const root = ReactDOM.createRoot(
-            NewWindow.document.getElementById('root') as HTMLElement
-          );
-        root.render(<Box sx={terminalModalStyle}><TerminalComponent websocket={websocket}/></Box>)
+        NewWindow.document.write(`<!doctype html>
+        <html>
+          <head>
+            <link rel="stylesheet" href="node_modules/@xterm/xterm/css/xterm.css" />
+            <script src="node_modules/@xterm/xterm/lib/xterm.js"></script>
+          </head>
+          <body>
+            <div id="terminal"></div>
+            <script>
+              var term = new Terminal();
+              term.open(document.getElementById('terminal'));
+              term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
+            </script>
+          </body>
+        </html>
+      `)
     }
 
     return (<>
