iOS Share Extension RN App doesn't mount

[AndrewHenderson]

iOS 11.3 RN 0.54.2

I'm finding that instantiating the rootView doesn't actually lead to the React.Component lifecycle methods in here being executed.

The rootView does appear, however, no React components are present. It's just the empty storyboard View.

@alinz The following code does not seem to actually initialize the Share App in our JS code.

jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"MyShareEx"
                                               initialProperties:nil
                                                   launchOptions:nil];

You can change the jsCodeLocation to #@"foo.ios" or the module name to @"Foo" and the outcome is the same.

[isaachinman]

@AndrewHenderson Did you find a solution to this? Encountered the same thing.

[AndrewHenderson]

@isaachinman I created a clean project and got the extension working. Then copied all of my files over to the new Xcode project. It continued to work in Debug configuration. However, I have not gotten it to work on Release configuration.

[isaachinman]

Have you seen the Test on Device without dev-server section of the docs? Might help you.

[AndrewHenderson]

@isaachinman Yes. Unfortunately, that did not fix the issue. Are you able to use a Share Extension in Release Mode on iOS?

[isaachinman]

Yes. As far as I know, several devs have released apps in both stores with this share extension included.

[AndrewHenderson]

@isaachinman I'm currently running a reduced test case. I was able to get the extension working in Release mode on a boilerplate project that uses only this library.

There were three important steps to getting it working:

1) I added the test on device without dev server script. 2) Make sure your app and the extension use the same index.js file for registering the React Native App and that you use require syntax rather than import.

const ReactNative = require('react-native');
const { AppRegistry } = ReactNative;
const App = require('./App').default;
const Share = require('./Share').default;

AppRegistry.registerComponent('AwesomeProject', () => App);
AppRegistry.registerComponent('MyShareEx', () => Share);

3) Add following in the extension's info.plist:

<key>NSExtensionActivationRule</key>
<dict>
  <key>NSExtensionActivationSupportsImageWithMaxCount</key>
  <integer>1</integer>
</dict>

I still can't get it to work on my app. I suspect because my app requires access to certain APIs that are not allowed for use by extensions.

[isaachinman]

Not sure about the require vs import thing (probably a red herring), but I believe those other steps are already in the docs.

[AndrewHenderson]

@isaachinman You were right. It wasn't necessary. Thanks.

I was able to get everything working in both Debug and Release mode.

What I'm finding is that my app doesn't appear to mount when there is a bug in my JS. Debugging in the extension is more challenging, so you have to look over your code very carefully or implement some of the suggestions in Troubleshooting on iOS.

[isaachinman]

@AndrewHenderson That is correct, it's an annoying part of working with such a "bare bones" RN application. Some people have included JS-based devtools, etc.

Glad to hear you got it working!