Windows: RNSVGMask was not found in the UIManager

[AncientRoman]

Bug

Importing and using mask with react-native-windows causes: Invariant Violation: requireNativeComponent: "RNSVGMask" was not found in the UIManager

This happens with a clean project using the latest versions of react native, react-native-windows. and react-native-svg.

Environment info

System: OS: Windows 10 10.0.22624 CPU: (8) x64 virt-7.2 Memory: 6.98 GB / 15.99 GB Binaries: Node: version: 18.16.0 path: C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: version: 9.5.1 path: C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: AllowDevelopmentWithoutDevLicense: Enabled AllowAllTrustedApps: Enabled Versions:

• 10.0.18362.0
• 10.0.19041.0
• 10.0.20348.0
• 10.0.22000.0
• 10.0.22621.0 IDEs: Android Studio: Not Found Visual Studio:
  • 17.6.33815.320 (Visual Studio Community 2022) Languages: Java: 11.0.18 Ruby: Not Found npmPackages: "@react-native-community/cli": Not Found react: installed: 18.2.0 wanted: 18.2.0 react-native: installed: 0.72.0 wanted: 0.72.0 react-native-windows: installed: 0.72.0 wanted: 0.72.0 npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: true newArchEnabled: false iOS: hermesEnabled: Not found newArchEnabled: Not found

react-native-svg@13.9.0 react-native-windows@0.72.0 react-native@0.72.0 react@18.2.0

Steps To Reproduce

1. npx react-native init Bug
2. npx react-native-windows-init
3. npm install react-native-svg
4. Link Win2D v1.26.0 (I did this with NuGet after opening my .sln)
5. Edit index.js to look like:

   
   import {AppRegistry, Platform} from "react-native"
   import {name as appName} from "./app.json"
   import Svg, {Defs, Mask, Rect} from "react-native-svg"

const App = ()=>{ return (

)

} AppRegistry.registerComponent(appName, () => App);

6. react-native run-windows

## Short, Self Contained, Correct (Compilable), Example

import {AppRegistry, Platform} from "react-native" import {name as appName} from "./app.json" import Svg, {Defs, Mask, Rect} from "react-native-svg"

const App = ()=>{ return (

)

} AppRegistry.registerComponent(appName, () => App);

[Arthurmtro]

Do we have news about this ?

[bohdanprog]

CC @marlenecota

[jakex7]

I believe this should be fixed now (starting with version 15.4.0), since RNSVGMask was added in this PR #2315

[AncientRoman]

Mask does now exist in windows. It can be imported and used. However, it doesn't seem to work. Any shape with mask="url(#Mask)" just acts like it's not masked.