Workaround for click event firing after marker drag event in Leaflet

HTML

<script src="//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<link rel="stylesheet" href="//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css">
<script src="https://www.paypalobjects.com/api/checkout.js"></script>

<div id="paypal-button"></div>

CSS

html,
body,
#map {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

JavaScript

paypal.Button.render({
  env: 'production',
  client: {
    production: 'AfAjgKbO-BazjJyvt0143JeI9es9-0ymsVn57ss54WnJ6k7btu1c2lKnwP-YViyZ_Rl7_VGObHc0DjE1',
  lang: 'id'
  },
  payment: function (data, actions) {
    return actions.payment.create({
      transactions: [{
        amount: {
          total: '0.01',
          currency: 'USD'
        }
      }]
    });
  },
  onAuthorize: function (data, actions) {
  console.log(actions);
    return actions.payment.execute()
      .then(function () {
        window.alert('Thank you for your purchase!');
      });
  }
}, '#paypal-button');