sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add debugging to help diagnose why the application isn't loading

Browse Source 
Add comprehensive logging and error handling to the client-side entry point and index.html to identify and report issues preventing the React application from mounting.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/DyHCx4q
This commit is contained in:
sebastjanartic 2025-09-02 08:50:05 +00:00
parent ed37dc0662
commit 73ede769b6
2 changed files with 57 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
client/index.html
View File

@ -57,5 +57,28 @@
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
<!-- Replit script removed - caused scrolling issues -->
<!-- Debug script for deployment issues -->
<script>
console.log('🚀 go4.video loading...');
window.addEventListener('load', function() {
console.log('✅ Window loaded');
setTimeout(function() {
const root = document.getElementById('root');
if (root && root.innerHTML.trim() === '') {
console.error('❌ React app failed to mount - root div is empty');
root.innerHTML = '<div style="color: red; padding: 20px; font-family: Arial; text-align: center; background: #000; height: 100vh; display: flex; align-items: center; justify-content: center;"><div><h1>Error: React app failed to load</h1><p>Check browser console for details</p></div></div>';
}
}, 2000);
});
window.addEventListener('error', function(e) {
console.error('❌ Global error:', e.error);
});
window.addEventListener('unhandledrejection', function(e) {
console.error('❌ Unhandled promise rejection:', e.reason);
});
</script>
</body>
</html>

35
client/src/main.tsx
View File

@ -2,6 +2,8 @@ import { createRoot } from "react-dom/client";
import App from "./App";
import "./index.css";
console.log('🎬 main.tsx starting...');
// Registracija Service Worker-ja za PWA funkcionalnost
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
@ -15,4 +17,35 @@ if ('serviceWorker' in navigator) {
});
}
createRoot(document.getElementById("root")!).render(<App />);
try {
const rootElement = document.getElementById("root");
console.log('🎯 Root element found:', rootElement);
if (!rootElement) {
throw new Error('Root element not found');
}
console.log('🚀 Creating React root...');
const root = createRoot(rootElement);
console.log('🎭 Rendering App component...');
root.render(<App />);
console.log('✅ React app mounted successfully');
} catch (error) {
console.error('❌ Failed to mount React app:', error);
// Fallback error display
const rootElement = document.getElementById("root");
if (rootElement) {
rootElement.innerHTML = `
<div style="color: red; padding: 20px; font-family: Arial; text-align: center; background: #000; height: 100vh; display: flex; align-items: center; justify-content: center;">
<div>
<h1>Critical Error: React app failed to start</h1>
<p>Error: ${error instanceof Error ? error.message : 'Unknown error'}</p>
<p>Check browser console for details</p>
</div>
</div>
`;
}
}