braintree / braintree-web

A suite of tools for integrating Braintree in the browser
https://developer.paypal.com/braintree/docs/start/hello-client/javascript/v3
MIT License
442 stars 134 forks source link

Hosted Fields create times out on Chrome for Android with Lite Mode enabled #529

Closed dimpey closed 4 years ago

dimpey commented 4 years ago

hostedFields.create times out when Lite Mode is enabled in Chrome on Android, with the following error.

{ "name": "BraintreeError", "code": "HOSTED_FIELDS_TIMEOUT", "message": "Hosted Fields timed out when attempting to set up.", "type": "UNKNOWN" }

This was not an issue in version 3.55.0 of Braintree Web which our app used previously. After turning off Lite Mode and reloading the page hostedFields.create works as expected.

crookedneighbor commented 4 years ago

I wasn't able to reproduce the error on my Samsung android phone.

Is there any indication in the network tab of the developer tools about what piece of the Hosted Fields setup is being blocked (and thus causing the timeout)?

dimpey commented 4 years ago

I wasn't able to reproduce the error on my Samsung android phone.

Is there any indication in the network tab of the developer tools about what piece of the Hosted Fields setup is being blocked (and thus causing the timeout)?

No, no indication in the network tab. I'm fetching a client token from our server, initializing a client instance and then using that instance in hostedFields.create. Just one call to https://payments.sandbox.braintree-api.com/graphql which completes in ~400 ms and then two analytics calls following that which both complete in < 20ms. Then one final analytics call after the hosted fields times out which also completes in < 20ms.

crookedneighbor commented 4 years ago

Are you able to reproduce the problem on this staging site? https://hf-lite-mode.glitch.me/

If you can't, that could indicate something strange with your specific integration. Can you provide a staging site that reproduces the error so I can dig into it?

If you can reproduce the problem on my staging site, I'm not sure where to go from here because it seems to be specific to your device, since it works just fine on mine.

dimpey commented 4 years ago

No the staging site works fine.

I tried some more debugging on my implementation and it turns out it's because I'm showing the card entry form when a user clicks a button so there must be some issue in Lite Mode to do with the rendering/showing of hidden elements. It's nothing to do with Braintree Web. Thanks for trying to reproduce the issue and sorry for wasting your time!