Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pointer event is not applied for grand-children #2606

Open
1 task done
tienifr opened this issue Nov 10, 2023 · 0 comments
Open
1 task done

Pointer event is not applied for grand-children #2606

tienifr opened this issue Nov 10, 2023 · 0 comments
Labels

Comments

@tienifr
Copy link
Contributor

tienifr commented Nov 10, 2023

Is there an existing issue for this?

  • I have searched the existing issues

Describe the issue

There's a box-none value in RN web but currently it's implemented incorrectly. Currently the child elements of it 's implemented like parent > *: { pointer-events: auto } (see here) which only affects direct children. So the grand-children will still inherit the pointer-events: none

Expected behavior

All components inside parent that has pointer-events: box-none should be pointer-events: auto

Steps to reproduce

  1. Create the container View that has pointer-events: none
  2. Inside that View, create the child View that has pointer-events: box-none
  3. Inside child View, create the View within onClick function
  4. Observe that onClick function is not trigger

Test case

https://codesandbox.io/s/crazy-chihiro-yz9y4k

Additional comments

No response

Proposed solution

Update to the pattern parent *: { pointer-events: auto } so it affects all children. That means updating the >* to * in this line

This is recommended in the RN doc as well https://reactnative.dev/docs/view#pointerevents.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant