276ed71f31
Migrated from design-system-swarm with fresh git history.
Old project history preserved in /home/overbits/apps/design-system-swarm
Core components:
- MCP Server (Python FastAPI with mcp 1.23.1)
- Claude Plugin (agents, commands, skills, strategies, hooks, core)
- DSS Backend (dss-mvp1 - token translation, Figma sync)
- Admin UI (Node.js/React)
- Server (Node.js/Express)
- Storybook integration (dss-mvp1/.storybook)
Self-contained configuration:
- All paths relative or use DSS_BASE_PATH=/home/overbits/dss
- PYTHONPATH configured for dss-mvp1 and dss-claude-plugin
- .env file with all configuration
- Claude plugin uses ${CLAUDE_PLUGIN_ROOT} for portability
Migration completed: $(date)
🤖 Clean migration with full functionality preserved
159 lines
5.8 KiB
Bash
Executable File
159 lines
5.8 KiB
Bash
Executable File
#!/bin/bash
|
|
#
|
|
# GET_BROWSER_LOGS.sh - Hook to capture browser logs from DSS dashboard
|
|
#
|
|
# Usage:
|
|
# ./GET_BROWSER_LOGS.sh
|
|
#
|
|
# This script provides instructions for capturing browser logs when debugging DSS
|
|
#
|
|
|
|
cat << 'EOF'
|
|
╔══════════════════════════════════════════════════════════════╗
|
|
║ DSS Browser Log Capture - Quick Hook ║
|
|
╚══════════════════════════════════════════════════════════════╝
|
|
|
|
STEP 1: Open DSS Dashboard
|
|
→ https://dss.overbits.luz.uy/
|
|
→ Or: http://localhost:3456/admin-ui/index.html
|
|
|
|
STEP 2: Open Browser DevTools
|
|
→ Chrome/Edge: F12 or Cmd+Option+I (Mac) or Ctrl+Shift+I (Windows)
|
|
→ Firefox: F12 or Cmd+Option+K (Mac) or Ctrl+Shift+K (Windows)
|
|
→ Go to "Console" tab
|
|
|
|
STEP 3: Run Commands in Console
|
|
|
|
📊 Get System Diagnostic:
|
|
──────────────────────────
|
|
window.__DSS_BROWSER_LOGS.diagnostic()
|
|
|
|
❌ Get All Errors:
|
|
──────────────────────────
|
|
window.__DSS_BROWSER_LOGS.errors()
|
|
|
|
🌐 Get Network Activity:
|
|
──────────────────────────
|
|
window.__DSS_BROWSER_LOGS.network()
|
|
|
|
📋 Get All Logs:
|
|
──────────────────────────
|
|
window.__DSS_BROWSER_LOGS.all()
|
|
|
|
💾 Export Everything as JSON:
|
|
──────────────────────────
|
|
JSON.stringify(window.__DSS_BROWSER_LOGS.export(), null, 2)
|
|
|
|
📄 Download Logs to File:
|
|
──────────────────────────
|
|
const data = window.__DSS_BROWSER_LOGS.export();
|
|
const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
|
|
const url = URL.createObjectURL(blob);
|
|
const a = document.createElement('a');
|
|
a.href = url;
|
|
a.download = 'dss-browser-logs-' + Date.now() + '.json';
|
|
a.click();
|
|
|
|
STEP 4: Analyze Results
|
|
|
|
The diagnostic will show:
|
|
✓ Session ID
|
|
✓ Uptime
|
|
✓ Total logs captured
|
|
✓ Error count
|
|
✓ Warning count
|
|
✓ Network request count
|
|
✓ Memory usage
|
|
✓ Recent errors (last 5)
|
|
✓ Recent network requests (last 5)
|
|
|
|
STEP 5: Advanced Filtering
|
|
|
|
Search for specific issues:
|
|
──────────────────────────
|
|
window.__DSS_BROWSER_LOGGER.getLogs({
|
|
search: 'config', // Search term
|
|
level: 'error', // Filter by level
|
|
category: 'fetch', // Filter by category
|
|
limit: 50 // Max results
|
|
})
|
|
|
|
Get logs from time range:
|
|
──────────────────────────
|
|
const oneHourAgo = Date.now() - (60 * 60 * 1000);
|
|
window.__DSS_BROWSER_LOGGER.getLogs({
|
|
minTime: oneHourAgo,
|
|
limit: 100
|
|
})
|
|
|
|
TROUBLESHOOTING
|
|
───────────────────────────────────────────────────────────────
|
|
|
|
If window.__DSS_BROWSER_LOGS is undefined:
|
|
|
|
1. Check browser-logger.js is loaded:
|
|
→ Check Network tab for /admin-ui/js/core/browser-logger.js
|
|
→ Should see 200 OK response
|
|
|
|
2. Manually load it:
|
|
→ import('/admin-ui/js/core/browser-logger.js').then(() => {
|
|
console.log('Logger loaded:', window.__DSS_BROWSER_LOGS);
|
|
})
|
|
|
|
3. Check for JavaScript errors:
|
|
→ Look for red errors in Console tab
|
|
→ Fix any module loading issues
|
|
|
|
WHAT'S CAPTURED AUTOMATICALLY
|
|
───────────────────────────────────────────────────────────────
|
|
|
|
✓ All console.log/warn/error/info/debug calls
|
|
✓ Uncaught JavaScript errors
|
|
✓ Unhandled promise rejections
|
|
✓ Network requests (fetch API)
|
|
✓ Performance metrics (page load time, etc.)
|
|
✓ Memory usage warnings (if >80%)
|
|
✓ Long tasks (>50ms execution time)
|
|
|
|
DATA STRUCTURE
|
|
───────────────────────────────────────────────────────────────
|
|
|
|
Each log entry contains:
|
|
{
|
|
timestamp: 1733456789000, // Unix timestamp
|
|
relativeTime: 1234, // Ms since session start
|
|
level: 'log|warn|error|info', // Log level
|
|
category: 'console|fetch|...', // Category
|
|
message: 'Description', // Human-readable message
|
|
data: { ... }, // Additional context
|
|
url: 'https://...', // Page URL
|
|
userAgent: 'Mozilla/...' // Browser info
|
|
}
|
|
|
|
INTEGRATION STATUS
|
|
───────────────────────────────────────────────────────────────
|
|
|
|
✅ browser-logger.js created
|
|
⏳ Need to import in index.html or app.js
|
|
⏳ Need to test in browser
|
|
⏳ API endpoint not yet created (optional)
|
|
|
|
RELATED TOOLS
|
|
───────────────────────────────────────────────────────────────
|
|
|
|
Server-side debugging:
|
|
→ window.__DSS_DEBUG.printDiagnosis()
|
|
→ See .dss/DSS_SELF_DEBUG_METHODOLOGY.md
|
|
|
|
Full documentation:
|
|
→ .dss/BROWSER_LOG_CAPTURE_PROCEDURE.md
|
|
→ .dss/DEBUG_QUICKSTART.md
|
|
|
|
EOF
|
|
|
|
echo ""
|
|
echo "📖 Full documentation: .dss/BROWSER_LOG_CAPTURE_PROCEDURE.md"
|
|
echo "🔧 Browser logger module: admin-ui/js/core/browser-logger.js"
|
|
echo ""
|
|
echo "Next step: Import browser-logger.js in admin-ui/index.html or app.js"
|