Fix reanimated regression (#1948)

package/src/external/reanimated/renderHelpers.ts

@@ -15,6 +15,13 @@ import {
 
 const _bindings = new WeakMap<Node<unknown>, unknown>();
 
+export const unbindReanimatedNode = (node: Node<unknown>) => {
+ const previousMapperId = _bindings.get(node);
+ if (previousMapperId !== undefined) {
+ stopMapper(previousMapperId as number);
+ }
+};
+
 export function extractReanimatedProps(props: AnimatedProps<any>) {
  if (!HAS_REANIMATED3 && !HAS_REANIMATED2) {
  return [props, {}];
@@ -76,7 +83,7 @@ export function bindReanimatedProps(
  node: Node<any>,
  reanimatedProps: AnimatedProps<any>
 ) {
- if (HAS_REANIMATED2) {
+ if (HAS_REANIMATED2 && !HAS_REANIMATED3) {
  return bindReanimatedProps2(container, node, reanimatedProps);
  }
  if (!HAS_REANIMATED3) {
@@ -92,8 +99,10 @@ export function bindReanimatedProps(
  const { SkiaViewApi } = global;
  const mapperId = startMapper(() => {
  "worklet";
- for (const propName in reanimatedProps) {
- node && node.setProp(propName, reanimatedProps[propName].value);
+ if (node) {
+ for (const propName in reanimatedProps) {
+ node.setProp(propName, reanimatedProps[propName].value);
+ }
  }
  // On React Native we use the SkiaViewApi to redraw because it can
  // run on the worklet thread (container.redraw can't)

package/src/renderer/HostConfig.ts

@@ -7,6 +7,7 @@ import type { SkiaValue } from "../values";
 import {
  bindReanimatedProps,
  extractReanimatedProps,
+ unbindReanimatedNode,
 } from "../external/reanimated/renderHelpers";
 
 import type { Container } from "./Container";
@@ -56,6 +57,7 @@ const appendNode = (parent: Node<unknown>, child: Node<unknown>) => {
 };
 
 const removeNode = (parent: Node<unknown>, child: Node<unknown>) => {
+ unbindReanimatedNode(child);
  return parent.removeChild(child);
 };