A CVV test UI checks one field: the 3 or 4 digit security code on a payment form. A test passes when the field accepts the correct length, masks the digits, rejects letters, and returns one clear error per failure. Run these tests with sandbox values from the payment processor. Do not use live card data in a test environment.

What the field holds

Visa, Mastercard, and Discover print 3 digits on the back of the card. American Express prints 4 digits on the front. The processor returns a result code after authorization: match, no match, or not processed. Your system stores the code, not the number.

Test cases to run

  1. 3 digits on a Visa test card: accepted.
  2. 4 digits on an Amex test card: accepted.
  3. 2 digits: submit blocked, error shown.
  4. 5 digits: input stops at the max length.
  5. Letters and symbols: rejected at keypress and on submit.
  6. Paste of a 4 digit string into a 3 digit field: handled without a crash.
  7. Empty field on submit: required error shown.
  8. Leading and trailing spaces: trimmed before validation.
  9. Autofill from a saved card: fills the field.
  10. Mobile: numeric keypad opens on focus.
  11. Back button after a failed submit: field keeps its state.
  12. Screen reader: label and error text are read with the field.

Field settings

Use a text input with inputmode="numeric". Do not use type="number". It adds spinner controls and can strip a leading zero. Set a max length of 4, a digit pattern, and autocomplete="cc-csc". Give the field a visible label. A placeholder alone fails accessibility checks.

Error states

Show one message per field. Name the fix, not just the fault. "Enter the 3 digit code from the back of your card" beats "Invalid CVV." Keep the rest of the form filled when the code fails. Move focus to the field with the error. Do not reset the page.

What not to log or store

PCI DSS forbids storing the security code after authorization. Mask the field in logs. Exclude it from analytics, session replay, and error reports. If a support tool records screenshots, mask the input.

Sandbox vs live

Sandbox test values come from the processor and work only in test mode. A pass in sandbox does not prove a fail in production. Test the decline path with the processor's decline test numbers before release.

Acceptance checklist

  • Length rule matches the card brand.
  • Digits only, masked on screen.
  • One error message, plain wording.
  • Keypad on mobile, autofill works.
  • No code in logs or analytics.
  • Focus moves to the failed field.