3.3 KiB

Raw Blame History

PWA Disable Test - Mobile Safari Reload Loop Fix

Changes Made

1. Disabled PWA Module (`nuxt.config.ts`)

Commented out @vite-pwa/nuxt module configuration
This eliminates service worker registration
Removes automatic updates and periodic sync

2. Disabled Service Worker Unregistration (`plugins/02.unregister-sw.client.ts`)

Commented out the service worker unregistration logic
Added logging to confirm plugin is disabled

Root Cause Theory

Service Worker Registration/Unregistration Conflict:

PWA module tries to register service worker
Unregister plugin immediately removes it
PWA module detects missing worker and re-registers
Mobile Safari gets confused and reloads page
Infinite loop!

Testing Instructions

Mobile Safari Test (iPhone/iPad)

Clear Safari cache and cookies
Navigate to these pages and verify NO reload loops:
- /signup
- /auth/verify?token=test
- /auth/setup-password?email=test@test.com

Expected Results

Before: Endless page reloads, never fully loads
After: Pages load normally within 2-5 seconds

Console Logs to Look For

🚫 Service worker unregistration plugin disabled (PWA testing)

What's Lost (Temporarily)

PWA installation capability
Offline functionality
Service worker caching
App-like behavior on mobile

Next Steps

If This Fixes the Issue:

Option A: Keep PWA disabled (simplest)
Option B: Configure PWA properly:
- Remove service worker unregistration plugin
- Change registerType from autoUpdate to prompt
- Disable periodicSyncForUpdates
- Add proper service worker lifecycle handling

If Issue Persists:

Check for other causes:
- CSS backdrop-filter issues
- Large background images
- Vue reactivity loops
- Plugin conflicts

Re-enabling PWA (If Issue is Fixed)

// In nuxt.config.ts - Better PWA configuration
["@vite-pwa/nuxt", {
  registerType: 'prompt',          // User-initiated instead of auto
  workbox: {
    globPatterns: ['**/*.{js,css,html,png,svg,ico}'],
    navigateFallback: '/',
    navigateFallbackDenylist: [/^\/api\//]
  },
  client: {
    installPrompt: true,
    periodicSyncForUpdates: false   // Disable automatic sync
  },
  devOptions: {
    enabled: false,                 // Disable in development
    suppressWarnings: true
  }
  // ... rest of manifest config
}]

Rollback Instructions

If you need to revert these changes:

# Restore nuxt.config.ts
git checkout HEAD -- nuxt.config.ts

# Restore service worker plugin  
git checkout HEAD -- plugins/02.unregister-sw.client.ts

Test Results

Date: _______________
Device: _______________
Browser: _______________

/signup loads without reload loop
/auth/verify loads without reload loop
/auth/setup-password loads without reload loop
Form submission works normally
Navigation between pages works normally

Notes:

Conclusion

This simple fix eliminates the service worker conflict that was likely causing the mobile Safari reload loops. If this resolves the issue, we can either keep PWA disabled or implement a proper PWA configuration that doesn't conflict with page loading.

3.3 KiB Raw Blame History