fix(signals): avoid throwing when in check throws [backport] (#5110)

Co-authored-by: Will Harney <62956339+wjhsf@users.noreply.github.com>

Author: nolanlawson

packages/@lwc/engine-core/src/framework/mutation-tracker.ts

@@ -7,6 +7,7 @@
 import { isFunction, isNull, isObject, isTrustedSignal } from '@lwc/shared';
 import { ReactiveObserver, valueMutated, valueObserved } from '../libs/mutation-tracker';
 import { subscribeToSignal } from '../libs/signal-tracker';
+import { safeHasProp } from './utils';
 import type { Signal } from '@lwc/signals';
 import type { JobFunction, CallbackFunction } from '../libs/mutation-tracker';
 import type { VM } from './vm';
@@ -34,15 +35,15 @@ export function componentValueObserved(vm: VM, key: PropertyKey, target: any = {
     }
 
     // The portion of reactivity that's exposed to signals is to subscribe a callback to re-render the VM (templates).
-    // We check check the following to ensure re-render is subscribed at the correct time.
+    // We check the following to ensure re-render is subscribed at the correct time.
     //  1. The template is currently being rendered (there is a template reactive observer)
     //  2. There was a call to a getter to access the signal (happens during vnode generation)
     if (
         lwcRuntimeFlags.ENABLE_EXPERIMENTAL_SIGNALS &&
         isObject(target) &&
         !isNull(target) &&
-        'value' in target &&
-        'subscribe' in target &&
+        safeHasProp(target, 'value') &&
+        safeHasProp(target, 'subscribe') &&
         isFunction(target.subscribe) &&
         isTrustedSignal(target) &&
         // Only subscribe if a template is being rendered by the engine

packages/@lwc/engine-core/src/framework/utils.ts

@@ -104,3 +104,16 @@ export function shouldBeFormAssociated(Ctor: LightningElementConstructor) {
 
     return ctorFormAssociated && apiFeatureEnabled;
 }
+
+// check if a property is in an object, and if the object throws an error merely because we are
+// checking if the property exists, return false
+export function safeHasProp<K extends PropertyKey>(
+    obj: unknown,
+    prop: K
+): obj is Record<K, unknown> {
+    try {
+        return prop in (obj as any);
+    } catch (_err) {
+        return false;
+    }
+}

packages/@lwc/integration-karma/test/signal/protocol/index.spec.js

@@ -6,6 +6,7 @@ import Parent from 'x/parent';
 import Child from 'x/child';
 import DuplicateSignalOnTemplate from 'x/duplicateSignalOnTemplate';
 import List from 'x/list';
+import Throws from 'x/throws';
 
 // Note for testing purposes the signal implementation uses LWC module resolution to simplify things.
 // In production the signal will come from a 3rd party library.
@@ -212,6 +213,15 @@ describe('signal protocol', () => {
 
         expect(subscribe).not.toHaveBeenCalled();
     });
+
+    it('does not throw an error for objects that throw upon "in" checks', async () => {
+        const elm = createElement('x-throws', { is: Throws });
+        document.body.appendChild(elm);
+
+        await Promise.resolve();
+
+        expect(elm.shadowRoot.querySelector('h1').textContent).toBe('hello');
+    });
 });
 
 describe('ENABLE_EXPERIMENTAL_SIGNALS not set', () => {

packages/@lwc/integration-karma/test/signal/protocol/x/throws/throws.html

@@ -0,0 +1,3 @@
+<template>
+    <h1>hello</h1>
+</template>

packages/@lwc/integration-karma/test/signal/protocol/x/throws/throws.js

@@ -0,0 +1,23 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {
+    foo;
+
+    constructor() {
+        super();
+
+        this.foo = new Proxy(
+            {},
+            {
+                has() {
+                    throw new Error("oh no you don't!");
+                },
+            }
+        );
+    }
+
+    renderedCallback() {
+        // access `this.foo` to trigger mutation-tracker.ts
+        this.bar = this.foo;
+    }
+}