Verification Checklist

Work through this checklist in order. Each step builds on the previous one. Do not move to the next item until the current one passes — skipping ahead makes bugs harder to locate.

---

Phase 1: Account and Configuration

Razorpay Account

• Razorpay account created at razorpay.com
• Email verified (confirmation link clicked)
• Mobile verified (OTP entered)
• Logged into dashboard — landing on the Home page
• Mode confirmed: Test Mode toggle is active (blue indicator, top right)
• Merchant ID noted from Settings → Profile

API Keys

• Settings → API Keys → "Generate Test Key" clicked
• Key ID copied (starts with rzp_test_)
• Key Secret copied (shown only once — do this now)
• Both keys saved to VaultMate under the project name
• Key ID added to .env.local as NEXT_PUBLIC_RAZORPAY_KEY_ID
• Key Secret NOT in .env.local (it should not appear in this file)
• Supabase secret set: supabase secrets set RAZORPAY_KEY_ID=rzp_test_xxx
• Supabase secret set: supabase secrets set RAZORPAY_KEY_SECRET=xxx
• Verification: supabase secrets list shows both keys (values masked — this is correct)

.gitignore Check

• .env.local is listed in .gitignore
• git status does not show .env.local as a file to be committed

---

Phase 2: Edge Function Deployment

Create Payment Order

• supabase/functions/create-payment-order/index.ts exists
• Function reads RAZORPAY_KEY_ID and RAZORPAY_KEY_SECRET from Deno.env.get()
• Amount is read from the database, not from the request body
• Function inserts a record into payment_transactions table with status: 'pending'
• Function deployed: supabase functions deploy create-payment-order
• Deployment confirmed: supabase functions list shows the function

Verify Payment

• supabase/functions/verify-payment/index.ts exists
• HMAC-SHA256 signature verification is implemented
• Function updates payment_transactions to status: 'completed'
• Function updates fee_records to status: 'paid'
• Function deployed: supabase functions deploy verify-payment

Webhook (if configured)

• supabase/functions/razorpay-webhook/index.ts exists
• Webhook secret generated and saved to VaultMate
• Supabase secret set: supabase secrets set RAZORPAY_WEBHOOK_SECRET=xxx
• Webhook registered in Razorpay Dashboard → Settings → Webhooks
• Webhook URL matches the deployed edge function URL exactly
• payment.captured and payment.failed events are subscribed
• Function deployed: supabase functions deploy razorpay-webhook

---

Phase 3: Frontend Integration

• Razorpay Checkout SDK loaded: <Script src="https://checkout.razorpay.com/v1/checkout.js" /> in layout
• rupeesToPaise() helper function defined in src/lib/razorpay.ts
• openRazorpayModal() function uses process.env.NEXT_PUBLIC_RAZORPAY_KEY_ID (not hardcoded)
• PaymentButton component calls create-payment-order edge function via supabase.functions.invoke
• handler callback calls verify-payment edge function with all three Razorpay IDs
• modal.ondismiss callback is set to handle user cancellation

---

Phase 4: End-to-End Test Payment

This is the final test. Run through the complete flow as a real customer would.

Before Running the Test

• A test fee record exists in your database with status: 'pending'
• The fee record has a real amount (e.g., ₹2,500 — a monthly tuition fee)
• You are logged in as a test parent in the app
• Browser console is open (F12 → Console tab)
• Razorpay Dashboard → Orders tab is open in another tab

Executing the Test Payment

1. Click the Pay Now button on the fee payment screen
2. Observe the Razorpay modal opens over your page
3. Select Credit/Debit Card as the payment method
4. Enter the test card:
   • Card number: 4111 1111 1111 1111
   • Expiry: any future date (e.g., 12/29)
   • CVV: any 3 digits (e.g., 123)
   • Name: any name
5. Click Pay
6. If prompted for OTP: enter any 6 digits (e.g., 123456)
7. Payment should complete — modal closes

Verification Points After the Test Payment

In Razorpay Dashboard:

• Dashboard → Orders: a new order appears with your fee record ID as the receipt
• Dashboard → Transactions: a payment with status "Captured" appears
• The payment amount matches the fee amount from the database (check it is ₹2,500, not ₹25.00)
• The payment ID (starts with pay_) is visible

In your database:

Expected result in payment_transactions:

• A row with status: 'completed'
• provider_payment_id is populated (not null)
• amount matches the fee amount from fee_structures

Expected result in fee_records:

• Your test fee record appears with status: 'paid'
• payment_id matches the Razorpay payment ID
• paid_at is populated

In your app:

• The fee payment confirmation screen is shown to the user
• No error messages appear
• Browser console shows no errors

---

Phase 5: Failure Scenario Test

Test that failures are handled correctly too.

1. Click Pay Now on another test fee record
2. In the Razorpay modal, enter the failure test card: 4000 0000 0000 0002
3. Expiry: any future date, CVV: any 3 digits
4. Click Pay

Expected behaviour:

• Razorpay modal shows a payment failure message
• Your app's onFailure callback fires
• Parent sees an appropriate error message (not a white screen or spinner stuck forever)
• Fee record status in database remains pending (not corrupted)

---

Phase 6: UPI Test

1. Click Pay Now on another test fee record
2. In the Razorpay modal, select UPI
3. Enter success@razorpay as the UPI ID
4. Click Pay

Expected behaviour:

• Razorpay simulates a UPI payment request
• Payment completes successfully
• Fee record status updates to paid in database

Then repeat with failure@razorpay to test the failure path.

---

Common Issues and Fixes

---

Reconciliation Spot Check

Once the test payment passes, do this three-way reconciliation as a CA would:

All four values align across all three sources. This is what a clean payment implementation looks like.

---

You Are Done When

• Test payment with a card completes end-to-end
• Test payment with UPI (success@razorpay) completes end-to-end
• Failure scenario leaves fee record in the correct pending state
• All three database checks pass (payment_transactions + fee_records + Razorpay dashboard)
• No hardcoded keys anywhere in the codebase (git grep rzp_test_ returns nothing)
• Both API keys are in VaultMate

At this point your Razorpay integration is complete and production-ready (pending Live Mode activation when you go live with a real client).