## Handle card payment with an Element

`stripe.handleCardPayment(clientSecret: string, element: Element, data?: object)`

*`handleCardPayment` has been renamed to [confirmCardPayment](#stripe_confirm_card_payment).
In addition to the rename, we have slightly modified the arguments.
These changes do not affect the behavior of the method.
While we have no plans to ever remove support for `handleCardPayment`, we think the new name and arguments are easier to understand and better convey what the method is doing.*

Use `stripe.handleCardPayment(clientSecret, element, data?)` when the customer submits your payment form.
It will gather payment information from the element, which can be a `card` or `cardNumber` element, along with any other data you provide.
It will then confirm the `PaymentIntent` and carry out 3DS or other `next_action`s if they are required.

If you are using [Dynamic 3D Secure](https://docs.stripe.com/payments/3d-secure.md#three-ds-radar), `handleCardPayment` will trigger your Radar rules to execute and may open a dialog for your customer to authenticate their payment.

> Note that `stripe.handleCardPayment` may take several seconds to complete.
> During that time, you should disable your form from being resubmitted and show a waiting indicator like a spinner.
> If you receive an error result, you should be sure to show that error to the customer, re-enable the form, and hide the waiting indicator.
> 
> Additionally, `stripe.handleCardPayment` may trigger a [3D Secure](https://docs.stripe.com/payments/3d-secure.md) authentication challenge.
> This will be shown in a modal dialog and may be confusing for customers using assistive technologies like screen readers.
> You should make your form accessible by ensuring that success or error messages are clearly read out after this method completes.

- `clientSecret`
  The [client secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) of the `PaymentIntent`.

- `element`
  A `card` or `cardNumber` [Element](https://docs.stripe.com/js/element.md) that will be used to create a payment method.

- `data`
  Data to be sent with the request.
    - `payment_method_data`
      Use this parameter to supply additional data relevant to the payment method, such as billing details.
      - `billing_details`
        The [billing details](https://docs.stripe.com/api/payment_methods/create.md#create_payment_method-billing_details) associated with the card.
    - `shipping`
      The [shipping details](https://docs.stripe.com/api/payment_intents/confirm.md#confirm_payment_intent-shipping) for the payment, if collected.
    - `receipt_email`
      Email address that the receipt for the resulting payment will be sent to.
    - `setup_future_usage`
      Indicates that you intend to make future payments with this [PaymentIntent](https://docs.stripe.com/api/payment_intents.md)'s payment method.

If present, the `PaymentMethod` used with this PaymentIntent can be [attached to a Customer](https://docs.stripe.com/api/payment_methods/attach.md), even after the transaction completes.

Use `on_session` if you intend to only reuse the `PaymentMethod` when your customer is present in your checkout flow.
Use `off_session` if your customer may or may not be in your checkout flow.
See [saving card details during payment](https://docs.stripe.com/payments/cards/saving-cards-after-payment.md) to learn more.

Stripe uses `setup_future_usage` to dynamically optimize your payment flow and comply with regional legislation and network rules.
For example, if your customer is impacted by SCA, using `off_session` will ensure that they are authenticated while processing this PaymentIntent.
You will then be able to collect [off-session payments](https://docs.stripe.com/payments/cards/charging-saved-cards.md#off-session-payments-with-saved-cards) for this customer.

### Example

```title
Handle a card payment
```