'LikeView' has no propType 'RCTFBLikeView.onLayout' of native type 'boolean' if you haven't changed this

Question

LikeView has no propType for native prop RCTFBLikeView.onLayout of native type boolean If you haven't changed this prop yourself, this usually means that your versions of the native code and JavaScript code are out of sync. Updating both should make this error go away.

Not sure why I am getting this error. I'm not using LikeView at all in the android app. I've tried running npm start --reset-cache.

Also iOS version of the app runs no problem. This only occurs for android.

Any suggestions welcomed.

Thanks!

Antepenult

Try doing react-native-git-upgrade and see if it updates your android code. – Frith

Got these errors in the upgrade process: npm WARN [email protected] requires a peer of react@^15.0.2 but none was installed. npm WARN [email protected] requires a peer of react@^0.13.0 || ^0.14.0 || ^15.0.0 but none was installed. npm WARN [email protected] requires a peer of react@^15.4.1 but none was installed. – Antepenult

Hmm upgrading from 0.41.2 breaks the iOS side of things too :/... – Antepenult

hmm try react-native-git-upgrade 0.41.2 and make sure 0.41.2 is in your package.json when you npm install – Frith

Still get the same error...but thanks though! any other suggestions?? – Antepenult

This solution I posted works for me perfectly: #45727115 – Bobodioulasso

Answer 1

I figured out that the problem is (as RN points out) a mismatch between the native props and the JS ones on the props that every view uses. Namely:

• renderToHardwareTextureAndroid
• onLayout
• accessibilityLiveRegion
• accessibilityComponentType
• importantForAccessibility
• accessibilityLabel
• testID

Since I am not using any of the views that the package uses, namely:

• FBLikeView
• FBLoginButton
• FBSendButton
• FBShareButton

I tried to set this props as 'native only', so that they are not bound to the JavaScript side. In every component (in the example, FBShareButton.js), I replaced:

const RCTFBShareButton = requireNativeComponent(
    'RCTFBShareButton',
    ShareButton,
);

with

const RCTFBShareButton = requireNativeComponent(
  'RCTFBShareButton',
  ShareButton,
  {
    nativeOnly: {
      onChange: true,
      onLayout: true,
      testID: true,
      importantForAccessibility: true,
      accessibilityLiveRegion: true,
      accessibilityComponentType: true,
      accessibilityLabel: true,
      renderToHardwareTextureAndroid: true,
    }
  },
);

I am now going to check if the views are getting rendered properly and edit my post later, but if you just want to be able to compile your app in order to continue development (as it is my case at the moment), that should let you do so.

Edit

I successfully rendered the LoginButton component using the example in the README with my changes.

Edit 2

I made a pull request with my changes to the package. I don't like the solution, but it might raise FB's attention. In the meantime, you can just use my fork. In your package.json, just replace the fbsdk line with this:

"react-native-fbsdk": "git+https://github.com/motius/react-native-fbsdk.git#fix-views"

This other pull request might be a better solution, actually.

Ostrogoth

Answer 2

Similar to the solution suggested by @martinarroyo, I figured that it has to do with some components that are not synced between the native code and the js code. If you are not using these components, instead of adding the nativeOnly property in every js file you use it, I commented out the exports from the react-native-fbsdk index.js as follows:

//native components
// exports.LikeView = require('./FBLikeView');
// exports.LoginButton = require('./FBLoginButton');
// exports.SendButton = require('./FBSendButton');
// exports.ShareButton = require('./FBShareButton');

Obviously this is just a workaround but that should get you through that error

Tass

THis worked great! Thanks. Just a small question -- what's the exact issue which triggered this for you? mine was adding a completely unrelated third party location module. – Champagne

Answer 3

You can downgrade react-native-fbsdk to 0.5.1 to avoid this issue until a fix has been merged into a new version.

Gisborne

Answer 4

So after countless experimentation and banging my head on the table, i think the solution was the versioning of the dependency.

Here's a list of things I attempted and the one I think that resolved the issue is marked with an * because I'm not 100% sure if it was this step that resolved it.

1. removing node_modules folder and reinstalling it.
2. doing the react-native-git-upgrade as @matt suggested
3. reinstalled react-native-fbsdk multiple times following the instructions and double checking the code.
4. changing the buildToolsVersion & targetSdkVersion to 25. 5**. ultimately running react-native uninstall react-native-fbsdk followed by react-native install [email protected].

Note* number 5 was attempted throughout the past two days..yet only now it worked...So I don't know what black magic it is that caused it to work just now...

The issue with number 5 is that prior to yesterday the fbsdk dependency version was 0.5.0 and as of yesterday, it was upgraded to 0.6.0. SO I am not sure why even though I reinstalled it yesterday too, it did not fix the bug.

If someone who is more familiar with this can provide an explanation as to why this occurred I would be inclined to learn.

Antepenult