skatespots/SkateSpots
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions 1

debug: add visible HTML marker to diagnose white screen in APK

Browse source 
Red banner renders from pure HTML before any JS loads.
If visible → HTML loads but JS fails.
If not visible → WebView can't even load index.html.

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
shakespeare.diy 2026-06-18 22:32:18 +07:00
parent be70ff490f
commit 379a5f7b34
2 changed files with 12 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
index.html
View file

@ -40,11 +40,16 @@
<meta name="twitter:image" content="https://skate-spots.org/images/icon-1024.png">
<!-- Leaflet CSS -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css" crossorigin="">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css" crossorigin="">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css">
</head>
<body>
<!-- DEBUG: visible immediately before JS loads. If you see this red box,
HTML is loading but JS is failing. Remove once white screen is fixed. -->
<div id="debug-marker" style="position:fixed;top:0;left:0;right:0;background:#ff0040;color:#fff;padding:8px;font:bold 14px monospace;z-index:99999;text-align:center;">
SkateSpots loading... (v1.0.6-debug)
</div>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>

4
src/main.tsx
View file

@ -7,6 +7,10 @@ import { ErrorBoundary } from '@/components/ErrorBoundary';
import App from './App.tsx';
import './index.css';
// Remove debug marker — if JS reaches here, the script is executing
const debugMarker = document.getElementById('debug-marker');
if (debugMarker) debugMarker.remove();
// Hide Capacitor splash screen once JS is ready
// Uses the global Capacitor object to avoid a hard dependency on the package
if (typeof window !== 'undefined') {