Once the PaymentGateway plugin is stubbed out, we next want to implement the custom card component so we can prepare to process payments. This component ultimately uses multiple iframes to collect and encrypt payment card data for use in subsequent API requests.
The docs are: Once the PaymentGateway plugin is stubbed out, we next want to implement the Hosted iFrame Tokenizer so we can prepare to process payments. This iframe implementation is different from others in that it's 1) a single iframe that collects the card number, expiration, and CVV and 2) returns a JSON object with the token and validated expiration upon submission.
The docs are: https://docs.adyen.com/payment-methods/cards/custom-card-integration
Implementing this will require a PaymentMethodAddForm PluginForm similar to what's in place in the Braintree Hosted Fields implementation. I'm not entirely sure how we should store the information returned from the gateway, since it really is multiple encrypted fields, not a single token. Taken together, it functions like a token, but I'm not sure we can simply serialize it and stuff it in the payment method's remote ID field given its 256 character limit.
In any case, we don't expect this payment method to be reusable for now. We may need to do something similar to PayPal Smart Payment Buttons and defer the collection of credit card data until the review step if we cannot find a simple way to retain the encrypted data between checkout steps. Perhaps it's something we just store client side in a cookie?
When submitting the payment API request, note that automatic capture is Adyen's default assumption. To make an authorization only payment during checkout, we have to pass a specific parameter in the payment API request per: https://docs.adyen.com/online-payments/capture?tab=one_transaction_2#man...