rn-macos's Hermes support: RNTester on 0.64 & 0.66

[kelset]

Environment

react-native-macos: 0.64, 0.66
node -v: 14.8.1
npm -v: 6.14.15
yarn --version: 1.22.17
xcodebuild -version: Xcode 13.2 - Build version 13C90

(0.64-stable branch of this repo, fb66merge branch by @HeyImChris: https://github.com/HeyImChris/react-native-macos/tree/fb66merge)

Steps to reproduce the bug

After doing the basic yarn from root of the repo, I go into packages/rn-tester and do pod install.
Then open RNTesterPods.xcworkspace, select "RNTester-macOS" -> "My Mac" and press play.

Without any changes, it works for both 0.64 and 0.66 versions. An app is created, metro instance loaded and RNTester app is usable.

If I try to enable Hermes by going in scripts/react_native_pods.rb and changing L17 from

  hermes_enabled = options[:hermes_enabled] ||= false

to

  hermes_enabled = options[:hermes_enabled] ||= true

Note: this is quickest way of enabling Hermes, there are others but this does the work as far as I can tell. After cleaning build folder, closing Xcode, doing a new pod install, the hermes-engine pod also gets pulled in correctly.

Then, when I open RNTesterPods.xcworkspace, select "RNTester-macOS" -> "My Mac" and press play, this time around the build fails, for both 0.64 and 0.66.

Details of the failures in the "Actual Behaviour" section.

Expected Behavior

That RNTester loads up correctly, and shows the "Hermes engine" line in the top right corner just like it happens with Android and iOS.

Actual Behavior

For 0.64

In 0.64, the build error is as shown in the screenshot:

This was a known error in 0.64, and there are issues opened about it: facebook/flipper#2281 but for some reason, updating the Flipper dependencies in the Podfile as per the resolution offered there didn't lead to the Xcode project building.

For 0.66

In 0.66 the error is different (correctly, the issue hit above is solved in this newer version). See screenshot:

This Linker level error:

Undefined symbols for architecture x86_64:
  "folly::exception_ptr_get_type(std::exception_ptr const&)", referenced from:
      folly::exception_wrapper::ExceptionPtr::type_(folly::exception_wrapper const*) in libRCT-Folly-macOS.a(ExceptionWrapper.o)
      folly::exceptionStr(std::exception_ptr const&) in libRCT-Folly-macOS.a(ExceptionString.o)
  "folly::exception_ptr_get_object(std::exception_ptr const&, std::type_info const*)", referenced from:
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libReact-hermes-macOS.a(Connection.o)
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libRCT-Folly-macOS.a(ExceptionWrapper.o)
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libRCT-Folly-macOS.a(ExceptionString.o)
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Resembled another error that was reported during the RC phase of 0.66: react-native-community/releases#251

In that case, the problem was with the arm64; still, I kept digging and basically it was caused by the fact that Folly needed one extra library c++abi, which was added to Folly's requirements (facebook/folly@0fee9df) for Apple's Cmake but that version of Folly wasn't getting consumed by RN correctly, which lead to facebook/flipper#2600 and in turn facebook@8b6d7fd

This last commit is present in the fb66merge branch - so I dug a bit deeper and realized that even despite that, the dependency of Flipper-Folly had to be bumped to 2.6.10 to get the right version of Folly.
I tried to do that too, but the build error is still present.

At this point I'm kind-of running out of ideas, which is why I've decided to open this to document all my findings in the hope that someone can point out what I need to do to get Hermes to work against react-native-macos's RNTester (which I hope in turn will lead to it working in any react-native-macos project).

Reproducible Demo

(see repro steps section)

Additional context

about hermes-darwin-engine

One extra rabbithole of this whole story is the extra dependency hermes-engine-darwin. I found it mentioned in a few places, and in the docs for RN-macos too: https://microsoft.github.io/react-native-windows/docs/hermes#hermes-on-macos

But it turns out, this entire npm package was removed entirely from the Hermes repo: facebook/hermes@dbc1e28

So I tried to understand a bit more of what that package was all about: it seems that it was created as a "quick and dirty" add on during the early stages of Hermes for iOS work: facebook/hermes#297

Then one of the Hermes developers realized that ios & macos impl could have been together here
https://github.com/facebook/hermes/pull/385/files
so it's been "hermes-engine" only since 0.7 (the version paired with 0.64).

All of this seems to point in the direction of hermes-engine being the only dependency needed to get Hermes to work on macos.

---

In closure - this issue seems to be related to mine, so linking here for cross-ref: #931

[HeyImChris]

Thanks for filing this @kelset. It seems like an issue other folks have hit as well so probably a reasonable candidate to get fixed.

[Saadnajmi]

Based on the error I'm seeing in your screenshots, the extra script @ospfranco listed in #931 seems promising?

[kelset]

@Saadnajmi potentially - but since that error is not present in the 0.66 branch I'm not really interested in fixing it. My main interest is understanding what it takes to make sure that Hermes works on macos :)

[kelset]

quick update: I went for this problem from another angle, testing RNTA's macos example app and turning Hermes on there - it works correctly (it's still on rn-macos 64):

So it looks like it might be more of a RNTester problem locally in this repo than Hermes not working properly with rn-macos.

[tido64]

Testing out react-native-macos 0.66.4 in react-native-test-app right now, and I'm getting the following linker errors with Hermes enabled:

Undefined symbols for architecture x86_64:
  "folly::exception_ptr_get_type(std::exception_ptr const&)", referenced from:
      folly::exception_wrapper::ExceptionPtr::type_(folly::exception_wrapper const*) in libRCT-Folly.a(ExceptionWrapper.o)
      folly::exceptionStr(std::exception_ptr const&) in libRCT-Folly.a(ExceptionString.o)
  "folly::exception_ptr_get_object(std::exception_ptr const&, std::type_info const*)", referenced from:
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libReact-hermes.a(Connection.o)
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libRCT-Folly.a(ExceptionWrapper.o)
      std::exception* folly::exception_ptr_get_object<std::exception>(std::exception_ptr const&) in libRCT-Folly.a(ExceptionString.o)
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

[tido64]

It looks like the linker errors are caused by this line:

react-native-macos/third-party-podspecs/RCT-Folly.podspec

Line 43 in 643b056

# 'folly/lang/Exception.cpp', # TODO(macOS GH#214) later versions of boost don't support macOS, revert this back to upstream when fixed

Uncommenting and rebuilding seems to work:

@HeyImChris, @Saadnajmi: If there are no objections, I'll submit a PR later.

[ospfranco]

I'm on react-native-macos: 0.66.10 and "hermes-engine-darwin": "~0.5.3" and my app is still not compiling:

I also added the following post-install script in my Podfile:

require_relative '../node_modules/react-native-macos/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

target 'sol-macOS' do
  platform :macos, '10.15'
  use_native_modules!
  use_react_native!(
    :path => '../node_modules/react-native-macos',
    :hermes_enabled => true
  )

  post_install do |installer|
    react_native_post_install(installer)
    __apply_Xcode_12_5_M1_post_install_workaround(installer)
  end

end

Any pointers on what could be wrong? thanks a lot!

[kelset]

@ospfranco I am not sure, but I think you might have to drop the extra hermes-engine-darwin and just use the standard hermes-engine on the RN66 specific version (which should be 0.9)

[ospfranco]

I tried swapping hermes-engine-darwin for hermes-engine 0.9.0 and I'm still getting the same error

[ospfranco]

If you want you can check-out the project where I'm trying to apply the update yourself

https://github.com/ospfranco/sol/tree/hermes

[kelset]

@ospfranco in this commit ospfranco/sol@d96e551 you have put Hermes at version 0.11, not 0.9. I am not sure that will fix, but you are currently on the wrong version of Hermes

[ospfranco]

yeah, sorry, forgot to mention, I tried with 0.9 that wasn't working to I tried with 0.11, still nothing

[tido64]

@ospfranco: #982 should've fixed it. Looking at the 0.66-stable branch, it looks like we didn't backport it. PR: #1021

[ospfranco]

I just updated to RN-macOS 0.66.10 and wanted to test if this is fixed, but I still get the same error #1021 was supposed to fix

[tido64]

Can you try 0.66.11 or higher?

[ospfranco]

oops, damn, I meant 0.66.30, 0.66.10 was the version I was already using

[tido64]

Can you verify that you've run pod install after upgrading, and that the RCT-Folly target includes Exception.cpp?

[ospfranco]

I only see the header files in my project, where am I supposed to look at?

[tido64]

I use the filter at the bottom. Can you also check a few more things for me:

• Does Pods/Local Podspecs/RCT-Folly.podspec.json include Exception.cpp?
• Does node_modules/react-native-macos/third-party-podspecs/RCT-Folly.podspec include Exception.cpp?
• What is the version number in node_modules/react-native-macos/package.json?

[ospfranco]

Ah, apparently my pods had a cached version, I removed the Pods folder and the Podfile.lock and did a clean install (with hermes-engine 0.9.0) and it works! Thanks a lot!

Also, I'm getting a Intl error, I thought hermes was supposed to add Intl support by now? :P

[tido64]

According to the Hermes docs, it's only implemented on Android: https://hermesengine.dev/docs/language-features/#supported 😕