From 1753e7697d69dcf12cbdd80916dec1814a2b44cc Mon Sep 17 00:00:00 2001
From: Luna Wei <luwe@fb.com>
Date: Fri, 8 Jul 2022 13:11:56 -0700
Subject: [PATCH] Fix: Ensure forms stacking context for events

Summary: Changelog: [Internal] - If any relevant view events (pointer, touch events, gesture responder, etc.) are declared on view, then the view must form stacking context. We need this change for pointer events specifically to determine whether we've entered/exited a view

Reviewed By: vincentriemer

Differential Revision: D37678352

fbshipit-source-id: 02641549ef608b1c9468ac693c7da629143212cb
---
 ReactCommon/react/renderer/components/view/ViewShadowNode.cpp  | 3 +--
 .../js/examples/Experimental/W3CPointerEventsExample.js        | 2 +-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/ReactCommon/react/renderer/components/view/ViewShadowNode.cpp b/ReactCommon/react/renderer/components/view/ViewShadowNode.cpp
index 9ab95c3a3f8..61661c1af41 100644
--- a/ReactCommon/react/renderer/components/view/ViewShadowNode.cpp
+++ b/ReactCommon/react/renderer/components/view/ViewShadowNode.cpp
@@ -70,7 +70,7 @@ void ViewShadowNode::initialize() noexcept {
       (viewProps.zIndex.has_value() &&
        viewProps.yogaStyle.positionType() != YGPositionTypeStatic) ||
       viewProps.yogaStyle.display() == YGDisplayNone ||
-      viewProps.getClipsContentToBounds() ||
+      viewProps.getClipsContentToBounds() || viewProps.events.bits.any() ||
       isColorMeaningful(viewProps.shadowColor) ||
       viewProps.accessibilityElementsHidden ||
       viewProps.accessibilityViewIsModal ||
@@ -84,7 +84,6 @@ void ViewShadowNode::initialize() noexcept {
   bool formsView = formsStackingContext ||
       isColorMeaningful(viewProps.backgroundColor) ||
       isColorMeaningful(viewProps.foregroundColor) ||
-      viewProps.events.bits.any() ||
       !(viewProps.yogaStyle.border() == YGStyle::Edges{}) ||
       !viewProps.testId.empty();
 
diff --git a/packages/rn-tester/js/examples/Experimental/W3CPointerEventsExample.js b/packages/rn-tester/js/examples/Experimental/W3CPointerEventsExample.js
index e37886c1e17..020e563bc3a 100644
--- a/packages/rn-tester/js/examples/Experimental/W3CPointerEventsExample.js
+++ b/packages/rn-tester/js/examples/Experimental/W3CPointerEventsExample.js
@@ -80,7 +80,7 @@ function EventfulView(props: {|
     .join(', ');
 
   return (
-    <View ref={ref} {...listeners} {...restProps} collapsable={false}>
+    <View ref={ref} {...listeners} {...restProps}>
       <View style={styles.row}>
         <Text>
           {props.name}, {tag}, {listeningTo}