From 70bde3c015ffc9ca3105a4a241f2a2c35413f51a Mon Sep 17 00:00:00 2001
From: Markus Busche <m.busche@gmail.com>
Date: Sun, 24 Aug 2025 19:22:09 +0000
Subject: [PATCH] Add enhanced distribution chart debugging functions

- Add testDistributionUpdate() for backend data integration testing
- Add testSimulationFlow() for complete simulation monitoring
- Enhance testDistributionChart() with comprehensive diagnostics
- These functions help isolate the specific failure point for the wealth distribution histogram issue
- Can be called from browser console for production debugging
---
 app/static/js/simulation.js | 121 ++++++++++++++++++++++++++++++++++++
 1 file changed, 121 insertions(+)

diff --git a/app/static/js/simulation.js b/app/static/js/simulation.js
index 3e503be..d9c317a 100644
--- a/app/static/js/simulation.js
+++ b/app/static/js/simulation.js
@@ -21,6 +21,127 @@ window.testWebSocket = async function() {
     }
 };
 
+/**
+ * Enhanced distribution update test function
+ * Call from browser console: testDistributionUpdate()
+ */
+window.testDistributionUpdate = async function() {
+    debugLog('=== ENHANCED DISTRIBUTION UPDATE TEST ===');
+    
+    // Test 1: Check current state
+    debugLog('Current state check', {
+        chartExists: !!charts.distribution,
+        canvasExists: !!document.getElementById('distributionChart'),
+        simulationId: currentSimulation.id,
+        distributionData: currentSimulation.data.distribution
+    });
+    
+    // Test 2: Try to fetch distribution from backend directly
+    try {
+        const debugResponse = await fetch('/debug');
+        const debugData = await debugResponse.json();
+        debugLog('Backend debug data', debugData.distribution_test);
+        
+        if (debugData.distribution_test) {
+            // Test updating chart with backend data
+            const testData = debugData.distribution_test;
+            if (charts.distribution && testData.labels && testData.counts) {
+                debugLog('Testing with backend debug data', testData);
+                charts.distribution.data.labels = testData.labels;
+                charts.distribution.data.datasets[0].data = testData.counts;
+                charts.distribution.update();
+                debugLog('✅ Backend debug data update: SUCCESS');
+            }
+        }
+    } catch (error) {
+        debugLog('❌ Backend debug test failed', error);
+    }
+    
+    // Test 3: Check canvas rendering
+    const canvas = document.getElementById('distributionChart');
+    if (canvas) {
+        debugLog('Canvas properties', {
+            width: canvas.width,
+            height: canvas.height,
+            clientWidth: canvas.clientWidth,
+            clientHeight: canvas.clientHeight,
+            style: canvas.style.cssText
+        });
+    }
+    
+    debugLog('=== ENHANCED TEST COMPLETE ===');
+};
+
+/**
+ * Test simulation flow for distribution data
+ * Call from browser console: testSimulationFlow()
+ */
+window.testSimulationFlow = async function() {
+    debugLog('=== SIMULATION FLOW TEST ===');
+    
+    // Test 1: Create test simulation
+    try {
+        const testParams = {
+            r_rate: 0.05,
+            g_rate: 0.03,
+            num_agents: 20,
+            iterations: 50,
+            initial_capital: 1000,
+            initial_consumption: 1000
+        };
+        
+        debugLog('Creating test simulation', testParams);
+        const createResponse = await fetch('/api/simulation', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify(testParams)
+        });
+        
+        const createData = await createResponse.json();
+        debugLog('Test simulation created', createData);
+        
+        if (createData.simulation_id) {
+            // Test 2: Start simulation and monitor
+            debugLog('Starting test simulation');
+            const startResponse = await fetch(`/api/simulation/${createData.simulation_id}/start`, {
+                method: 'POST'
+            });
+            
+            if (startResponse.ok) {
+                debugLog('Test simulation started, monitoring for 5 seconds...');
+                
+                // Monitor for updates
+                let monitorCount = 0;
+                const monitorInterval = setInterval(async () => {
+                    try {
+                        const dataResponse = await fetch(`/api/simulation/${createData.simulation_id}/data?include_distribution=true`);
+                        const simData = await dataResponse.json();
+                        
+                        debugLog(`Monitor ${monitorCount}`, {
+                            iteration: simData.latest_snapshot?.iteration,
+                            hasDistribution: !!simData.distribution,
+                            distribution: simData.distribution
+                        });
+                        
+                        monitorCount++;
+                        if (monitorCount >= 5) {
+                            clearInterval(monitorInterval);
+                            debugLog('Test monitoring complete');
+                        }
+                    } catch (error) {
+                        debugLog('Monitor error', error);
+                        clearInterval(monitorInterval);
+                    }
+                }, 1000);
+            }
+        }
+    } catch (error) {
+        debugLog('❌ Simulation flow test failed', error);
+    }
+    
+    debugLog('=== SIMULATION FLOW TEST STARTED ===');
+};
+
 /**
  * Production debugging test function
  * Call from browser console: testDistributionChart()