Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

unstable_reactLegacyComponentNames IOS Issue #37905

Closed
affansk opened this issue Jun 15, 2023 · 14 comments
Closed

unstable_reactLegacyComponentNames IOS Issue #37905

affansk opened this issue Jun 15, 2023 · 14 comments
Labels
Platform: iOS iOS applications. Resolution: Issue in another tool or repo An issue that was opened against React Native but in reality is affecting another tool or library Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)

Comments

@affansk
Copy link

affansk commented Jun 15, 2023

Description

i get this Failure Error in IOS when i make use of this unstable_reactLegacyComponentNames: ['BVLinearGradient'] to support in new architecture

Thread Performance Checker: Thread running at QOS_CLASS_USER_INTERACTIVE waiting on a lower QoS thread running at QOS_CLASS_DEFAULT. Investigate ways to avoid priority inversions

Assertion failed: (module), function constructCoordinator, file LegacyViewManagerInteropComponentDescriptor.mm, line 64.

React Native Version

0.72.0

Output of npx react-native info

Assertion failed: (module), function constructCoordinator, file LegacyViewManagerInteropComponentDescriptor.mm, line 64

Steps to reproduce

  1. Add unstable_reactLegacyComponentNames in react native config file for the component which is not compatible with new architecture
  2. run the xcode
  3. the build will be successfull
  4. the xcode will crash with above error

Snack, code example, screenshot, or link to a repository

just add this in react-native config file
project: {
ios: {
unstable_reactLegacyComponentNames: ['BVLinearGradient'],
},
android: {}, // grouped into "project"
},

@github-actions github-actions bot added the Platform: iOS iOS applications. label Jun 15, 2023
@cortinico cortinico added the Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. label Jun 15, 2023
@github-actions
Copy link

⚠️ Missing Reproducible Example
ℹ️ It looks like your issue is missing a reproducible example. Please provide either:

@cortinico
Copy link
Contributor

We would need a full repro to look into this. Also: what is BVLinearGradient? Which library is exposing it? Is it a component you created?

@kelset kelset added the Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules) label Jun 16, 2023
@github-actions github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Jun 19, 2023
@cortinico cortinico added Needs: Author Feedback and removed Needs: Attention Issues where the author has responded to feedback. labels Jun 19, 2023
@cpintos-sc
Copy link

@cortinico the library could be this one. I'm, getting the exact same error with the package's latest release 2.7.3.

@cortinico
Copy link
Contributor

@cpintos-sc thanks for the update. Does the issue happen on both Android & iOS?

@affansk
Copy link
Author

affansk commented Jun 23, 2023

@cortinico sorry for late reply, i just tested on Android with version 0.72.0, its working fine.
On IOS I can still see that issue.

project: {
ios: {
unstable_reactLegacyComponentNames: ['BVLinearGradient','RNSVGImage'],
},
android: {
unstable_reactLegacyComponentNames: ['BVLinearGradient', 'RNSVGImage'],
}, // grouped into "project"
},

Update : @cortinico i guess the problem is with this package https://github.com/react-native-linear-gradient/react-native-linear-gradient

i just use unstable_reactLegacyComponentNames only with RNSVGImage for IOS. it works fine.

@github-actions github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Jun 23, 2023
@kelset
Copy link
Contributor

kelset commented Jun 26, 2023

is the actionable that something needs to be changed in linear-gradient, or in the interop layer?

@affansk
Copy link
Author

affansk commented Jun 26, 2023

not 100% Percent sure! i guess need to change in linear-gradient package.
there is already a PR react-native-linear-gradient/react-native-linear-gradient#606 for New architecture

@cpintos-sc
Copy link

cpintos-sc commented Jun 26, 2023

Hi, just to let you know. There is already a forked version of that project that supports the fabric renderer, rnx-gradient.
And JUST IN CASE! you are happening to use react-native-skeleton-placeholder here is a patch for that package that replaces the old react-native-linear-gradient for the one that supports fabric. This solved my issues! Hope it helps.
cc: @affansk

@cipolleschi
Copy link
Contributor

Update : @cortinico i guess the problem is with this package react-native-linear-gradient/react-native-linear-gradient

i just use unstable_reactLegacyComponentNames only with RNSVGImage for IOS. it works fine.

Given this, I'd probably close this issue and ask @affansk to eventually open an issue in the react-native-linear-gradient repo as this looks more like a lib problem rather than an interop layer problem.
Opinions @affansk, @cortinico, @kelset?

@cortinico
Copy link
Contributor

Yup let's close this as multiple alternatives have been raised.

@cortinico cortinico added Resolution: Issue in another tool or repo An issue that was opened against React Native but in reality is affecting another tool or library and removed Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. Needs: Attention Issues where the author has responded to feedback. labels Jun 27, 2023
@cipolleschi cipolleschi reopened this Jun 27, 2023
@cipolleschi
Copy link
Contributor

Actually, this highlighted a shortcoming of the Interop Layer for iOS, so I'm looking into this.
A PR will come soon

cipolleschi added a commit to cipolleschi/react-native that referenced this issue Jun 27, 2023
Summary:
In [this issue](facebook#37905), the community detected a strict assumption in the interop layer for which, given a component `XXXView`, its ViewManager must be called `RCTXXXViewManager`.

That's not the case for some components, for example, `BVLinearGradient`, which View manager is `BVLinearGradientManager` and not `RCTBVLinearGradientManager`.

This diff adds a secondary lookup logic:
1. We look for the `RCTXXXViewManager`.
2. If not found, we look for `XXXViewManager`.

We will assess whether to generalize this logic once and for all or to expand other lookup cases on an example/failure basis as it's not a goal to have a 100% accurate interop layer. The Goal is to cover most use cases.

## Changelog:
[iOS][Added] - Allow to lookup for ViewManager without the RCT prefix in the Interop Layer

Differential Revision: D47055969

fbshipit-source-id: da158bdabcbcab848d735dc6b2d5c5ccb492d20e
cipolleschi added a commit to cipolleschi/react-native that referenced this issue Jun 27, 2023
Summary:
Pull Request resolved: facebook#38093

In [this issue](facebook#37905), the community detected a strict assumption in the interop layer for which, given a component `XXXView`, its ViewManager must be called `RCTXXXViewManager`.

That's not the case for some components, for example, `BVLinearGradient`, which View manager is `BVLinearGradientManager` and not `RCTBVLinearGradientManager`.

This diff adds a secondary lookup logic:
1. We look for the `RCTXXXViewManager`.
2. If not found, we look for `XXXViewManager`.

We will assess whether to generalize this logic once and for all or to expand other lookup cases on an example/failure basis as it's not a goal to have a 100% accurate interop layer. The Goal is to cover most use cases.

## Changelog:
[iOS][Added] - Allow to lookup for ViewManager without the RCT prefix in the Interop Layer

Reviewed By: sammy-SC

Differential Revision: D47055969

fbshipit-source-id: b648c79e54d37d571a0ee8c490745f587b1327a1
facebook-github-bot pushed a commit that referenced this issue Jun 27, 2023
Summary:
Pull Request resolved: #38093

In [this issue](#37905), the community detected a strict assumption in the interop layer for which, given a component `XXXView`, its ViewManager must be called `RCTXXXViewManager`.

That's not the case for some components, for example, `BVLinearGradient`, which View manager is `BVLinearGradientManager` and not `RCTBVLinearGradientManager`.

This diff adds a secondary lookup logic:
1. We look for the `RCTXXXViewManager`.
2. If not found, we look for `XXXViewManager`.

We will assess whether to generalize this logic once and for all or to expand other lookup cases on an example/failure basis as it's not a goal to have a 100% accurate interop layer. The Goal is to cover most use cases.

## Changelog:
[iOS][Added] - Allow to lookup for ViewManager without the RCT prefix in the Interop Layer

Reviewed By: sammy-SC

Differential Revision: D47055969

fbshipit-source-id: 1d31f3f4bc6f1f543edbd157ce04ad9daf23dbc6
cipolleschi added a commit that referenced this issue Jun 28, 2023
Summary:
Pull Request resolved: #38093

In [this issue](#37905), the community detected a strict assumption in the interop layer for which, given a component `XXXView`, its ViewManager must be called `RCTXXXViewManager`.

That's not the case for some components, for example, `BVLinearGradient`, which View manager is `BVLinearGradientManager` and not `RCTBVLinearGradientManager`.

This diff adds a secondary lookup logic:
1. We look for the `RCTXXXViewManager`.
2. If not found, we look for `XXXViewManager`.

We will assess whether to generalize this logic once and for all or to expand other lookup cases on an example/failure basis as it's not a goal to have a 100% accurate interop layer. The Goal is to cover most use cases.

[iOS][Added] - Allow to lookup for ViewManager without the RCT prefix in the Interop Layer

Reviewed By: sammy-SC

Differential Revision: D47055969

fbshipit-source-id: 1d31f3f4bc6f1f543edbd157ce04ad9daf23dbc6
Kudo pushed a commit to expo/react-native that referenced this issue Jul 3, 2023
Summary:
Pull Request resolved: facebook#38093

In [this issue](facebook#37905), the community detected a strict assumption in the interop layer for which, given a component `XXXView`, its ViewManager must be called `RCTXXXViewManager`.

That's not the case for some components, for example, `BVLinearGradient`, which View manager is `BVLinearGradientManager` and not `RCTBVLinearGradientManager`.

This diff adds a secondary lookup logic:
1. We look for the `RCTXXXViewManager`.
2. If not found, we look for `XXXViewManager`.

We will assess whether to generalize this logic once and for all or to expand other lookup cases on an example/failure basis as it's not a goal to have a 100% accurate interop layer. The Goal is to cover most use cases.

[iOS][Added] - Allow to lookup for ViewManager without the RCT prefix in the Interop Layer

Reviewed By: sammy-SC

Differential Revision: D47055969

fbshipit-source-id: 1d31f3f4bc6f1f543edbd157ce04ad9daf23dbc6
@renyufei8023
Copy link

renyufei8023 commented Oct 23, 2023

module.exports = {
    project: {
      ios: {
        unstable_reactLegacyComponentNames: [
          'FastImageView',
        ],
      },
      android: {},
    },
    // assets: ['./src/assets/fonts'],
  };

Crash
截屏2023-10-23 18 05 35

@cipolleschi
Copy link
Contributor

@renyufei8023 can you share which library are you using? I guess it is react-native-fastimage but could be wrong.

What's happening here is that FastImage is probably not following one of the supported convention to define the ViewManager and, therefore, the InteropLayer fails to create it.

I can look into how the view manager is called and see if we can extend the interop layer somehow.

@renyufei8023
Copy link

这里发生的情况是 FastImage 可能没有遵循定义 ViewManager 的受支持约定之一,因此 InteropLayer 无法创建它。

我可以研究如何调用视图管理器,看看我们是否可以以某种方式扩展互操作层。

I am currently using react native fast image,repo:https://github.com/DylanVann/react-native-fast-image#readme

Othinn pushed a commit to Othinn/react-native that referenced this issue Oct 30, 2023
…k#41207)

Summary:
This should fix
facebook#37905 (comment)

When working on react-native-fast-image, we realized that the interop layer does not work for components where the exported name is different from the iOS class.

To fix this, we can use the Bridge to retrieve the actual view manager, given the component name.

This solution should be much more robust than making assumptions on the ViewManager name, given the ComponentName.

On top of that, we realized tha the interop layer was not calling `didSetProps` after setting the props, so we are invoking that.

bypass-github-export-checks

## Changelog:
[iOS][Fixed] - Add support for Components with custom names in the interop layer.

Pull Request resolved: facebook#41207

Test Plan: Tested locally on an app created in 0.72 and 0.73 in Bridge and Bridgeless mode.

Reviewed By: cortinico

Differential Revision: D50698172

Pulled By: cipolleschi

fbshipit-source-id: 49aee905418515b0204febbbe6a67c0114f37029
lunaleaps pushed a commit that referenced this issue Nov 3, 2023
Summary:
This should fix
#37905 (comment)

When working on react-native-fast-image, we realized that the interop layer does not work for components where the exported name is different from the iOS class.

To fix this, we can use the Bridge to retrieve the actual view manager, given the component name.

This solution should be much more robust than making assumptions on the ViewManager name, given the ComponentName.

On top of that, we realized tha the interop layer was not calling `didSetProps` after setting the props, so we are invoking that.

bypass-github-export-checks

[iOS][Fixed] - Add support for Components with custom names in the interop layer.

Pull Request resolved: #41207

Test Plan: Tested locally on an app created in 0.72 and 0.73 in Bridge and Bridgeless mode.

Reviewed By: cortinico

Differential Revision: D50698172

Pulled By: cipolleschi

fbshipit-source-id: 49aee905418515b0204febbbe6a67c0114f37029
fortmarek pushed a commit that referenced this issue Nov 8, 2023
Summary:
This should fix
#37905 (comment)

When working on react-native-fast-image, we realized that the interop layer does not work for components where the exported name is different from the iOS class.

To fix this, we can use the Bridge to retrieve the actual view manager, given the component name.

This solution should be much more robust than making assumptions on the ViewManager name, given the ComponentName.

On top of that, we realized tha the interop layer was not calling `didSetProps` after setting the props, so we are invoking that.

bypass-github-export-checks

[iOS][Fixed] - Add support for Components with custom names in the interop layer.

Pull Request resolved: #41207

Test Plan: Tested locally on an app created in 0.72 and 0.73 in Bridge and Bridgeless mode.

Reviewed By: cortinico

Differential Revision: D50698172

Pulled By: cipolleschi

fbshipit-source-id: 49aee905418515b0204febbbe6a67c0114f37029
fortmarek pushed a commit that referenced this issue Nov 8, 2023
Summary:
This should fix
#37905 (comment)

When working on react-native-fast-image, we realized that the interop layer does not work for components where the exported name is different from the iOS class.

To fix this, we can use the Bridge to retrieve the actual view manager, given the component name.

This solution should be much more robust than making assumptions on the ViewManager name, given the ComponentName.

On top of that, we realized tha the interop layer was not calling `didSetProps` after setting the props, so we are invoking that.

bypass-github-export-checks

[iOS][Fixed] - Add support for Components with custom names in the interop layer.

Pull Request resolved: #41207

Test Plan: Tested locally on an app created in 0.72 and 0.73 in Bridge and Bridgeless mode.

Reviewed By: cortinico

Differential Revision: D50698172

Pulled By: cipolleschi

fbshipit-source-id: 49aee905418515b0204febbbe6a67c0114f37029
fortmarek added a commit that referenced this issue Nov 10, 2023
* Make the interop-layer work with components with custom name (#41207)

Summary:
This should fix
#37905 (comment)

When working on react-native-fast-image, we realized that the interop layer does not work for components where the exported name is different from the iOS class.

To fix this, we can use the Bridge to retrieve the actual view manager, given the component name.

This solution should be much more robust than making assumptions on the ViewManager name, given the ComponentName.

On top of that, we realized tha the interop layer was not calling `didSetProps` after setting the props, so we are invoking that.

bypass-github-export-checks

[iOS][Fixed] - Add support for Components with custom names in the interop layer.

Pull Request resolved: #41207

Test Plan: Tested locally on an app created in 0.72 and 0.73 in Bridge and Bridgeless mode.

Reviewed By: cortinico

Differential Revision: D50698172

Pulled By: cipolleschi

fbshipit-source-id: 49aee905418515b0204febbbe6a67c0114f37029

* Remove references to RCTBridgeProxy

---------

Co-authored-by: Riccardo Cipolleschi <riccardo.cipolleschi@gmail.com>
Co-authored-by: Riccardo Cipolleschi <cipolleschi@meta.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Platform: iOS iOS applications. Resolution: Issue in another tool or repo An issue that was opened against React Native but in reality is affecting another tool or library Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)
Projects
None yet
Development

No branches or pull requests

6 participants