yp.js: Sandbox & Testing

The sandbox lets you test the full payment flow without real money.

yp.js detects sandbox mode from the token. When your server creates the token with sandbox keys, the form runs in sandbox mode. You do not pass a flag.

Note: Sandbox keys are separate from live keys. Find them on the settings page. They use the format pub_sandbox_xxx and pri_sandbox_xxx.

Create a Sandbox Token

Your server creates the token against the sandbox base URL, with your sandbox private key.

curl --location --request POST 'https://youcanpay.com/sandbox/api/tokenize' \
  --header 'Accept: application/json' \
  --form 'amount="2500"' \
  --form 'currency="MAD"' \
  --form 'pri_key="pri_sandbox_xxx"' \
  --form 'order_id="order-123"'

Render the Form

Use the sandbox token and your sandbox public key. The form detects the mode.

const payment = yp('pub_sandbox_xxx', { locale: 'en' })
  .elements({ token: 'token_xxx', container: '#payment' });

payment.mount();

Test Mode Badge

In the sandbox the form shows a SANDBOX badge, so you can tell it apart from live mode.

3DS in the Sandbox

When a test card uses 3DS, the form opens a modal that simulates the bank verification. Approve or reject the challenge to test both paths. In live mode this step uses the bank's own page in a popup or a redirect.

Test Cards

Use any future expiry date in MM/YY format, and any CVV. The outcome depends only on the card number. Only the numbers below work in the sandbox. Any other number returns a card_not_accepted error.

Successful payments

Card number	Brand	Behaviour
4242 4242 4242 4242	Visa	Succeeds. No 3DS.
4000 0000 0000 3220	Visa	Requires 3DS. Succeeds after you approve the challenge.

Failed payments

Card number	Brand	Behaviour
4000 0000 0000 0077	Visa	Declined for insufficient funds. No 3DS.
4000 0084 0000 1629	Visa	Requires 3DS. Declined after the challenge (card rejected).

To test a failed 3DS authentication, use a 3DS card and reject the challenge in the modal. The payment is then canceled.

Go Live

To switch to production:

1. Create the token with live keys, against https://youcanpay.com/api/.
2. Use your live public key in yp().
3. Add your live domain to the allowed hosts in your dashboard payment settings. Otherwise mount() fails with host_not_allowed.