react / react/react-native

.measure returns undefined on Android unless collapsable=false or onLayout are specified

Open
#29,712 34 comments 73 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Needs: Repro Needs: Triage :mag: Platform: Android
Dominant language
C++
Stars
127k
Forks
25.3k
Avg merge
1d 23h
Merged PRs (30d)
4

Description

Description

If you call .measure on a ref to a View on Android but you don't also have onLayout or collapsable={false} specified then .measure will call its success callback with undefined.

This issue got closed but it was never fixed https://github.com/facebook/react-native/issues/3282
Seems it got reported again and was also closed without a fix https://github.com/facebook/react-native/issues/19103

The issue here is identical, a 5 year old bug! I suspect it's due to android removing "unnecessary" views when it shouldn't. If there's a ref the view should essentially have collapsable={false} automatically.

React Native version:

System:
    OS: Windows 10 10.0.20190
    CPU: (16) x64 AMD Ryzen 7 3700X 8-Core Processor
    Memory: 33.48 GB / 63.93 GB
  Binaries:
    Node: 10.18.1 - C:\dev\tools\nodejs\node.EXE
    Yarn: 1.22.4 - C:\dev\tools\nodejs\yarn.CMD
    npm: 6.14.7 - C:\dev\TaskHero\node_modules\.bin\npm.CMD
    Watchman: 4.9.4 - C:\dev\tools\watchman\watchman.EXE
  SDKs:
    Android SDK:
      API Levels: 28, 29
      Build Tools: 28.0.3, 29.0.3, 30.0.1
      System Images: android-24 | Google Play Intel x86 Atom, android-25 | Google APIs ARM EABI v7a, android-25 | Google APIs Intel x86 Atom_64, android-28 | Google Play Intel x86 Atom_64, android-29 | Google Play Intel x86 Atom_64, android-30 | Google APIs Intel x86 Atom_64, androi
d-R | Google Play Intel x86 Atom_64
      Android NDK: 21.0.6113669
  IDEs:
    Android Studio: Not Found
  Languages:
    Java: 12.0.2
    Python: 3.8.4
  npmPackages:
    @react-native-community/cli: ^4.10.1 => 4.10.1
    react: 16.13.1 => 16.13.1
    react-native: 0.63.2 => 0.63.2
  npmGlobalPackages:
    *react-native*: Not Found

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

  1. Add a ref to a view on Android
  2. Call .measure on that ref, values returned are undefined

Expected Results

It should return the measurement results

Snack, code example, screenshot, or link to a repository:

Not needed, can be reproduced immediately on any react native android project of any version

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with a minimal React Native Android project and reproduce .measure on a View ref without onLayout or collapsable={false}. Compare the result with those options enabled, then trace React Native's Android handling of collapsable views and refs. Done means .measure returns measurement results in the reported case.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, react-native
Domain
mobile-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.