braintree-web-drop-in: Placeholder text on Dropin form appears encoded incorrectly

General information

  • SDK/Library version: 1.4.0
  • Environment: Sandbox
  • Browser and OS Tested across all standard up to date browsers in Windows 7 and Ubuntu 14.04

Issue description

Greetings,

I am in the process of migrating from hosted fields to Dropin V3. The only issue I cannot seem to get resolved is the placeholder text appears to have an encoding issue.

Note the placeholder below. It is a similar case on the CVV field.

<input type="tel" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" class="number" data-braintree-name="number" name="credit-card-number" id="credit-card-number" maxlength="22" placeholder="•••• •••• •••• ••••" aria-invalid="true">

Please let me know if I can provide any other app specific details that might be helpful. Coffeescript:

  braintree.dropin.create {
    authorization: gon.client_token
    container: '#dropin-container'
    locale: 'en_US'
  }, (createErr, instance) ->
    form.addEventListener 'submit', (event) ->
      event.preventDefault()
      instance.requestPaymentMethod (err, payload) ->
        if err
          console.log 'Error', err
          return
        # Add the nonce to the form and submit
        document.querySelector('#nonce').value = payload.nonce
        form.submit()
        return
      return
    return

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 18 (8 by maintainers)

Most upvoted comments

I had the same problem when I manually copied the dropin.min.js file and pasted it locally. Calling straight from the cdn or downloading it and saving has fixed the issue originally described for me.

<script src="https://js.braintreegateway.com/web/dropin/1.11.0/js/dropin.min.js"></script>