From 13d028e808f77d70d60ca363c5acbbbe61b3e8e7 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Thu, 2 Apr 2026 15:00:55 +0000
Subject: [PATCH] fix: trigger Chart.js resize on tab switch for hidden panel
 charts

Charts created in hidden tab panels (display:none) have zero dimensions.
When a tab is activated, use requestAnimationFrame + Chart.getChart().resize()
to ensure charts render at correct dimensions after layout reflow.

https://claude.ai/code/session_01JMApLxRnxbdgtrCjcQwFTH
---
 benches/dashboard/template.html             | 6 ++++++
 book/src/reference/benchmark-dashboard.html | 6 ++++++
 2 files changed, 12 insertions(+)

diff --git a/benches/dashboard/template.html b/benches/dashboard/template.html
index 55fba11..3d3c993 100644
--- a/benches/dashboard/template.html
+++ b/benches/dashboard/template.html
@@ -179,6 +179,12 @@ <h1>a2a-rust Benchmarks <span class="badge" id="hdr-version"></span> <span class
   document.querySelectorAll(".tab-panel").forEach(function(p){p.classList.remove("active");p.setAttribute("hidden","")});
   var tab=$("#tab-"+id);tab.setAttribute("aria-selected","true");tab.tabIndex=0;
   var panel=$("#panel-"+id);panel.classList.add("active");panel.removeAttribute("hidden");
+  /* Trigger Chart.js resize after layout reflow for charts created in hidden panels */
+  requestAnimationFrame(function(){
+    panel.querySelectorAll("canvas").forEach(function(cv){
+      var ci=Chart.getChart(cv);if(ci)ci.resize();
+    });
+  });
 }
 
 /* --- Overview --- */
diff --git a/book/src/reference/benchmark-dashboard.html b/book/src/reference/benchmark-dashboard.html
index b99c488..e9f0627 100644
--- a/book/src/reference/benchmark-dashboard.html
+++ b/book/src/reference/benchmark-dashboard.html
@@ -2705,6 +2705,12 @@ <h1>a2a-rust Benchmarks <span class="badge" id="hdr-version"></span> <span class
   document.querySelectorAll(".tab-panel").forEach(function(p){p.classList.remove("active");p.setAttribute("hidden","")});
   var tab=$("#tab-"+id);tab.setAttribute("aria-selected","true");tab.tabIndex=0;
   var panel=$("#panel-"+id);panel.classList.add("active");panel.removeAttribute("hidden");
+  /* Trigger Chart.js resize after layout reflow for charts created in hidden panels */
+  requestAnimationFrame(function(){
+    panel.querySelectorAll("canvas").forEach(function(cv){
+      var ci=Chart.getChart(cv);if(ci)ci.resize();
+    });
+  });
 }
 
 /* --- Overview --- */