JavaScript SDK Smart Buttons Guest Checkout users must enter card information twice

[JoePerkins]

When using Smart buttons from the JavaScript SDK and during guest checkout the user is required to enter card information twice.

Sets to reproduce, using the PayPal online example: https://developer.paypal.com/demo/checkout/#/pattern/client

1. Click the PayPal (yellow pay now) button and then the new PayPal window opens.
2. Click the gray "Pay with Debit or Credit Card", this navigates to the "PayPal Guest Checkout" page.
   (https://www.sandbox.paypal.com/checkoutweb/signup?...)
3. Enter billing and card information and click "Continue", this navigates to a new "PayPal Guest Checkout" page after a very long wait.
   (https://www.sandbox.paypal.com/webapps/xoonboarding?...)
4. The user must again billing and card information and click "Pay Now" and completes successfully. 

I have deployed a similar staging implementation and have the same results, how do I prevent the need for the user to enter the exact same information twice?  

I've tried setting the application_context user_action below as documented but results in a PayPal 400 server error when clicking the Smart Button.

application_context: {
                        shipping_preference: 'NO_SHIPPING',
                        user_action: "commit"
                    }

Payments (paypal.com)

application_context

• brand_name

  string

  A label that overrides the business name in the merchant's PayPal account on the PayPal checkout pages.

  Maximum length: 127.

• locale

  string

  The locale of pages that the PayPal payment experience displays. Please refer here for list of supported local codes. Defaulted to en_US if not provided or invalid.

• landing_page

  string

  The type of landing page to show on the PayPal site for customer checkout. To use the non-PayPal account landing page, set to Billing. To use the PayPal account log in landing page, set to Login.

• shipping_preference

  enum

  The shipping preference.

  The possible values are:

  • NO_SHIPPING. Redacts the shipping address from the PayPal pages. Recommended for digital goods.
  • GET_FROM_FILE. Uses the customer-selected shipping address on PayPal pages.
  • SET_PROVIDED_ADDRESS. If available, uses the merchant-provided shipping address, which the customer cannot change on the PayPal pages. If the merchant does not provide an address, the customer can enter the address on PayPal pages.
• user_action

  string

  The user action. Presents the customer with either the Continue or Pay Now checkout flow:

  FlowActionDescriptionPay Nowuser_action=commitAfter the customer is redirected to the PayPal payment page, shows the Pay Now button.
  
  Use this option when you know the final amount when checkout is initiated and you want to process the payment immediately when the customer clicks Pay Now.

  Continue

  user_action=continue

  After the customer is redirected to the PayPal payment page, shows the Continue button. Use this option when you do not know the final amount when you initiate the checkout flow and you want to redirect the customer to the merchant page without processing the payment.

• preferred_payment_source

  object

  The preferred payment source for the payer. Currently supported only for PayPal Billing Agreements. If provided, checkout experience will have this payment source pre-selected for the 

[csmmaster]

I'm currently having the same problem and the demo page is also still doing it.

Did this ever get resolved?

Update:

Tested this in production and it works fine. Problems appears to happen only in the sandbox.

[csmmaster]

This problem turned out to be the card number. I was using 4111 1111 1111 1111.

Full disclosure: My problem was not with PayFlow but with the In-Context Express Checkout. Yet, it manifested exactly the same way.

Using the example: https://developer.paypal.com/demo/checkout/#/pattern/client

1. Clicked PayPal button.
2. Clicked Pay with Debit or Credit Card.
   Checkout window loaded with: "https://www.sandbox.paypal.com/checkoutweb/signup?buttonSessionID=..."
   for input of card number, expiration, and CVV as well as billing address. Billing address includes first and last name.
3. Entered card number 4111 1111 1111 1111 and remainder of inputs with any valid data.
4. Clicked Continue.
   Checkout window is loaded with: "https://www.sandbox.paypal.com/webapps/xoonboarding?buttonSessionID=...".
   This is a slightly different card info input page with the first and last name part of the card credentials instead of the billing address.
5. Entered card number 4111 1111 1111 1111, again, along with valid data for the other inputs.
6. Clicked Pay Now.
7. Payment was successful.

Using my In-Context Express Checkout, there was no difference except for the query string parameters of the checkout window URLs.

After step 2, the checkout window was loaded with "https://www.sandbox.paypal.com/checkoutnow?token=..."

After step 4, the checkout window was loaded with "https://www.sandbox.paypal.com/webapps/xoonboarding?token=..."

In both cases, checkout succeeded, without loading the 2nd card input page, if I used a card number created by the Credit Card Generator in my PayPal Developer Dashboard. Only the card number was required using the expiration date and CVV from the card generator did not matter. Any valid values would suffice.

I hope this helps somebody avoid the time-consuming, hair tearing-out, process I went through trying to find help and track down the solution to this problem. Certainly, it would have been more useful to have some kind of error rather than the load of a second input page. But, barring that, try choosing a different card number.

Update:

I have confirmed using 4111 1111 1111 1111 for the card number, in production, works the same way. The second payment fields input page is loaded after completing the input in the first page and clicking "Continue". Clicking "Pay Now" in the second page responds with the message "We weren't able to add this card...".

However, using a card number created using the Card Number Generator (not a valid number in production), the process works correctly, showing the error message after clicking "Continue" on the first page. The second page is never loaded.