[Android] Pointer Events box-none not working after react-native 66

Bug

Before react-native 66 pointer events, box-none worked as expected on Android. It preserved the interactive area to the actual area that was painted. After the update made in react native 66 (https://reactnative.dev/blog/2021/10/01/version-066 more specifically https://github.com/facebook/react-native/pull/29039/files) that stopped working.

That can be seen on the snacks below when trying to select the blue section behind the red section. Before react native 66 you can do that and after the blue section can only be selected outside the box of the red section.

Working on react-native 64 https://snack.expo.dev/@amorales85/react-native-svg---box_none-working

Not working on react-native 68 https://snack.expo.dev/@amorales85/react-native-svg---box-none-not-working-properly

Unexpected behavior

Working on react-native 64 https://snack.expo.dev/@amorales85/react-native-svg---box_none-working

Not working on react-native 68 https://snack.expo.dev/@amorales85/react-native-svg---box-none-not-working-properly

Environment info

React native info output:

    OS: macOS 12.4
    CPU: (10) arm64 Apple M1 Pro
    Memory: 123.67 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.14.0/bin/yarn
    npm: 8.3.1 - ~/.nvm/versions/node/v16.14.0/bin/npm
    Watchman: 2022.05.23.00 - /opt/homebrew/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /Users/andremorales/.rvm/gems/ruby-2.7.4/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.1 AI-211.7628.21.2111.8139111
    Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.11 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.68.2 => 0.68.2 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Library version: 12.4.0

Steps To Reproduce

Can see the issue happening in this snack: https://snack.expo.dev/@amorales85/react-native-svg---box-none-not-working-properly that usese react-native 68.

Short, Self Contained, Correct (Compilable), Example

N/A I think.

[WoLewicki]

@labmorales did passing pointerEvents directly to SvgView ever work? Looking at the props passed here: https://github.com/react-native-svg/react-native-svg/blob/7b7ca40262b29a5b5fc777849537ab58a5bb9c2d/src/elements/Svg.tsx, there is no pointerEvents prop sent to the native side. Or am I missing something?

[labmorales]

That’s very strange. This bug was filed before version 13. All the tests were made using version 12.4.4. Are you sure you did not revert the react-native version to a version lower than 66?