feat: freeze complete state and not just delta in patchState

Author: rainerhahnekamp

modules/signals/spec/deep-freeze.spec.ts

@@ -1,4 +1,4 @@
-import { patchState } from '../src/state-source';
+import { getState, patchState } from '../src/state-source';
 import { signalState } from '../src/signal-state';
 import { signalStore } from '../src/signal-store';
 import { TestBed } from '@angular/core/testing';
@@ -52,6 +52,64 @@ describe('deepFreeze', () => {
           "Cannot assign to read only property 'firstName' of object"
         );
       });
+      describe('mutable changes outside of patchState', () => {
+        it('throws on reassigned a property of the exposed state', () => {
+          const state = stateFactory();
+          expect(() => {
+            state.user().firstName = 'mutable change 1';
+          }).toThrowError(
+            "Cannot assign to read only property 'firstName' of object"
+          );
+        });
+
+        it('throws when exposed state via getState is mutated', () => {
+          const state = stateFactory();
+          const s = getState(state);
+
+          expect(() => (s.ngrx = 'mutable change 2')).toThrowError(
+            "Cannot assign to read only property 'ngrx' of object"
+          );
+        });
+
+        it('throws when mutable change happens for', () => {
+          const state = stateFactory();
+          const s = { user: { firstName: 'M', lastName: 'S' } };
+          patchState(state, s);
+
+          expect(() => {
+            s.user.firstName = 'mutable change 3';
+          }).toThrowError(
+            "Cannot assign to read only property 'firstName' of object"
+          );
+        });
+      });
     });
   }
+
+  describe('special tests', () => {
+    for (const { name, mutationFn } of [
+      {
+        name: 'location',
+        mutationFn: (state: { location: { city: string } }) =>
+          (state.location.city = 'Paris'),
+      },
+      {
+        name: 'user',
+        mutationFn: (state: { user: { firstName: string } }) =>
+          (state.user.firstName = 'Jane'),
+      },
+    ]) {
+      it(`throws on concatenated state (${name})`, () => {
+        const UserStore = signalStore(
+          { providedIn: 'root' },
+          withState(initialState),
+          withState({ location: { city: 'London' } })
+        );
+        const store = TestBed.inject(UserStore);
+        const state = getState(store);
+
+        expect(() => mutationFn(state)).toThrowError();
+      });
+    }
+  });
 });

modules/signals/src/signal-state.ts

@@ -1,14 +1,15 @@
 import { signal } from '@angular/core';
 import { STATE_SOURCE, WritableStateSource } from './state-source';
 import { DeepSignal, toDeepSignal } from './deep-signal';
+import { freezeInDevMode } from './deep-freeze';
 
 export type SignalState<State extends object> = DeepSignal<State> &
   WritableStateSource<State>;
 
 export function signalState<State extends object>(
   initialState: State
 ): SignalState<State> {
-  const stateSource = signal(initialState as State);
+  const stateSource = signal(freezeInDevMode(initialState as State));
   const signalState = toDeepSignal(stateSource.asReadonly());
   Object.defineProperty(signalState, STATE_SOURCE, {
     value: stateSource,

modules/signals/src/state-source.ts

@@ -38,12 +38,11 @@ export function patchState<State extends object>(
 ): void {
   stateSource[STATE_SOURCE].update((currentState) =>
     updaters.reduce(
-      (nextState: State, updater) => ({
-        ...nextState,
-        ...(typeof updater === 'function'
-          ? updater(freezeInDevMode(nextState))
-          : updater),
-      }),
+      (nextState: State, updater) =>
+        freezeInDevMode({
+          ...nextState,
+          ...(typeof updater === 'function' ? updater(nextState) : updater),
+        }),
       currentState
     )
   );

modules/signals/src/with-state.ts

@@ -9,6 +9,7 @@ import {
   SignalStoreFeature,
   SignalStoreFeatureResult,
 } from './signal-store-models';
+import { freezeInDevMode } from './deep-freeze';
 
 export function withState<State extends object>(
   stateFactory: () => State
@@ -35,10 +36,12 @@ export function withState<State extends object>(
 
     assertUniqueStoreMembers(store, stateKeys);
 
-    store[STATE_SOURCE].update((currentState) => ({
-      ...currentState,
-      ...state,
-    }));
+    store[STATE_SOURCE].update((currentState) =>
+      freezeInDevMode({
+        ...currentState,
+        ...state,
+      })
+    );
 
     const stateSignals = stateKeys.reduce((acc, key) => {
       const sliceSignal = computed(