"Choose another way to pay" unclickable after payment about braintree-web-drop-in

[Beastw00d]

This is what I mean by unclickable.

[crookedneighbor]

Do you have a staging site we can examine? Or a sample site on Github that reproduces the behavior?

[Beastw00d]

I don't. Ill try wire one up today.

[Beastw00d]

@crookedneighbor I've made a sample of what we are trying to achieve.

1. Code: https://github.com/Beastw00d/beastw00d.github.io/blob/master/index.html
2. Page: https://beastw00d.github.io/

Unfortunately this doesn't recreate the issue because it only happens when there is at least one saved credit card and I would have to set up a server to do that. I've started to think it is happening because the modal is hidden away (loaded in DOM) and the drop-in UI is created on that hidden modal right on the page load. I've been able to fix it in the real code by wiring up the create on the modal opening. The only problem with this is it makes the modal jump in size because it will take half a second start loading.
$('#braintree.modal').one('shown.bs.modal', function() { var button = document.querySelector('#submit-button'); braintree.dropin.create({..}); });

With that being said do you think this is improper use of the drop-in UI and more of an issue with using bootstrap/modals and that I should close the issue?

[crookedneighbor]

Thanks for creating the page. I used Chrome dev tools to insert a client token with saved payment methods to test it.

Okay, so I think the problem is in the transition helper library: https://github.com/braintree/braintree-web-drop-in/blob/7b96efab4d64e8257d504f11b7195e2a540f14e4/src/lib/transition-helper.js

I think that since you have the modal hidden, the loading div never gets properly cleaned up. We'll look into fixing this. Thanks for reporting it!