[0.80] Using Android ripple on background (default) does not work

Description

When using React Native 0.80.x, the Android ripple config does not work any more when not using it on the foreground. Applying a ripple to the background is the default behaviour. When setting the foreground: true, it still works, but that is not the effect we are after.

On React Native 0.79, everything still works like expected.

Steps to reproduce

When using a bare React Native project, just add a really simple Pressable component, for example:

<Pressable android_ripple={{ color: 'blue', foreground: false }} onPress={() => console.log('Pressed!')}>
  <View
    style={{ width: '100%', height: 250 }}
  />
</Pressable>

Then run the app on Android.
Notice that the press event is fired correctly. You do not see any ripple effect.
When setting foreground: true, everything works like expected.

The issue is present on both the old and new architecture.

React Native Version

0.80.2 (it still persists in 0.81.0)

Affected Platforms

Runtime - Android

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

System:
  OS: macOS 15.5
  CPU: (12) arm64 Apple M2 Max
  Memory: 61.47 MB / 64.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.16.0
    path: ~/.nvm/versions/node/v22.16.0/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v22.16.0/bin/yarn
  npm:
    version: 10.9.2
    path: ~/.nvm/versions/node/v22.16.0/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/ireumkens/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.5
      - iOS 18.5
      - macOS 15.5
      - tvOS 18.5
      - visionOS 2.5
      - watchOS 11.5
  Android SDK:
    API Levels:
      - "27"
      - "29"
      - "32"
      - "34"
      - "35"
    Build Tools:
      - 33.0.1
      - 34.0.0
      - 35.0.0
      - 35.0.0
      - 35.0.0
      - 35.0.1
      - 36.0.0
    System Images:
      - android-27 | ARM 64 v8a
      - android-27 | Intel x86_64 Atom
      - android-34 | Google APIs ARM 64 v8a
      - android-34 | Google Play ARM 64 v8a
      - android-35 | Google Play ARM 64 v8a
      - android-36 | Google Play ARM 64 v8a
    Android NDK: 25.1.8937393
IDEs:
  Android Studio: 2024.3 AI-243.26053.27.2432.13536105
  Xcode:
    version: 16.4/16F6
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.14
    path: /Users/ireumkens/.jenv/shims/javac
  Ruby:
    version: 3.3.0
    path: /Users/ireumkens/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 19.1.1
    wanted: 19.1.1
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.80.2
    wanted: 0.80.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: false

Stacktrace or Logs

No crash - just unexpected behaviour.

MANDATORY Reproducer

https://github.com/vanHoi/android-ripple-bug

Screenshots and Videos

First I'm tapping the topmost box. Then tapping the bottom box.

https://github.com/user-attachments/assets/32c55fc9-2853-44a2-ba15-d62f0cb4f5ff

Start with the mandatory reproducer and compare the Android Pressable ripple behavior between React Native 0.79 and 0.80. Verify the reported case with foreground: false on both architectures; done when the default background ripple appears while the press event continues to fire.