Instrumentar FAB→overlay: logs [CUT-DIAG] y __claudeUsageTracker
El FAB se ve y muestra datos cacheados (47%/40%) pero el click no abre el overlay. Añado: - console.log en cada paso del camino click→cache→openOverlayPanel - try/catch en onFabClick y openOverlayPanel para cazar fallos silenciosos - pointerdown listener en FAB para diferenciar "click cancelado por Claude" de "handler nunca conectado" - window.__claudeUsageTracker con loadCache, openOverlayPanel, forceShowOverlay, etc. para reproducir cada paso desde la consola Cambios temporales: una vez identificada la causa se retiran. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
57
content.js
57
content.js
@@ -815,7 +815,12 @@
|
||||
<span class="claude-usage-tracker-fab-text">…</span>
|
||||
`;
|
||||
fab.addEventListener('click', onFabClick);
|
||||
// DIAG: si pointerdown fira pero click no, algo está cancelando el click
|
||||
fab.addEventListener('pointerdown', () => {
|
||||
console.log('[CUT-DIAG] FAB pointerdown recibido');
|
||||
});
|
||||
document.body.appendChild(fab);
|
||||
console.log('[CUT-DIAG] FAB inyectado en DOM. id:', fab.id, 'parent:', fab.parentElement?.tagName);
|
||||
loadCache().then(updateFabState);
|
||||
}
|
||||
|
||||
@@ -837,18 +842,28 @@
|
||||
else fab.classList.remove('claude-usage-tracker-fab--hidden');
|
||||
}
|
||||
|
||||
async function onFabClick() {
|
||||
const cache = await loadCache();
|
||||
openOverlayPanel(cache);
|
||||
// Auto-refresh si la caché está rancia
|
||||
const ageMin = cache ? cacheAgeMin(cache.scrapedAt) : Infinity;
|
||||
if (ageMin > CACHE_TTL_MS / 60000) {
|
||||
refreshInBackground('overlay-stale');
|
||||
async function onFabClick(event) {
|
||||
console.log('[CUT-DIAG] onFabClick entrada, event:', event?.type, 'target:', event?.target?.tagName);
|
||||
try {
|
||||
const cache = await loadCache();
|
||||
console.log('[CUT-DIAG] cache cargada:', cache ? 'OK pageData=' + !!cache.pageData + ' dailyData=' + !!cache.dailyData : 'null');
|
||||
openOverlayPanel(cache);
|
||||
const ov = document.getElementById(OVERLAY_ID);
|
||||
console.log('[CUT-DIAG] overlay tras openOverlayPanel: existe=' + !!ov,
|
||||
ov ? 'display=' + getComputedStyle(ov).display + ' zIndex=' + getComputedStyle(ov).zIndex + ' opacity=' + getComputedStyle(ov).opacity : '');
|
||||
const ageMin = cache ? cacheAgeMin(cache.scrapedAt) : Infinity;
|
||||
if (ageMin > CACHE_TTL_MS / 60000) {
|
||||
refreshInBackground('overlay-stale');
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('[CUT-DIAG] onFabClick ERROR:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// -------- Overlay propio --------
|
||||
function openOverlayPanel(cache) {
|
||||
console.log('[CUT-DIAG] openOverlayPanel called, cache válida:', !!(cache && cache.pageData));
|
||||
try {
|
||||
closeOverlayPanel();
|
||||
const overlay = document.createElement('div');
|
||||
overlay.id = OVERLAY_ID;
|
||||
@@ -889,6 +904,10 @@
|
||||
document.body.appendChild(overlay);
|
||||
|
||||
document.addEventListener('keydown', overlayEscapeHandler);
|
||||
console.log('[CUT-DIAG] overlay appended OK. body.lastChild.id=', document.body.lastChild?.id);
|
||||
} catch (e) {
|
||||
console.error('[CUT-DIAG] openOverlayPanel ERROR:', e);
|
||||
}
|
||||
}
|
||||
|
||||
function overlayEscapeHandler(e) {
|
||||
@@ -1054,6 +1073,30 @@
|
||||
}, 500);
|
||||
}
|
||||
|
||||
// Exposición para depuración manual desde la consola
|
||||
window.__claudeUsageTracker = {
|
||||
version: 'debug-fab-click',
|
||||
loadCache,
|
||||
saveCache,
|
||||
openOverlayPanel,
|
||||
closeOverlayPanel,
|
||||
refreshInBackground,
|
||||
findUsageDialog,
|
||||
isUsageDialogOpen,
|
||||
parsePageData,
|
||||
injectFloatingButton,
|
||||
updateFabState,
|
||||
fabExists: () => !!document.getElementById(FAB_ID),
|
||||
overlayExists: () => !!document.getElementById(OVERLAY_ID),
|
||||
forceShowOverlay: async () => {
|
||||
const cache = await loadCache();
|
||||
console.log('[CUT-DIAG forceShowOverlay] cache:', cache);
|
||||
openOverlayPanel(cache);
|
||||
return !!document.getElementById(OVERLAY_ID);
|
||||
}
|
||||
};
|
||||
console.log('[CUT-DIAG] window.__claudeUsageTracker expuesto. Métodos:', Object.keys(window.__claudeUsageTracker).join(', '));
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', bootstrap);
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user