Provide more clarity/corrections on Fabric codegen iOS

[coolsoftwaretyler]

Description

Hey folks, the final warning on the Fabric native component documentaiton page is a little confusing to me, in particular, the second bullet point:

Codegen is generating a line in the RCTThirdPartyFabricComponentsProvider that it should not generate. Remove the lines with the WebViewCls symbol in the RCTThirdPartyFabricComponentsProvider.h and RCTThirdPartyFabricComponentsProvider.mm files.

The callout also mentions fixes will be released in React Native 0.76.1, but that does not seem to be the case.

What is the problem?

I'm not exactly sure what files to remove the CustomWebViewCls symbols for. I have tried a few different file paths:

1. ios/Pods/Headers/Private/React-RCTFabric/React/RCTThirdPartyFabricComponentsProvider.h
2. node_modules/react-native/React/Fabric/RCTThirdPartyFabricComponentsProvider.h
3. node_modules/react-native/React/Fabric/RCTThirdPartyFabricComponentsProvider.mm

But I run into one of two problems:

1. Either the lines come back when I run the build through the yarn run ios or through Xcode build directly
2. Even if I manage to get those lines out of there, I continue to have this error in Xcode and I can't seem to hunt it down

Undefined symbol: _OBJC_CLASS_$_WKWebView

Additionally, the docs said 0.76.1 would not have this issue, but it seems to have persisted.

You can see the code I've been working on at https://github.com/coolsoftwaretyler/fabric-tutorial-react-native-webview. Android is working great!

How can we address it?

Can you please provide specific file paths, screen shots, or other information to make the fix clearer for readers? Or even pointing to whatever PR made this fix so I can use patch-package or something to use it on my machine.

And perhaps update what version we should expect the fix in.

Why is it important?

Understanding how to build Fabric components will help the community adopt the New Architecture faster, and I think the introduction article to this tool should be as accurate and helpful as possible.

Who needs this?

People who want to build custom Fabric native components (app developers, library authors, potential React Native contributors)

When should this happen (use version numbers if needed)?

Whenever's clever!

[coolsoftwaretyler]

Ok, I've figured out this part;

Undefined symbol: _OBJC_CLASS_$_WKWebView

I had to go and link the Webkit framework through Xcode, which makes me think either something's missing in the build in Podspecs, or there should be some other step in this article about adding that framework in the iOS section.

I'm still seeing this error:

Undefined symbol: _CustomWebViewCls

Which I assume is the original error the docs warn about, and my question for "where should I go to remove this code?" remains. I will keep troubleshooting on my own but I imagine some extra clarity in the docs will be helpful when you folks get around to it.

[coolsoftwaretyler]

Hey I got it on iOS!

Figured out the easiest way to remove those lines (at least in my opinion), is through Xcode. Here is a screen recording in case anyone else needs help with it until the patch is released:

Screen.Recording.2024-11-02.at.10.23.42.PM.mp4

[migueldaipre]

I'm having the same issue with a decoupled library.

I left a comment in the pull request that tried to solve this facebook/react-native#47176 (comment)

[blakef]

Thank you for this, can confirm it's an issue. I missed cherry-picking this change in the release: https://github.com/facebook/react-native/pull/47195/files, it'll have to go out in 0.76.2

[erudel]

@migueldaipre I ran into the same issue and was able to fix the error. See facebook/react-native#47217 (comment)