Test Mode

Two approaches: Demo mode (fully simulated, no API key) and Test mode (pk_test_ key, real backend, no real charges).

TSX

// Demo mode -- no API key, fully simulated
<CimplifyProvider>
  {/* isDemoMode === true, no network calls */}
  <CimplifyCheckout demoMode={true} onComplete={(r) => console.log(r)} />
</CimplifyProvider>

// Test mode -- real backend, sandbox payments
<CimplifyProvider client={createCimplifyClient({ publicKey: "pk_test_..." })}>
  <CimplifyCheckout onComplete={(r) => console.log(r)} />
</CimplifyProvider>

Demo Mode vs Test Mode

Feature	Demo Mode	Test Mode
Public key	Empty / not set	`pk_test_...`
API calls	None	Real (sandbox environment)
Business data	Null	Real business info
Products / cart	Simulated	Real data
Checkout	Simulated with artificial delays	Real flow, sandbox payment processor
Orders	Fake order object	Real orders in test environment
Charges	None	None (sandbox)
Use case	Development, prototyping, UI iteration	Integration testing, staging, QA

Setting Up Test Mode

Get a test key from Desk > Settings > Developer.

curl

# .env.local
NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=pk_test_your_public_key

Test Cards

Card Number	Result
`4242 4242 4242 4242`	Successful payment
`4000 0000 0000 0002`	Card declined
`4000 0000 0000 9995`	Insufficient funds

Use any future expiry date, any 3-digit CVV, and any cardholder name.

Test Mobile Money

Phone Number	Result
`0551234567`	Successful payment
`0550000000`	Payment failure

Demo Mode Details

TSX

import { useCimplify } from "@cimplify/sdk/react";

function App() {
  const { isDemoMode, business, isReady } = useCimplify();

  // isDemoMode === true when no publicKey
  // business === null (no API calls)
  // isReady === true (bootstrap skipped)

  return isDemoMode ? <DemoBanner /> : <Shop />;
}

Use demo mode for local development and UI prototyping when you do not need real data. Use test mode for integration testing and staging where you need real API responses, a real cart, and a real checkout flow without actual charges.

Visual Indicators

Indicator	Where
TEST MODE badge	Payment iframe, automatically shown with `pk_test_` keys.
Test-mode notice	Drop-in checkout UI.
Test context label	Orders in dashboard, separate from production.