version 13.0.0 rn 0.69.4 component property change not working

[linjdev]

react-native-svg 13.0.0, react-native 0.69.4 component property change not working

Bug

<Star
	fill={isFavorited}
	color={isFavorited ? 'red' : theme.colorText}
/>

Temporary Fix

use different key

{ isFavorited ? <Star
	key="unfavorite"
	fill={isFavorited}
	color={'red'}
/> : <Star
	key="favorite"
	fill={isFavorited}
	color={theme.colorText}
/> }

Environment info

 System:
    OS: macOS 12.0.1
    CPU: (4) x64 Intel(R) Core(TM) i7-7Y75 CPU @ 1.30GHz
    Memory: 1.44 GB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 17.8.0 - /usr/local/bin/node
    Yarn: 1.22.5 - ~/.yarn/bin/yarn
    npm: 8.13.0 - /usr/local/bin/npm
    Watchman: 2022.03.21.00 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /usr/local/bin/pod
  SDKs:
    iOS SDK: Not Found
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
    Xcode: /undefined - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.14.1 - /usr/local/opt/openjdk@11/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.0.0 => 18.0.0 
    react-native: 0.69.4 => 0.69.4 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

[kneza23]

I have the same problem, tnx for the temp fix @linjdev

[kylegillen]

Could one of you share how you manually linked the project for android use on 0.69 please?

#1839

[linjdev]

@nextriot nothing todo. just use latest version react-native and react-native-svg and enable newarch.

[WoLewicki]

@linjdev on what platforms does the bug appear? @nextriot I will try and make a guide how to do it.

[kneza23]

i do not have newarch enabled and it works out of the box without manual work, i just updated library version in package.json

[linjdev]

@WoLewicki Android 12 LineageOS 19 Nexus 5X, not enabled newarch. clean project.

[Bardiamist]

setNativeProps don't work in react-native-svg 13.0.0
Is it related issue or need to create new one?

<Circle
  r={4}
  fill="#000000"
  opacity={0}
  ref={ref}
/>

ref.current?.setNativeProps({ opacity: 1 });

[WoLewicki]

@Bardiamist setNativeProps is not available on Fabric, or do you mean that it stopped working on old architecture?

[WoLewicki]

@linjdev @kneza23 could you check if applying #1843 resolves the problem?

[Bardiamist]

@Bardiamist setNativeProps is not available on Fabric, or do you mean that it stopped working on old architecture?

stopped working on old architecture

[WoLewicki]

@Bardiamist I checked it and it is caused by the same issue as the one fixed in #1843, it should work fine for you after applying the change. Could you check it?

[Bardiamist]

@Bardiamist I checked it and it is caused by the same issue as the one fixed in #1843, it should work fine for you after applying the change. Could you check it?

I tried

"react-native-svg": "git+https://github.com/react-native-svg/react-native-svg#@wolewicki/fix-android-components-not-updating"

Looks good

[Bardiamist]

Unfortunatelly I still see problems should be related with layout invalidation on Android on old architecture. 13.1.0 works better than 13.0.0 but broke after some layout changes. No problems on iOS. I'll wait some time or will try to create repo with example.

[WoLewicki]

@Bardiamist please create a repro so we can work on it 🚀

[Bardiamist]

@WoLewicki ok, I created #1859