Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Drop-in requestPaymentMethod throws postMessage error.

See original GitHub issue

General information

  • SDK/Library version: web/dropin/1.10.0
  • Environment: Sandbox
  • Browser and OS: Chrome 66.0.3359.139 (64-bit) on MacOS 10.12.3

Issue description

I reproduce demo where there is existing bug. When I provide new card data, and execute ‘requestPaymentMethod’ it’s stuck on ‘pending’ state and produce error in console log: hosted-fields-frame.min.html:1 Uncaught (in promise) DOMException: Failed to execute 'postMessage' on 'Window': Invalid target origin 'null' in a call to 'postMessage'. at e.reply.e.reply ( at Code:

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" />
    <title>Braintree payment</title>
    <script src=""></script>
    <div id="dropin-container"></div>
      let createBraintree = () => {
        window.dropinHandler = braintree.dropin.create({
          authorization: 'sandbox_**********************,
          container: '#dropin-container'
        }, function (createErr, instance) {
          window.addEventListener('requestPayment', function () {
            instance.requestPaymentMethod(function (requestPaymentMethodErr, payload) {
              alert('Im in!');


I’m not reach the ‘alert’ code. Validation working perfectly. After I enter valid card (4111…) and execute my event (using console): window.dispatchEvent(new Event('requestPayment')) the error comes.

My code evolve from yesterday, but I sure in 50% that it was working.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:13 (4 by maintainers)

github_iconTop GitHub Comments

crookedneighborcommented, May 25, 2018

You’ll receive that error if you attempt to run this code over the file protocol instead of on a webserver.

If you have npm installed on your machine, you can run that same code over a simple webserver, and it will not error.

npm install --global http-server
# run this in the same directory as your index.html file above

By default, it should run it on localhost:8080, if you try the same thing, then it should work.

PeterNdomanocommented, Nov 4, 2022

If you can spin up an example repo that reproduces it, we’ll be glad to take a look. My guess though is that the console.error you are seeing and the problem you are having are unrelated.

Please open up a new Github issue once you have something for us to look at.

@crookedneighbor My Repo is here

But I just figured out the problem and fixed it. My code was un-mounting the dropin container then replace it with a loader when credit card is submitted.

So you were right before, the console error and the problem I was facing were unrelated.


Read more comments on GitHub >

github_iconTop Results From Across the Web

javascript - Braintree Payments requestPaymentMethod hangs
There is no error - the debugger shows the dropinInstance.requestPaymentMethod() call being made, but never returns. I think the issue is with ...
Read more >
JavaScript error with Ruby 3.1 and latest commit - Jumpstart Pro
Hi, I recently merged the latest Jumpstart commits and updated to Ruby 3.1 but I can't get the JavaScript to work in production...
Read more >
braintree-web-drop-in - Documentation
There are two ways to integrate Drop-in into your page: a script tag ... If the tokenization is unsuccessful, a relevant error will...
Read more >
Falcon Sandbox v8.30 © Hybrid Analysis
requestPaymentMethod (function(e,t){e||(u("payment_method_nonce",t.nonce,o),t.deviceData&&u("device_data",t. ... dropin-error":132,". ... postMessage(t,n) ...
Read more >
Shuttle - API
A message SETUP_ERROR will indicate an error has occurred in the setup ... Login + request payment method for immediate use, ie where...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found