xtablo-source/docs/TESTING_WITH_FAKE_ACCOUNTS.md

🎭 Testing Stripe with Fake Accounts - Super Simple Guide

🚀 Quick Start (5 Minutes)

Step 1: Make Sure Stripe Test Mode is ON

In Stripe Dashboard, ensure you're in TEST MODE (toggle in top-right corner should say "Test mode").

Step 2: Create "Standard" Product in Stripe

1. Go to Products in Stripe Dashboard
2. Click Add product
3. Name: Standard
4. Monthly price: €9.99/month
5. Click Add product
6. Copy the price ID (looks like price_1O7...)
7. Add to apps/main/.env:

   VITE_STRIPE_STANDARD_MONTHLY_PRICE_ID=price_YOUR_ID_HERE
   

Step 3: Start Everything

Terminal 1 - API:

cd apps/api
npm run dev

Terminal 2 - Frontend:

cd apps/main
npm run dev

Terminal 3 - Stripe Webhooks:

stripe listen --forward-to http://localhost:3000/api/v1/stripe/webhook

Copy the webhook secret (whsec_...) and add to api/.env:

STRIPE_WEBHOOK_SECRET=whsec_YOUR_SECRET_HERE

Restart your API (Terminal 1).

Step 4: Create Fake Test Accounts

Create 3 test users in your app:

Account 1: Free User (stays free)

Email: free.user@test.com
Password: TestPass123!
Name: Free User

Account 2: Premium User (will subscribe)

Email: premium.user@test.com
Password: TestPass123!
Name: Premium User

Account 3: Canceling User (subscribe then cancel)

Email: cancel.user@test.com
Password: TestPass123!
Name: Cancel User

🧪 Testing Scenarios

Test 1: Free User ✅

1. Login as free.user@test.com
2. Go to Settings
3. You should see:
   • Badge: "Gratuit"
   • Message: "Passez à Standard..."
   • Button: "Passer à Standard"

Verify in database:

SELECT email, is_paying, subscription_tier 
FROM profiles 
WHERE email = 'free.user@test.com';
-- Should show: is_paying = false, subscription_tier = 'free'

Test 2: Subscribe to Standard 💳

1. Login as premium.user@test.com

2. Go to Settings

3. Click "Passer à Standard"

4. In Stripe Checkout, enter:

   Email: premium.user@test.com
   Card: 4242 4242 4242 4242
   Expiry: 12/34
   CVC: 123
   Name: Premium User
   

5. Click Subscribe

6. Watch Terminal 3 - You should see:

   ✓ customer.created
   ✓ customer.subscription.created
   ✓ invoice.created
   ✓ invoice.paid
   ✓ payment_intent.succeeded
   

7. You'll be redirected back to Settings

8. You should see:

   • Badge: "Actif" (green)
   • Message: "Plan Standard"
   • Renewal date displayed
   • Buttons: "Gérer l'abonnement" and "Annuler"

Verify in database:

-- Check profile updated
SELECT email, is_paying, subscription_tier 
FROM profiles 
WHERE email = 'premium.user@test.com';
-- Should show: is_paying = true, subscription_tier = 'standard'

-- Check subscription exists
SELECT status, current_period_end, cancel_at_period_end 
FROM stripe_subscriptions 
WHERE user_id = (SELECT id FROM profiles WHERE email = 'premium.user@test.com');
-- Should show: status = 'active', cancel_at_period_end = false

-- Check customer exists
SELECT * FROM stripe_customers 
WHERE email = 'premium.user@test.com';

Test 3: Customer Portal 🏪

1. Still logged in as premium.user@test.com
2. Click "Gérer l'abonnement"
3. Opens Stripe Customer Portal where you can:
   • View/download invoices
   • Update payment method
   • View subscription details
   • Cancel subscription

Test 4: Cancel Subscription ❌

1. In your app (as cancel.user@test.com)
2. Subscribe first (follow Test 2)
3. Click "Annuler" button
4. Watch Terminal 3:

   ✓ customer.subscription.updated
   

5. You should see:
   • Orange warning: "Abonnement en cours d'annulation"
   • Message: "Sera annulé le [date]"
   • Button: "Réactiver l'abonnement"

Verify in database:

SELECT cancel_at_period_end, current_period_end 
FROM stripe_subscriptions 
WHERE user_id = (SELECT id FROM profiles WHERE email = 'cancel.user@test.com');
-- Should show: cancel_at_period_end = true

-- Note: is_paying should STILL be true until period ends
SELECT is_paying FROM profiles WHERE email = 'cancel.user@test.com';
-- Should show: is_paying = true (until period_end)

Test 5: Reactivate Subscription ↩️

1. Click "Réactiver l'abonnement"
2. Watch Terminal 3:

   ✓ customer.subscription.updated
   

3. Should return to normal active state

Verify in database:

SELECT cancel_at_period_end 
FROM stripe_subscriptions 
WHERE user_id = (SELECT id FROM profiles WHERE email = 'cancel.user@test.com');
-- Should show: cancel_at_period_end = false

🎯 Quick Verification Script

Run this in Supabase SQL Editor after testing:

-- View all test users and their subscriptions
SELECT 
  p.email,
  p.is_paying,
  p.subscription_tier,
  s.status as sub_status,
  s.cancel_at_period_end as canceling,
  to_char(s.current_period_end, 'YYYY-MM-DD') as expires
FROM profiles p
LEFT JOIN stripe_subscriptions s ON s.user_id = p.id
WHERE p.email LIKE '%test.com'
ORDER BY p.created_at DESC;

Expected results:

free.user@test.com     | false | free     | null   | null  | null
premium.user@test.com  | true  | standard | active | false | 2025-12-02
cancel.user@test.com   | true  | standard | active | true  | 2025-12-02

🎴 Test Card Cheat Sheet

Scenario	Card Number	Use For
✅ Success	4242 4242 4242 4242	Normal subscription
❌ Decline	4000 0000 0000 0002	Test payment failure
💳 3D Secure	4000 0027 6000 3184	Test authentication
🏦 Insufficient	4000 0000 0000 9995	Test insufficient funds

For all cards:

• Expiry: Any future date (e.g., 12/34)
• CVC: Any 3 digits (e.g., 123)
• ZIP: Any 5 digits (e.g., 12345)

🐛 Troubleshooting

"Passer à Standard" button doesn't work

Check:

// In browser console:
console.log(import.meta.env.VITE_STRIPE_STANDARD_MONTHLY_PRICE_ID);
// Should show: price_xxxxx

If undefined, add to apps/main/.env and restart frontend.

Webhook not received

Terminal 3 should show:

⣾ Ready! Your webhook signing secret is whsec_xxxxx

If not, run:

stripe listen --forward-to http://localhost:3000/api/v1/stripe/webhook

is_paying not updating

Check webhook was processed:

# In Terminal 3, you should see:
✓ customer.subscription.created [200]

Manually trigger update:

-- Force update profile
UPDATE profiles 
SET is_paying = true, subscription_tier = 'standard'
WHERE email = 'premium.user@test.com';

Can't see SubscriptionCard

Add to settings.tsx:

import { SubscriptionCard } from "../components/SubscriptionCard";

// In the cards section:
<SubscriptionCard />

✅ Success Checklist

After testing all 3 accounts, you should have:

• Free user shows upgrade prompt
• Premium user shows active subscription
• Webhook events appear in Terminal 3
• Database shows correct subscription data
• is_paying updates automatically
• Can cancel subscription
• Cancellation shows warning
• Can reactivate subscription
• Customer portal opens correctly
• Each user only sees their own data

🎉 You're Done!

If all checks pass, your Stripe integration is working perfectly!

Next steps:

1. Test with more edge cases (different cards, failed payments)
2. Add subscription checks to premium features
3. Build pricing page
4. Prepare for production deployment

🔗 More Information

• Complete Setup: docs/STRIPE_SETUP.md
• Quick Reference: docs/STRIPE_QUICK_REFERENCE.md
• Detailed Testing: docs/STRIPE_TESTING_GUIDE.md
• API Documentation: docs/STRIPE_IMPLEMENTATION_SUMMARY.md

---

Pro Tip: Keep these test accounts for future testing. You can reset them by deleting subscriptions in Stripe Dashboard (Test Mode → Subscriptions).