FCM test

frontend/src/components/ProfileModal.jsx

@@ -180,24 +180,50 @@ export default function ProfileModal({ onClose }) {
                 • App is backgrounded when the test fires
               </p>
             </div>
-            <button
-              className="btn btn-primary"
-              disabled={pushTesting}
-              onClick={async () => {
-                setPushTesting(true);
-                setPushResult(null);
-                try {
-                  const { results } = await api.testPush();
-                  setPushResult({ ok: true, results });
-                } catch (e) {
-                  setPushResult({ ok: false, error: e.message });
-                } finally {
-                  setPushTesting(false);
-                }
-              }}
-            >
-              {pushTesting ? 'Sending…' : 'Send Test Notification'}
-            </button>
+            <div className="flex gap-2">
+              <button
+                className="btn btn-primary"
+                style={{ flex: 1 }}
+                disabled={pushTesting}
+                onClick={async () => {
+                  setPushTesting(true);
+                  setPushResult(null);
+                  try {
+                    const { results } = await api.testPush('data');
+                    setPushResult({ ok: true, results, mode: 'data' });
+                  } catch (e) {
+                    setPushResult({ ok: false, error: e.message });
+                  } finally {
+                    setPushTesting(false);
+                  }
+                }}
+              >
+                {pushTesting ? 'Sending…' : 'Test (via SW)'}
+              </button>
+              <button
+                className="btn btn-secondary"
+                style={{ flex: 1 }}
+                disabled={pushTesting}
+                onClick={async () => {
+                  setPushTesting(true);
+                  setPushResult(null);
+                  try {
+                    const { results } = await api.testPush('browser');
+                    setPushResult({ ok: true, results, mode: 'browser' });
+                  } catch (e) {
+                    setPushResult({ ok: false, error: e.message });
+                  } finally {
+                    setPushTesting(false);
+                  }
+                }}
+              >
+                {pushTesting ? 'Sending…' : 'Test (via Browser)'}
+              </button>
+            </div>
+            <div style={{ fontSize: 12, color: 'var(--text-tertiary)', lineHeight: 1.4 }}>
+              <strong>Test (via SW)</strong> — normal production path, service worker shows notification.<br/>
+              <strong>Test (via Browser)</strong> — bypasses service worker; Chrome displays directly.
+            </div>
             {pushResult && (
               <div style={{
                 padding: '10px 12px',

frontend/src/utils/api.js

@@ -170,7 +170,7 @@ export const api = {
   getFirebaseConfig: () => req('GET', '/push/firebase-config'),
   subscribePush: (fcmToken) => req('POST', '/push/subscribe', { fcmToken }),
   unsubscribePush: () => req('POST', '/push/unsubscribe'),
-  testPush: () => req('POST', '/push/test'),
+  testPush: (mode = 'data') => req('POST', `/push/test?mode=${mode}`),
 
   // Link preview
   getLinkPreview: (url) => req('GET', `/link-preview?url=${encodeURIComponent(url)}`),