BUG: `boxShadow` doesnt works on `View` with `renderToHardwareTextureAndroid` enabled on Android

[psnet]

Description

New prop boxShadow to show shadows doesnt works on View with renderToHardwareTextureAndroid enabled on Android. Shadows are not visible

Steps to reproduce

1. Make View with renderToHardwareTextureAndroid={true}
2. Add to this View style with new boxShadow
3. Test on Android. Shadows are not visible
4. Remove renderToHardwareTextureAndroid
5. Now you can see shadows

React Native Version

0.79.4

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

Doesnt matter on system

Stacktrace or Logs

It doesnt have logs

MANDATORY Reproducer

https://snack.expo.dev/@sepu/bug-test

Screenshots and Videos

[cortinico]

Why are you using renderToHardwareTextureAndroid?

[psnet]

@cortinico for optimization purposes during animation with scale, translate etc

[NickGerleman]

@psnet this is unfortunately an expected behavior of renderToHardwareTextureAndroid (or needsOffscreenAlphaCompositing), where any content is clipped to bounds of the view. This is the same, as e.g. drawing with overflow.

A workaround, is to have a wrapper view, with padding for the shadow, and set renderToHardwareTexture on that (also maybe pointerEvents: 'box-none, so the padding doesn't participate in hit testing). We actually use that in production in places, because Android/Skia internals to render a box shadow hit a slow path, for non translate/scale transforms, so you can get a lot better performance rendering the shadow to a texture, then rotating that texture.

[psnet]

@NickGerleman thanks for explanation and how to fix this

Can we at least add more info into docs for renderToHardwareTextureAndroid about "clipping of bounds of view so for example shadows will be cut" so it will help others?

Also want to note that Android's elevation doesnt affected by renderToHardwareTextureAndroid clipping and still works with it.

[react-native-bot]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[psnet]

still needs changes either in docs about limitations or in code for fix

[react-native-bot]

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

[react-native-bot]

This issue was closed because it has been stalled for 7 days with no activity.