feat: Add diagnostic logging for tab focus issue

This commit is contained in:
gpt-engineer-app[bot]
2025-10-12 23:57:23 +00:00
parent f45a100648
commit e7aa74287a
2 changed files with 48 additions and 13 deletions

View File

@@ -157,10 +157,22 @@ export function useModerationQueueManager(
*/ */
const fetchItems = useCallback(async (silent = false) => { const fetchItems = useCallback(async (silent = false) => {
if (!user) return; if (!user) return;
// Get caller info
const callerStack = new Error().stack;
const callerLine = callerStack?.split('\n')[2]?.trim();
// Check if tab is hidden console.log('🔄 [FETCH ITEMS] Called', {
if (pauseFetchingRef.current || document.hidden) { silent,
console.log('⏸️ Fetch paused (tab hidden)'); pauseFetchingRef: pauseFetchingRef.current,
documentHidden: document.hidden,
caller: callerLine,
timestamp: new Date().toISOString()
});
// Check if fetching is paused (controlled by visibility handler if enabled)
if (pauseFetchingRef.current) {
console.log('⏸️ Fetch paused by pauseFetchingRef');
return; return;
} }
@@ -794,15 +806,26 @@ export function useModerationQueueManager(
// Visibility change handler // Visibility change handler
useEffect(() => { useEffect(() => {
console.log('🔍 Visibility effect running - refreshOnTabVisible:', settings.refreshOnTabVisible); console.log('🔍 [VISIBILITY EFFECT] Running', {
settingsObject: settings,
refreshOnTabVisible: settings.refreshOnTabVisible,
typeOf: typeof settings.refreshOnTabVisible,
rawValue: JSON.stringify(settings.refreshOnTabVisible),
stringValue: String(settings.refreshOnTabVisible),
boolValue: Boolean(settings.refreshOnTabVisible),
timestamp: new Date().toISOString()
});
// Early return if feature is disabled // Early return if feature is disabled
if (!settings.refreshOnTabVisible) { if (!settings.refreshOnTabVisible) {
console.log('⚙️ refreshOnTabVisible is DISABLED - no listener attached'); console.log(' ✅ Setting is FALSE - NO listener will be attached');
console.log(' ✅ Tab focus will NOT trigger refreshes');
return; return;
} }
console.log('✅ refreshOnTabVisible is ENABLED - attaching listener'); console.error(' ❌ Setting is TRUE - listener WILL be attached');
console.error(' ❌ THIS MEANS TAB FOCUS **WILL** TRIGGER REFRESHES');
console.error(' ⚠️ If you disabled this setting, it is NOT working properly');
const handleVisibilityChange = () => { const handleVisibilityChange = () => {
// Double-check setting before doing anything (defensive check) // Double-check setting before doing anything (defensive check)
@@ -812,17 +835,21 @@ export function useModerationQueueManager(
} }
if (document.hidden) { if (document.hidden) {
console.log('📴 Tab hidden - pausing queue updates'); console.log('👁️ [VISIBILITY HANDLER] Tab hidden - pausing fetches');
pauseFetchingRef.current = true; pauseFetchingRef.current = true;
} else { } else {
console.log('📱 Tab visible - resuming queue updates'); console.error('👁️ [VISIBILITY HANDLER] Tab visible - THIS IS WHERE THE REFRESH HAPPENS');
console.error(' 🔴 TAB FOCUS REFRESH TRIGGERED HERE');
console.error(' 📍 Stack trace below:');
console.trace();
pauseFetchingRef.current = false; pauseFetchingRef.current = false;
if (initialFetchCompleteRef.current && !isMountingRef.current && fetchItemsRef.current) { if (initialFetchCompleteRef.current && !isMountingRef.current && fetchItemsRef.current) {
console.log('🔄 Tab became visible - triggering refresh (setting enabled)'); console.error(' ➡️ Calling fetchItems(true) NOW');
fetchItemsRef.current(true); fetchItemsRef.current(true);
} else { } else {
console.log('⏭️ Tab became visible - skipping refresh (initial fetch not complete or mounting)'); console.log(' ⏭️ Skipping refresh (initial fetch not complete or mounting)');
} }
} }
}; };

View File

@@ -335,16 +335,24 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
// Handle page visibility changes - only verify if inactive for >5 minutes // Handle page visibility changes - only verify if inactive for >5 minutes
const handleVisibilityChange = () => { const handleVisibilityChange = () => {
const timeSinceLastCheck = Date.now() - lastVisibilityVerificationRef.current;
const FIVE_MINUTES = 5 * 60 * 1000;
console.log('🔐 [AUTH] Visibility changed', {
state: document.visibilityState,
timeSinceLastCheck: Math.round(timeSinceLastCheck / 1000) + 's',
willVerifySession: document.visibilityState === 'visible' && timeSinceLastCheck > FIVE_MINUTES
});
if (document.visibilityState === 'visible') { if (document.visibilityState === 'visible') {
const timeSinceLastCheck = Date.now() - lastVisibilityVerificationRef.current;
const FIVE_MINUTES = 5 * 60 * 1000;
if (timeSinceLastCheck > FIVE_MINUTES) { if (timeSinceLastCheck > FIVE_MINUTES) {
authLog('[Auth] Tab visible after 5+ minutes, verifying session'); authLog('[Auth] Tab visible after 5+ minutes, verifying session');
console.log(' ⚠️ Verifying session - this may cause component re-renders');
lastVisibilityVerificationRef.current = Date.now(); lastVisibilityVerificationRef.current = Date.now();
verifySession(); verifySession();
} else { } else {
authLog('[Auth] Tab visible, session recently verified, skipping'); authLog('[Auth] Tab visible, session recently verified, skipping');
console.log(' ✅ Session recently verified, skipping verification');
} }
} }
}; };