Uploaded image for project: 'Red Hat 3scale API Management'
  1. Red Hat 3scale API Management
  2. THREESCALE-4963

Braintree errors are not surfaced in the 3scale developer portal

    XMLWordPrintable

Details

    • No
    • Hide

      Log in to a customer developer portal (eg: john::123456)
      Go to edit payment details (https://3scale-developer-portal.example.com/admin/account/braintree_blue/edit)
      Fill out the form but ignore the pre-filled Number and CVV fields
      Click Save Details

      Show
      Log in to a customer developer portal (eg: john::123456) Go to edit payment details ( https://3scale-developer-portal.example.com/admin/account/braintree_blue/edit ) Fill out the form but ignore the pre-filled Number and CVV fields Click Save Details

    Description

      When a customers end-user attempts to update their CC details for a Braintree integration and there is an error (eg: invalid CVV) the form silently fails with the fault only available in the developer console as a fault object.
      https://3scale-developer-portal.example.com/admin/account/braintree_blue/edit

      1) the form has extremely confusing "placeholder" values. It shows 4111 1111 1111 1111, a CVV of 123 and Expiry MM/YY.

      2) The form lets you submit without having entered Credit Card details - see example

      3) Errors from BrainTree aren't being displayed; they are just dumped with console.error() For example, enter a wrong credit card number (8484 8484 8484 8484) - the form doesn't properly submit and no error is shown to the customer - A generic "card details could not be saved" banner appears at the top of the page but is easy to miss.

      4) If you enter a wrong credit card number (8484 8484 8484 8484) (as in point #3) and submit it, validation fails BUT even if you change the number, the form won't submit again - the Save Details button is greyed out and pressing ENTER does nothing. If you enter the wrong details you have to reload the whole page.

      5) Even though the credit card details can't be saved because they're not valid, the rest of the details: first name, last name, company, address etc should still all be saved. Having to reenter these details is a very poor user experience for customers.

      Example faults:

      {
        "name": "BraintreeError",
        "code": "HOSTED_FIELDS_FIELDS_INVALID",
        "message": "Some payment input fields are invalid. Cannot tokenize invalid card fields.",
        "type": "CUSTOMER",
        "details": {
          "invalidFieldKeys": [
            "number",
            "cvv"
          ],
          "invalidFields": {
            "number": {},
            "cvv": {}
          }
        }
      }
      

      Attachments

        1. braintree.png
          braintree.png
          181 kB
        2. stripe.png
          stripe.png
          103 kB
        3. image-2021-08-09-15-34-31-248.png
          image-2021-08-09-15-34-31-248.png
          158 kB
        4. 02.png
          02.png
          167 kB
        5. 01.png
          01.png
          279 kB
        6. 2021-09-14_14-43.png
          2021-09-14_14-43.png
          106 kB
        7. 2021-09-14_14-41.png
          2021-09-14_14-41.png
          106 kB

        Issue Links

          Activity

            People

              Unassigned Unassigned
              rhn-support-ahobson Aimi Hobson
              Alessandro Contini Alessandro Contini
              Damian Peralta Damian Peralta (Inactive)
              Damian Peralta Damian Peralta (Inactive)
              Jakub Smolár Jakub Smolár
              Votes:
              2 Vote for this issue
              Watchers:
              9 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved: