Syntax to Obtain Device Data?

[VikR0001]

What's the correct syntax to use with this package in order to obtain device data to send to the server?

I've looked at the Braintree docs recommending that we obtain device data. I'm trying this:

<DropIn
    options={{
        authorization: this.state.clientToken,
        paypal: {
            flow: 'vault'
        },
        dataCollector:{
            kount: true,
            paypal: true
        }
    }}
    onInstance={(instance) => (this.instance = instance)}
/>

...but I haven't yet found a way to observe the device data after the component loads.

What is the correct syntax to use to obtain the device data?

[Cretezy]

Use the instance in the onInstance to create it as per the docs:

onInstance{instance => {
  braintree.dataCollector.create({
    client: instance,
    paypal: true
  }, function (err, dataCollectorInstance) {
    if (err) {
      // Handle error in creation of data collector
      return;
    }
    // At this point, you should access the dataCollectorInstance.deviceData value and provide it
    // to your server, e.g. by injecting it into your form as a hidden input.
    var deviceData = dataCollectorInstance.deviceData;
  });
}}

[VikR0001]

Thanks for this great info! Is there an instance of braintree already loaded by braintree-web-drop-in-react I can access inside onInstance? Alternatively, what is the best npm package to import in order to have access to an instance of braintree?

[Cretezy]

braintree is the imported package (braintree-web most likely), see docs that you linked :smiley:

[VikR0001]

I've got this:

import braintree from "braintree-web";

[.....]

<DropIn
    options={{
        authorization: this.state.clientToken,
        paypal: {
            flow: 'vault'
        },
    }}
    onInstance={(instance) => {
        braintree.dataCollector.create({
            client: instance,
            paypal: true
        }, function (err, dataCollectorInstance) {
            if (err) {
                return;
            }
            var deviceData = dataCollectorInstance.deviceData;
            debugger;
        });
    }
    }
/>

In the browser, on the call to braintree.dataCollector.create, I'm getting:

TypeError: client.getVersion is not a function

What am I leaving out?

[Cretezy]

Ah my bad. dataCollector is on instance as seen from https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/braintree-web-drop-in/index.d.ts#L30

Hopefully that helps!

If not, try but create a new braintree instance (not a braintree-web-drop-in instance, which is what instance is here) and create it separately

I don't know much about the official Braintree API, I don't think I can help you very much, look upstream at braintree-web-drop-in for help