Skip to content

Commit 3ce634d

Browse files
authored
Remove view flattening error for Text component (#3338)
## Description Right now our `Text` components causes error that `GestureDetector` received view that may be view flattened. Adding `collapsable` into `Text` is not possible, so we decided to remove the error. Android check is different because using `dynamic_pointer_cast` yields `false`, even though in debugger `shadowNode` can be seen as `TextShadowNode`. Also, I've decided to use Android Studio formatter, to make sure that everyone in the team will have the same results. ## Test plan Tested on _**Nested Text**_ example.
1 parent 7f90209 commit 3ce634d

File tree

3 files changed

+41
-20
lines changed

3 files changed

+41
-20
lines changed

android/src/main/jni/cpp-adapter.cpp

Lines changed: 21 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
11
#include <jni.h>
22
#include <jsi/jsi.h>
33

4+
#include <react/renderer/components/text/ParagraphShadowNode.h>
5+
#include <react/renderer/components/text/TextShadowNode.h>
46
#include <react/renderer/uimanager/primitives.h>
57

68
using namespace facebook;
79
using namespace react;
810

911
void decorateRuntime(jsi::Runtime &runtime) {
10-
auto isFormsStackingContext = jsi::Function::createFromHostFunction(
12+
auto isViewFlatteningDisabled = jsi::Function::createFromHostFunction(
1113
runtime,
12-
jsi::PropNameID::forAscii(runtime, "isFormsStackingContext"),
14+
jsi::PropNameID::forAscii(runtime, "isViewFlatteningDisabled"),
1315
1,
1416
[](jsi::Runtime &runtime,
1517
const jsi::Value &thisValue,
@@ -20,21 +22,28 @@ void decorateRuntime(jsi::Runtime &runtime) {
2022
}
2123

2224
auto shadowNode = shadowNodeFromValue(runtime, arguments[0]);
23-
bool isFormsStackingContext = shadowNode->getTraits().check(ShadowNodeTraits::FormsStackingContext);
25+
bool isViewFlatteningDisabled = shadowNode->getTraits().check(
26+
ShadowNodeTraits::FormsStackingContext);
2427

25-
return jsi::Value(isFormsStackingContext);
28+
// This is done using component names instead of type checking because
29+
// of duplicate symbols for RN types, which prevent RTTI from working.
30+
const char *componentName = shadowNode->getComponentName();
31+
bool isTextComponent = strcmp(componentName, "Paragraph") == 0 ||
32+
strcmp(componentName, "Text") == 0;
33+
34+
return jsi::Value(isViewFlatteningDisabled || isTextComponent);
2635
});
2736
runtime.global().setProperty(
28-
runtime, "isFormsStackingContext", std::move(isFormsStackingContext));
37+
runtime, "isViewFlatteningDisabled", std::move(isViewFlatteningDisabled));
2938
}
3039

3140
extern "C" JNIEXPORT void JNICALL
3241
Java_com_swmansion_gesturehandler_react_RNGestureHandlerModule_decorateRuntime(
33-
JNIEnv *env,
34-
jobject clazz,
35-
jlong jsiPtr) {
36-
jsi::Runtime *runtime = reinterpret_cast<jsi::Runtime *>(jsiPtr);
37-
if (runtime) {
38-
decorateRuntime(*runtime);
39-
}
42+
JNIEnv *env,
43+
jobject clazz,
44+
jlong jsiPtr) {
45+
jsi::Runtime *runtime = reinterpret_cast<jsi::Runtime *>(jsiPtr);
46+
if (runtime) {
47+
decorateRuntime(*runtime);
48+
}
4049
}

apple/RNGestureHandlerModule.mm

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
#import <ReactCommon/CallInvoker.h>
1515
#import <ReactCommon/RCTTurboModule.h>
1616

17+
#import <react/renderer/components/text/ParagraphShadowNode.h>
18+
#import <react/renderer/components/text/TextShadowNode.h>
1719
#import <react/renderer/uimanager/primitives.h>
1820
#endif // RCT_NEW_ARCH_ENABLED
1921

@@ -91,19 +93,29 @@ - (dispatch_queue_t)methodQueue
9193
#ifdef RCT_NEW_ARCH_ENABLED
9294
void decorateRuntime(jsi::Runtime &runtime)
9395
{
94-
auto isFormsStackingContext = jsi::Function::createFromHostFunction(
96+
auto isViewFlatteningDisabled = jsi::Function::createFromHostFunction(
9597
runtime,
96-
jsi::PropNameID::forAscii(runtime, "isFormsStackingContext"),
98+
jsi::PropNameID::forAscii(runtime, "isViewFlatteningDisabled"),
9799
1,
98100
[](jsi::Runtime &runtime, const jsi::Value &thisValue, const jsi::Value *arguments, size_t count) -> jsi::Value {
99101
if (!arguments[0].isObject()) {
100102
return jsi::Value::null();
101103
}
102104
auto shadowNode = shadowNodeFromValue(runtime, arguments[0]);
103-
bool isFormsStackingContext = shadowNode->getTraits().check(ShadowNodeTraits::FormsStackingContext);
104-
return jsi::Value(isFormsStackingContext);
105+
106+
if (dynamic_pointer_cast<const ParagraphShadowNode>(shadowNode)) {
107+
return jsi::Value(true);
108+
}
109+
110+
if (dynamic_pointer_cast<const TextShadowNode>(shadowNode)) {
111+
return jsi::Value(true);
112+
}
113+
114+
bool isViewFlatteningDisabled = shadowNode->getTraits().check(ShadowNodeTraits::FormsStackingContext);
115+
116+
return jsi::Value(isViewFlatteningDisabled);
105117
});
106-
runtime.global().setProperty(runtime, "isFormsStackingContext", std::move(isFormsStackingContext));
118+
runtime.global().setProperty(runtime, "isViewFlatteningDisabled", std::move(isViewFlatteningDisabled));
107119
}
108120
#endif // RCT_NEW_ARCH_ENABLED
109121

src/handlers/gestures/GestureDetector/useViewRefHandler.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import React, { useCallback } from 'react';
66
import findNodeHandle from '../../../findNodeHandle';
77

88
declare const global: {
9-
isFormsStackingContext: (node: unknown) => boolean | null; // JSI function
9+
isViewFlatteningDisabled: (node: unknown) => boolean | null; // JSI function
1010
};
1111

1212
// Ref handler for the Wrap component attached under the GestureDetector.
@@ -35,9 +35,9 @@ export function useViewRefHandler(
3535
updateAttachedGestures(true);
3636
}
3737

38-
if (__DEV__ && isFabric() && global.isFormsStackingContext) {
38+
if (__DEV__ && isFabric() && global.isViewFlatteningDisabled) {
3939
const node = getShadowNodeFromRef(ref);
40-
if (global.isFormsStackingContext(node) === false) {
40+
if (global.isViewFlatteningDisabled(node) === false) {
4141
console.error(
4242
tagMessage(
4343
'GestureDetector has received a child that may get view-flattened. ' +

0 commit comments

Comments
 (0)