Skip to content

scale 0 touchable is clickable, inherits dimensions from random views #50797

Open
@vanaigr

Description

@vanaigr

Description

If a transform scaleY: 0 is applied to a view with e.g. TouchableWithoutFeedback inside, the clicks are still registered as if TouchableWithoutFeedback had some height.

The height matches height of another TouchableWithoutFeedback in the hierarchy.

Steps to reproduce

  1. Connect an Android device.
  2. git clone https://github.com/vanaigr/react-native-scale-0-bug and cd into the directory
  3. npm i
  4. npm run android
  5. Wait until the app is started on the device
  6. From Metro, open DevTools
  7. On the phone, change Scale: input to 0.5
  8. Click within 50% from the center of the green rectangle. Observe message 1 clicked appears in console.
  9. Click outide 50% from the center of the green rectangle. Observe no additional messages are printed.
  10. Change Scale: input to 0.9
  11. Click outide 50%, but within 90% from the center of the green rectangle. Observe message 1 clicked printed in console.
  12. Change Scale: input to 0
  13. Click near the middle of the blue rectangle. Observe message 2 clicked printed in console.

React Native Version

0.79.0

Affected Platforms

Runtime - Android

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

System:
  OS: Windows 10 10.0.19045
  CPU: "(12) x64 AMD Ryzen 5 4500 6-Core Processor              "
  Memory: 5.91 GB / 15.87 GB
Binaries:
  Node:
    version: 20.16.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn: Not Found
  npm:
    version: 10.8.2
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK: Not Found
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 17.9.34723.18 (Visual Studio Community 2022)
Languages:
  Java: 17.0.13
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 18.0.0
    wanted: 18.0.0
  react:
    installed: 19.0.0
    wanted: 19.0.0
  react-native:
    installed: 0.79.0
    wanted: 0.79.0
  react-native-windows: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Stacktrace or Logs

N/A

Reproducer

https://github.com/vanaigr/react-native-scale-0-bug

Screenshots and Videos

2025-04-18.00-04-30.mp4

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions