React Native: "ownKeys target is non-extensible but key is missing from trap result" when calling Object.entries

[ganselu]

When calling Object.entries / .keys / .values on a store entry with only primitives an exception is thrown
"ownKeys target is non-extensible but key is missing from trap result"
Issue only reproducible on Native Devices (Tested on Android and iOS)

Example:
https://snack.expo.dev/fyFeNWh0tFKuA5eA0rlCM

[dai-shi]

Thanks for reporting. Is this latest RN?
Can someone reproduce the same error without Valtio? (Just using Proxy and Reflect.)

[ganselu]

Thanks for the quick response.
RN-Version: 0.73.6

[ignaciosantise]

Hey @dai-shi 👋 were you able to find the cause of this issue?

[dai-shi]

Unfortunately not. We need someone to help dig into it.

[enzomanuelmangano]

@dai-shi I'm able to reproduce the issue with the latest version of React Native and Expo. Actually, the issue happens also after trying to console log the state.

The issue is caused by the "configurable" option in the createSnapshotDefault function:

const desc: PropertyDescriptor = {
  value,
  enumerable: enumerable as boolean,
  // This is intentional to avoid copying with proxy-compare.
  // It's still non-writable, so it avoids assigning a value.
  configurable: true, // This option is causing the crash on RN 
}

Although I have no idea why

[dai-shi]

Hi, thanks for investigating it.
In that case, I think you can reproduce the issue without Valtio easily.
Can you report it to RN repo and see if this change and the crash is intentional?

[tolypash]

Hey guys, any updates on this one? Happens with latest version of Valtio. Not on 1.10.5 though.

[dai-shi]

Just to confirm, does it reproduce with the latest version of v1 too, right?

I would need someone to help reproducing it without Valtio.

[overthemike]

I wonder if the fix in #988 could have fixed this as well?

[dai-shi]

ownKeys is used in vanilla.ts.

[k33lil]

Is there any help on this or workaround?

I tried even with v1, the same issue

[k33lil]

v1.6.3 is working fine, i tested with the latest react native version

[dai-shi]

#874 (comment)

I think it's an issue even without Valtio. Can anyone help?

[overthemike]

https://snack.expo.dev/@overthemike/valtio-test

I'm not sure if this is what you're looking for or not. It seems to work ok with the proxy object as well as the simple copy function that emulates snapshots.

[dai-shi]

Can someone reproduce the same error without Valtio? (Just using Proxy and Reflect.)

My intention was to reproduce the error without Valtio and reports to RN team to see if it's intentional.

[rendomnet]

I have this issue also! 2025

[dai-shi]

Yes, and it doesn't change from 2024. #874 (reply in thread)

[Amurmurmur]

This patch did the job for me:

diff --git a/esm/vanilla.mjs b/esm/vanilla.mjs
index 1234567..abcdefg 100644
--- a/esm/vanilla.mjs
+++ b/esm/vanilla.mjs
@@ -36,7 +36,7 @@
     }
     Object.defineProperty(snap, key, desc);
   });
-  return Object.preventExtensions(snap);
+  return snap;
 };
 const createHandlerDefault = (isInitializing, addPropListener, removePropListener, notifyUpdate) => ({
   deleteProperty(target, prop) {
@@ -63,6 +63,12 @@
     Reflect.set(target, prop, nextValue, receiver);
     notifyUpdate(["set", [prop], value, prevValue]);
     return true;
+  },
+  ownKeys(target) {
+    return Reflect.ownKeys(target);
+  },
+  preventExtensions(target) {
+    return false;
   }
 });
 const proxyStateMap = /* @__PURE__ */ new WeakMap();
diff --git a/vanilla.js b/vanilla.js
index 1234567..abcdefg 100644
--- a/vanilla.js
+++ b/vanilla.js
@@ -38,7 +38,7 @@
     }
     Object.defineProperty(snap, key, desc);
   });
-  return Object.preventExtensions(snap);
+  return snap;
 };
 const createHandlerDefault = (isInitializing, addPropListener, removePropListener, notifyUpdate) => ({
   deleteProperty(target, prop) {
@@ -65,6 +65,12 @@
     Reflect.set(target, prop, nextValue, receiver);
     notifyUpdate(["set", [prop], value, prevValue]);
     return true;
+  },
+  ownKeys(target) {
+    return Reflect.ownKeys(target);
+  },
+  preventExtensions(target) {
+    return false;
   }
 });
 const proxyStateMap = /* @__PURE__  */ new WeakMap();

[dai-shi]

+  ownKeys(target) {
+    return Reflect.ownKeys(target);
+  },

☝️ It seems no-op. Is that change required?

+  preventExtensions(target) {
+    return false;
+  }

☝️ I'm not sure if that is required either.

-  return Object.preventExtensions(snap);
+  return snap;

☝️ I guess that should be the workaround for RN. #752 added it for correctness but suboptimal.

If I understand it correctly like the above, it's great to know. I may reconsider something in v3. Meanwhile, I'm curious if it's RN's designed behavior, or a bug. Would anyone like to report it to RN, unless anything similar is reported?

[manakuro]

@dai-shi

This issue is caused by Hermes enforcing strict Proxy invariant checks. Specifically, Hermes requires that when a target object is non-extensible, the ownKeys trap must return all of the target's own keys — any mismatch results in a TypeError.

The root cause is that createSnapshotDefault calls Object.preventExtensions(snap) at the end of snapshot creation, making the snapshot non-extensible. This triggers Hermes's strict invariant check and throws.

The React Native team is aware of this limitation but has noted that the Proxy API is discouraged at Meta internally, so a fix on the Hermes side is not currently planned.

See: facebook/hermes#1609 (comment)

We are aware of the problem but haven't been able to work on it yet. Proxy is forbidden in React Native at Meta, because it is extremely slow, which makes it challenging to elevate this issue to high priority.

Workaround

Removing Object.preventExtensions from createSnapshotDefault resolves the issue, as described in the patch discussed the above.

However, this requires every React Native user to manually apply the patch, which is not a sustainable solution.

Proposal

It would be great if Valtio provided a built-in option to disable Object.preventExtensions for environments where it causes issues.

Two possible approaches:

Option 1: Per-hook option via useSnapshot

const snap = useSnapshot(state, { preventExtensions: false })

Option 2: Global override via unstable_replaceInternalFunction

import { unstable_replaceInternalFunction } from 'valtio'

unstable_replaceInternalFunction('createSnapshot', (originalCreateSnapshot) => {
  return (target, version) => {
    return originalCreateSnapshot(target, version, { preventExtensions: false });
  };
});

This would require a small change to createSnapshotDefault to accept an options argument:

const createSnapshotDefault = <T extends object>(
  target: T,
  version: number,
+  options?: { preventExtensions?: boolean },
): T => {
+  const preventExtensions = options?.preventExtensions ?? true
  const cache = snapCache.get(target)
  if (cache?.[0] === version) {
    return cache[1] as T
  }
  const snap: any = Array.isArray(target)
    ? []
    : Object.create(Object.getPrototypeOf(target))
  markToTrack(snap, true) // mark to track
  snapCache.set(target, [version, snap])
  Reflect.ownKeys(target).forEach((key) => {
    if (Object.getOwnPropertyDescriptor(snap, key)) {
      // Only the known case is Array.length so far.
      return
    }
    const value = Reflect.get(target, key)
    const { enumerable } = Reflect.getOwnPropertyDescriptor(
      target,
      key,
    ) as PropertyDescriptor
    const desc: PropertyDescriptor = {
      value,
      enumerable: enumerable as boolean,
      // This is intentional to avoid copying with proxy-compare.
      // It's still non-writable, so it avoids assigning a value.
      configurable: true,
    }
    if (refSet.has(value as object)) {
      markToTrack(value as object, false) // mark not to track
    } else if (proxyStateMap.has(value as object)) {
      const [target, ensureVersion] = proxyStateMap.get(
        value as object,
      ) as ProxyState
+      desc.value = createSnapshotDefault(target, ensureVersion(), options) as Snapshot<T>
    }
    Object.defineProperty(snap, key, desc)
  })
+  return preventExtensions
+    ? Object.preventExtensions(snap)
+    : snap
}

[dai-shi]

Given that Hermes is widely used by RN users, and if there is no hope that Hemes fixes it, I'm fine to drop Object.preventExtensions completely. Please open a PR.