From f91e366a174917c2c025da986fae6e9526ce18b6 Mon Sep 17 00:00:00 2001
From: qazal <77887910+Qazalin@users.noreply.github.com>
Date: Tue, 11 Nov 2025 09:25:12 +0200
Subject: [PATCH] viz: display the graph layout recursion error (#13194)

* viz: display the graph layout recursion error

* share styles

* +min-width

* same thing

* inline the append
---
 tinygrad/viz/index.html  |  1 +
 tinygrad/viz/js/index.js | 11 ++++++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/tinygrad/viz/index.html b/tinygrad/viz/index.html
index 33c893ae8c..ad08c448ad 100644
--- a/tinygrad/viz/index.html
+++ b/tinygrad/viz/index.html
@@ -292,6 +292,7 @@
   }
   .raw-text > pre {
     display: inline-block;
+    min-width: 100%;
   }
   .raw-text code {
     max-height: none !important;
diff --git a/tinygrad/viz/js/index.js b/tinygrad/viz/js/index.js
index f092d3ef79..14cb93b3c5 100644
--- a/tinygrad/viz/js/index.js
+++ b/tinygrad/viz/js/index.js
@@ -25,7 +25,7 @@ const colored = n => d3.create("span").call(s => s.selectAll("span").data(typeof
 const rect = (s) => (typeof s === "string" ? document.querySelector(s) : s).getBoundingClientRect();
 
 let timeout = null;
-const updateProgress = ({ start }) => {
+const updateProgress = ({ start, err }) => {
   clearTimeout(timeout);
   const msg = document.getElementById("progress-message");
   msg.style.display = "none";
@@ -33,6 +33,11 @@ const updateProgress = ({ start }) => {
     msg.innerText = "Rendering new graph...";
     timeout = setTimeout(() => { msg.style.display = "block"; }, 2000);
   }
+  d3.select("#custom").html("");
+  if (err) {
+    displaySelection("#custom");
+    d3.select("#custom").append(() => d3.create("div").classed("raw-text", true).call(s => s.append(() => codeBlock(err, "txt"))).node());
+  }
 }
 
 function intersectRect(r1, r2) {
@@ -136,6 +141,10 @@ function renderDag(graph, additions, recenter, layoutOpts) {
     }).attr("class", e => e.value.label.type).attr("id", e => `${e.v}-${e.w}`).datum(e => e.value.label.text));
     if (recenter) document.getElementById("zoom-to-fit-btn").click();
   };
+  worker.onerror = (e) => {
+    e.preventDefault();
+    updateProgress({ err:"Error in graph layout:\n"+e.message });
+  }
 }
 
 // ** profiler graph