TypeError: Cannot read property 'isSupported' of undefined

[rdrnt]

Hi!

I'm running into this error when trying to use react-native-touch-id on iOS 11.4 in the simulator.

I've followed the install guides, I've done:

1. ran yarn add react-native-touch-id
2. ran react-native link react-native-touch-id
3. I added the needed keys to my Info.plist

And here is my code:

import React from 'react';
import { View, Text } from 'react-native';
import TouchID from 'react-native-touch-id';

class PrivateView extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    TouchID.isSupported()
      .then(biometryType => {
        // Success code
        if (biometryType === 'FaceID') {
          console.log('FaceID is supported.');
        } else {
          console.log('TouchID is supported.');
        }
      })
      .catch(error => {
        // Failure code
        console.log(error);
      });
  }

  render() {
    return (
      <View>
        <Text>Testing</Text>
      </View>
    );
  }
}

export default PrivateView;

• Using react-native version 0.54.4
• Using react-native-touch-id version 4.0.1,

Thank you!

[zibs]

I'm not able to reproduce, and I'm running the same versions, are you sure you've linked the package correctly? What happens is you just log TouchID?

[rdrnt]

Thanks for the reply!

I've ran react-native link, and it's linked. I've also deleted node_modules, ran yarn, and then re-linked and same result.

If I log TouchID, I get:

Object {
   isSupported: function, 
   authenticate: function
}

[R10burning]

i get the same issue but ican run correctly on android

[R10burning]

I can also run correctly in a single demo (ios11.4 ) but i put it into my project it does't work

[R10burning]

@rdrnt have u solved it ?

[rdrnt]

Nope, sorry.

[R10burning]

@rdrnt hey man I finally solved this issue by do these steps: (react-native-link doen't work on ios) Manual Configuration iOS In XCode, in the project navigator, right click Libraries ➜ Add Files to [your project's name] Go to node_modules ➜ react-native-touch-id and add TouchID.xcodeproj In XCode, in the project navigator, select your project. Add libTouchID.a to your project's Build Phases ➜ Link Binary With Libraries and then rebuild
it works for me !

[rdrnt]

@R10burning Still not working for me.

EDIT: I don't know exactly what I did, but after re-cloning the project and following the steps @R10burning did, it seems to be working. I'll keep this issue open, feel free to close it though.

[R10burning]

. . . .

[MrLich]

@R10burning thanks for your comment ...it runs in the first executing after reading your comment.

[MrLich]

on Androi still bug "cannot read property 'isSupported' of undefined"

[AmazingBeerBelly]

I have same error before and I solved it now.

Edit the MainApplication.java: import com.rnfingerprint.FingerprintAuthPackage;

add new FingerprintAuthPackage() in the getPackages() function

[MrLich]

thanks you - I have removed to finger of hieuvp but touch id has been done so that I will use TouchID.... thanks for your help . I find all of project but not found import and newFinger huhu

2018-07-11 18:50 GMT+07:00 Zhongwei Shi [email protected]:

I have same error before and I solved it now.

Edit the MainApplication.java: import com.rnfingerprint.FingerprintAuthPackage;

add new FingerprintAuthPackage() in the getPackages() function

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/naoufal/react-native-touch-id/issues/128#issuecomment-404141629, or mute the thread https://github.com/notifications/unsubscribe-auth/AZFOwyYnqvymcIwFAci3LZVZHA4B0vgTks5uFeaFgaJpZM4Ui2Le .

[MrLich]

how to hide button which has name 'input Passcode' that above button "cancel' :( please help me.

2018-07-11 23:17 GMT+07:00 NgocLich Tran [email protected]:

thanks you - I have removed to finger of hieuvp but touch id has been done so that I will use TouchID.... thanks for your help . I find all of project but not found import and newFinger huhu

2018-07-11 18:50 GMT+07:00 Zhongwei Shi [email protected]:

I have same error before and I solved it now.

Edit the MainApplication.java: import com.rnfingerprint.FingerprintAuthPackage;

add new FingerprintAuthPackage() in the getPackages() function

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/naoufal/react-native-touch-id/issues/128#issuecomment-404141629, or mute the thread https://github.com/notifications/unsubscribe-auth/AZFOwyYnqvymcIwFAci3LZVZHA4B0vgTks5uFeaFgaJpZM4Ui2Le .

[AmazingBeerBelly]

I have not found the 'Input Passcode' button. Maybe you can read the doc.

I hide the 'Show Passcode' button by setting

const optionalConfigObject = {
  title: "Authentication Required", // Android
  color: "#e00606", // Android,
  fallbackLabel: "" // iOS (if empty, then label is hidden)
}

[MrLich]

I am going try it . thanks you :D

2018-07-12 10:28 GMT+07:00 Zhongwei Shi [email protected]:

I have not found the 'Input Passcode' button. Maybe you can read the doc. https://github.com/naoufal/react-native-touch-id

I hide the 'Show Passcode' button by setting const optionalConfigObject = { title: "Authentication Required", // Android color: "#e00606", // Android, fallbackLabel: "" // iOS (if empty, then label is hidden) }

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/naoufal/react-native-touch-id/issues/128#issuecomment-404378105, or mute the thread https://github.com/notifications/unsubscribe-auth/AZFOw_c1aBCwPv4uFNGc5hg4Dkf6B3Y7ks5uFsJ5gaJpZM4Ui2Le .

[brandons]

I'm still receiving this error on Android using version 4.0.4 and everything appears to be linked correctly. Any other solutions?

at TouchID.android.js:8
at tryCallTwo (core.js:45)
at doResolve (core.js:200)
at new Promise (core.js:66)
at Object.isSupported (TouchID.android.js:7)
at SecuritySettingsScreen.syncPreferences (SecuritySettingsScreen.js:137)
at new SecuritySettingsScreen (SecuritySettingsScreen.js:106)
at constructClassInstance (ReactNativeRenderer-dev.js:6729)
at updateClassComponent (ReactNativeRenderer-dev.js:8810)
at beginWork (ReactNativeRenderer-dev.js:9646)
at performUnitOfWork (ReactNativeRenderer-dev.js:12361)
at workLoop (ReactNativeRenderer-dev.js:12384)
at renderRoot (ReactNativeRenderer-dev.js:12427)
at performWorkOnRoot (ReactNativeRenderer-dev.js:13034)
at performWork (ReactNativeRenderer-dev.js:12951)
at performSyncWork (ReactNativeRenderer-dev.js:12913)
at requestWork (ReactNativeRenderer-dev.js:12799)
at scheduleWorkImpl (ReactNativeRenderer-dev.js:12666)
at scheduleWork (ReactNativeRenderer-dev.js:12622)
at scheduleRootUpdate (ReactNativeRenderer-dev.js:13324)
at _updateContainerAtExpirationTime (ReactNativeRenderer-dev.js:13359)
at Object.updateContainer (ReactNativeRenderer-dev.js:13384)
at Object.render (ReactNativeRenderer-dev.js:14119)
at renderApplication (renderApplication.js:58)
at Object.run (AppRegistry.js:103)
at Object.runApplication (AppRegistry.js:196)
at MessageQueue.__callFunction (MessageQueue.js:353)
at MessageQueue.js:118
at MessageQueue.__guardSafe (MessageQueue.js:316)
at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:117)
at debuggerWorker.js:72

[peeratattt]

I can't run on android, how to ?

[ericketts]

@brandons what was the fix you found?

[chengsam]

I can't got it working on simulator but it works when I use a real device.

[sqlProvider]

Delete app from [simulator/device] and just rebuild guys. It's native module.

[didrikkvanvik]

I believe the issue is due to react-native link. You can try to manually link instead. @R10burning eloquently explained how to do it on ios.

To solve the issue for android I did the following steps:

• Add implementation project(':react-native-touch-id') to your build.gradle file.

• Add this to your MainApplication.java file: - import com.rnfingerprint.FingerprintAuthPackage; - new FingerprintAuthPackage() in your getPackages() list

• Add the following to your settings.gradle file

include ':react-native-touch-id'
project(':react-native-touch-id').projectDir = new File(rootProject.projectDir, '../../../node_modules/react-native-touch-id/android')

• Lastly don't forget to add the following the AndroidManifest.xml: <uses-permission android:name="android.permission.USE_FINGERPRINT" />

Had the same issue, but it works fine now.

[marcelkalveram]

For anyone having issues with the Cocoapod install. Instead of manual linking, you can add the following dependencies to your podfile to make it work:

  pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
  pod 'React', :path => '../node_modules/react-native'

Based on https://github.com/naoufal/react-native-touch-id/issues/157, https://github.com/facebook/react-native/issues/13046#issuecomment-350523190, https://github.com/react-native-community/react-native-svg/issues/621, https://github.com/facebook/react-native/issues/15838#issuecomment-333455341

[luciodale]

I just replied here #33. Anyways, I could solve this problem by inspecting the TouchID object and realizing that to call the functions isSupported() or authenticate("foo") I had to first access the key default.

Calls such as TouchID.default.isSupported().then(...) and TouchID.default.authenticate("foo").then(...) now work for me..

[luciodale]

I believe the issue is due to react-native link. You can try to manually link instead. @R10burning eloquently explained how to do it on ios.

To solve the issue for android I did the following steps:

• Add implementation project(':react-native-touch-id') to your build.gradle file.
• Add this to your MainApplication.java file:
  • import com.rnfingerprint.FingerprintAuthPackage;
  • new FingerprintAuthPackage() in your getPackages() list
• Add the following to your settings.gradle file

include ':react-native-touch-id'
project(':react-native-touch-id').projectDir = new File(rootProject.projectDir, '../../../node_modules/react-native-touch-id/android')

• Lastly don't forget to add the following the AndroidManifest.xml: <uses-permission android:name="android.permission.USE_FINGERPRINT" />

Had the same issue, but it works fine now.

I just went through all of the files and react-native link performed each single step the right way..