Skip to content

Hit test is broken on Text screen in RNTester app #754

Closed
@lyahdav

Description

@lyahdav

Environment

  1. react-native -v: I'm on this commit:
commit 5a3ee83efeec124b3aedbcccc90f2a878b75917e (HEAD -> master, origin/master, origin/HEAD)
Author: Saad Najmi <[email protected]>
Date:   Wed Mar 31 23:18:16 2021 -0500
  1. npm ls react-native-macos: (empty)
  2. node -v: v12.14.1
  3. npm -v: 6.13.4
  4. yarn --version: 1.21.1
  5. xcodebuild -version:
Xcode 12.4
Build version 12D4e

Issue

When I run RNTester on Mac and go to Text examples, if I right click on the selectable text example, it will only show the correct context menu if I click within the top few pixels of the component.

Steps to Reproduce

  1. Clone repo
  2. Run RNTester Mac
  3. Go to Text example
  4. Scroll to selectable text
  5. Click and hold to select the text
  6. Right click on the lower half of the text

Expected Behavior

Context menu with copy should show.

Actual Behavior

RN Context menu shows.

Reproducible Demo

The first click in this video is on top half (works fine), second click is bottom half (bug).

Screen.Recording.2021-04-05.at.4.20.53.PM.mov

Additional context

The bug is due to this line: https://github.com/microsoft/react-native-macos/blob/master/RNTester/js/components/RNTesterPage.js#L72
If I delete it, everything works fine. It seems that setting a paddingTop on ScrollView breaks hit tests.

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