NgRX SignalStore not water tight fails references intermittent

[nhhockeyplayer]

Which @ngrx/* package(s) are the source of the bug?

signals

Minimal reproduction of the bug/regression with instructions

all I can do is post my signalstore

my codebase is large NX Monorepo

the pundit/czar should be fully capable of seeing any anomalies

PROBLEM

I originally had a simple NgRX "IUserPojo[]" state that ran beautiful, populated my UI with the collection flawlessly with ActionGroup, effects, reducers and selectors

I converted my NgRX IUsers state to SignlState

Now its intermittent

UI gets populated 'whenever' sometimes not all the time moreso... no crashes or stack traces

Oh and btw, this new standard of wide open javascript model (micromodel which nx, rxjs, d3.js implement is pure javascript under the hood) imposes its entire implementation model onto the user for its use-model when its only been successfully demonstrated for frameworks as noted. You dont pollute and corrupt the implementation use-model with what rightfully should be obfuscated. Some say javascript is so dangerous its unfit for any commercial development. Well when you see a company commit to objects, properties, closures, functional programming (fast whiz bang one-liners and crafty javascript constructs) it grows into a malignancy. Ask a react programmer who is wrestling with critical mass and unablt to find that lost clobbered reference hidden beneath the chaos.

This wide open micromodel obviously new standard being pushed by angular signal has even impacted the IDE, refactoring has been observed breaking during attempted refactoring.

Im a critic of javascript and react they are pure javascript and do not follow object oriented principles and I have deemed javascript commercially unfit tinkering with regard to objects, properties, functional programming functions/closures anonymous functions and short-cuts therein.

impact widespread
NOW... being able to debug flawlessly prior...with SignalStore, the IDE is unable to even debug or hit s breakpoint IDE algorithms are no way even ABLE to articulate source code maps to even hit a breakpoint its so intermittent and unpredictable. We are sent back to the printf school of debugging now.

for my signalstore... I would love to be proven wrong but signalstore as driven by the google architects is driving the field now and I state its a wrong path, they may as well have chosen lisp or prolog and javascript habits are too hard to break... solution.... react developers have hijacked angular and ngrx and re-architecting the entire thing to fit their brains.

SignalStore smashes NgRX elite reliable commercially successful redux pattern to smithereens and to pure javascript
only thing salvagable are actions/events and effects
signals are suppose to be the glue resolving references and observables and its opened the door to intermittent chaos

one day this pattern will be obfuscated in its entirety from the so many times its been re-architected starting with PROPS (a react named construct). Nice job on generics but Im not impressed sorry (the signalers at google)

FACTS

• store.usersEvents.find() // kicks off the action from appComponent.ts:onInit()
• effects gets triggered faithfully every time
• reducer gets called everytime spreading immutable collection
• this NgRX state IS populated into the NgRX state construct IUsersState
• UI gets updated intermittently
• setTimeout calls need to be dispersed and even those fail

SignalStore requires us to PATCH this (another level of indirection by way of references and point of failure) into the SignalStore (which is the glue and supposedly updates the reference of the signal)

nothing works
Im coding normally with observables, one SignalStore and simple crud table that works flawlessly

So here is my code

CODE CONSUMPTIONS
app.component.ts

	readonly store = inject(UsersStore)
	readonly events = injectDispatch(usersEvents);
	readonly dispatcher = inject(Dispatcher)

         this.users$ = combineLatest([of(this.store.users()), this.imageService.getData(this.env.defaultUrl + 'public/avatar.png')])

	ngOnInit() {
		const event = usersEvents.find()
		this.dispatcher.dispatch(event)
	}

tab-component.ts

        <app-usertable [users$]="observableStream$"></app-usertable>

	public observableStream$: Observable<UserPojo[]>

	ngAfterViewInit(): void {
		setTimeout(() => {
			this.observableStream$ = of(this.store.users())
			})
		}, 2000) 
	}

ACTIONS

export const usersEvents = eventGroup({
	source: 'users',
	events: {
		error: type<{payload: string}>(),
		reset: type<void>(),
		find: type<void>(),
		findSuccess: type<IUserPojo[]>(),
		queryGraphQL: type<void>(),
		queryGraphQLSuccess: type<{payload: IUserPojo[]}>(),
		changed: type<{payload: IUsersState}>(),
		changedSuccess: type<{payload: IUserPojo[]}>(),
	},
})

EFFECTS

export function withUsersEffectsFeature() {
	return signalStoreFeature(
		withEffects((store) => {
			const events = inject(Events)
			const notificationService = inject(MatSnackBarNotificationService)
			const svc = inject(HttpUserApiService)

			return {
				usersError$: events.on(usersEvents.error).pipe(
					map((error) => error.payload),
					exhaustMap((err: any) => {
						notificationService.error('NgRX Effect FAILURE' + err.message)
						return of(err)
					}),
				),

				find$: events.on(usersEvents.find).pipe(
					exhaustMap(() => {
						return svc.find().pipe(
							skipWhile((collection) => !collection),
							skipWhile((collection) => collection.length <= 0),
							map((collection) => {
								notificationService.info('*** ' + collection.length + ' *** users-effects FOUND sending into NgRX state')
								return usersEvents.findSuccess(collection)
							}),
							catchError((err) => of(usersEvents.error(err))),
						)
					}),
				),
			}
		}),
	)
}

Reducer

export interface IUsersState {
	users: IUserPojo[]
}

export const initialUsersState: IUsersState = {
	users: [] as IUserPojo[],
}

export function withUsersReducer<_>() {
	return signalStoreFeature(
		type<{state: IUsersState}>(),
		withState<IUsersState>(initialUsersState),
		withReducer(
			on(usersEvents.reset, () => initialUsersState),

			on(usersEvents.findSuccess, (event) => {
				return {users: [...event.payload]}
			}),
		),
	)
}

SignalStore

export const UsersStore = signalStore(
	{providedIn: 'root'},
	withProps(() => ({
		_dispatcher: inject(Dispatcher),
	})),
	withDevtools('users'),
	withState<IUsersState>(initialUsersState),
	withUsersEffectsFeature(),
	withUsersReducer<IUsersState>(),
	withMethods((store) => ({
		find() {
			const event = usersEvents.find()
			store._dispatcher.dispatch(event)

			setTimeout(() => {
				console.log(' *** STORE allUsers() CALLED 3000 3-secs delivered patched state FIND() users count -->', store.users.length),
					patchState(store, (state) => ({
						users: [...state.users],
					}));
			}, 5000)
		},

		findUser(id: string | number | Types.ObjectId) {
			store.users().find((user) => user._id === id)
		},

		allUsers() {
			setTimeout(() => {
				console.log(' *** STORE allUsers() CALLED 3000 3-secs delivered patched state FIND() users count -->', store.users.length),
					patchState(store, (state) => ({
						users: [...state.users],
					}))
			}, 10)

			return store.users()
		},
	})),
	withComputed(({users}) => ({
		stream: computed(() => users()),
		stream$: computed(() => of(users())),
		count: computed(() => users.length),
	})),
	withHooks((store) => ({
		onInit() {
			store.find()
		},
	})),
)

Expected behavior

signalstore should be able to cleanly articulate references and observables

it dont
SignalStore has chosen to manage payloads, references with javascript objects properties and functional programming functions/closures

very unpredictable
very intermittent
recipe for production failures****

Versions of NgRx, Angular, Node, affected browser(s) and operating system(s)

		"@ngrx/component": "^19.0.1",
		"@ngrx/component-store": "^19.0.1",
		"@ngrx/effects": "^19.0.1",
		"@ngrx/entity": "^19.0.1",
		"@ngrx/operators": "^19.0.1",
		"@ngrx/router-store": "^19.0.1",
		"@ngrx/signals": "^19.2.1",
		"@ngrx/store": "^19.0.1",
		"ngrx-store-freeze": "^0.2.4",
		"ngrx-store-logger": "^0.2.4",
		"@angular-architects/ngrx-toolkit": "^19.1.0",
		"@ngrx/schematics": "^19.0.0",
		"@ngrx/signals": "^19.2.1",
		"@ngrx/store-devtools": "^19.0.0",

NX Report complete - copy this into the issue template

Node : 22.16.0
OS : darwin-arm64
Native Target : aarch64-macos
yarn : 1.22.22

nx (global) : 21.3.0
nx : 21.3.0
@nx/js : 21.3.0
@nx/jest : 21.3.0
@nx/eslint : 21.3.0
@nx/workspace : 21.3.0
@nx/angular : 21.3.0
@nx/cypress : 21.3.0
@nx/devkit : 21.3.0
@nx/esbuild : 21.3.0
@nx/eslint-plugin : 21.3.0
@nx/express : 21.3.0
@nx/module-federation : 21.3.0
@nx/nest : 21.3.0
@nx/node : 21.3.0
@nx/playwright : 21.3.0
@nx/rspack : 21.3.0
@nx/web : 21.3.0
@nx/webpack : 21.3.0
typescript : 5.8.3

Registered Plugins:
@nx/eslint/plugin
@nx/webpack/plugin
@nx/cypress/plugin
@nx/eslint/plugin
@nx/webpack/plugin
@nxext/capacitor/plugin
@nx/rspack/plugin

Community plugins:
@compodoc/compodoc : 1.1.26
@fortawesome/angular-fontawesome : 1.0.0
@ionic/angular : 8.6.5
@ngrx/component : 19.2.1
@ngrx/component-store : 19.2.1
@ngrx/effects : 19.2.1
@ngrx/entity : 19.2.1
@ngrx/operators : 19.2.1
@ngrx/router-store : 19.2.1
@ngrx/schematics : 19.2.1
@ngrx/signals : 19.2.1
@ngrx/store : 19.2.1
@ngrx/store-devtools : 19.2.1
@nxext/capacitor : 20.2.0
@nxext/ionic-angular : 20.1.0
angular-eslint : 20.0.0
apollo-angular : 8.0.2

Cache Usage: 93.26 MB / 372.19 GB

Other information

Here is my code

I would be willing to submit a PR to fix this issue

• Yes
• No

[nhhockeyplayer]

UI
nothing to display

[nhhockeyplayer]

UI
table populated fine happens 3 out of ten times

[markostanimirovic]

Please create a reproduction via Stackblitz or GitHub repo, with a clear description and full focus on the potential bug:

1. What is the current behavior
2. What is the expected behavior

[nhhockeyplayer]

thanks friend for paying attention

if I get time, I doubt that I will have to hack up alot and produce an entire re-write smaller

codebase is large and too dependent
so I do not think this is going to happen
I spent 5 days shaking out SignalStore already and its consumed everything chasing after these referenced props

and my stance rightfully feels we shouldn't be here Im trying to develop code and continue to be prevented by what angular team keeps putting out

the only framework thats helped my productivity is the Nx team

my code posted shows several event origins and I have tried everyone in different variations whittled down to ONE ORIGIN event and each one has same results

sorry to be such a critique but I have watched corps go chapt-11 centering on functional programming, closures, props and objects and tinkering at such micro-model level

Signals have introduced the wild wild west with javascript and the entryway obviously react javascript sympathizers who love the whiz bang short-cuts and that mindset is extremely difficult to break

If these teams pushing signals are spent chasing after these wild west references they need to be honest because the field is asking for SignalStore and the hype is obvious. Cute but dangerous.

if I get time/energy I will post a stackblitz

ciao

[nhhockeyplayer]

Please create a reproduction via Stackblitz or GitHub repo, with a clear description and full focus on the potential bug:

1. What is the current behavior
2. What is the expected behavior
   current behavior INTERMITTENT
   ui shows table collection 3 out of 10 times either just sitting rendering or manual refresh on browser neither matters

expected behavior UI Should render clean 1st pass
UI should retain the javascript reference within the signal store (the bidirectional glue) to properties and within observables

[nhhockeyplayer]

Let me know if you want access to repo I can grant you access to my repo

[rainerhahnekamp]

@nhhockeyplayer, don't get me wrong, criticism is always good, but if we should help you, you need to help us well.

Currently, it’s challenging for me to grasp the underlying issue. Could you try to summarize the main problem in just a few sentences?

A minimal repro would also help a lot — StackBlitz is ideal, as Marko mentioned. Bonus points if you can use that!

[nhhockeyplayer]

angular signals has a reference bug
or signalstore has a reference bug

my collections works beautiful as depicted in the console
console.log statements show my collection

so they are making it to the effects
THOUGH the debugger refuses to step and break within my effects line whereby I send the usersEvents.FindSuccess(collection)
this implies a reference bug whereby something is getting clobbered and corruption
obviously an object reference

it worked fine prior no issues

issue occurs only when signalstore is introduced

everything up to effects and reducer appear legit and runs great

its the signalstore thats not reflecting patch to its state with an intermittent reference issue and its intermittent

1-3 times out of ten the table shows business objects
table is empty most of time

signals are not holding water with this and observables

so i hope that makes sense

and i hope im wrong

but I have banged at this for 5 days and shook it up pretty hard

[nhhockeyplayer]

there is a warning in the console about overriding users

i thought your team might be able to spot why that is
and whats causing it
in my code snippets

the signalstore is clean by definition nothing unusual standing out

[rainerhahnekamp]

Thanks, I understand the problem better now.

First about the warning: It tells you that you must have two properties or methods with the same name "users".

---

When the effects run and show you the correct data, but you don't see it in your table, can you

• Make sure that you don't have issues with the change detection, i.e. dirty marking doesn't work
• Is your effect running on the same signal that you are using in your template?
• The NgRx Toolkit comes with a feature called withImmutableState. It would throw if you have somewhere mutable changes. It should be worth giving it a try: https://ngrx-toolkit.angulararchitects.io/docs/with-immutable-state

[nhhockeyplayer]

Thank you Rainer,
Im pegged for next day or two but will be back at it
I will review my change detection marking

effect is running on same signal, the signal gets injected in appComponent, tabComponent, 2 router resolvers and of course effects and reducer

And the signal gets run each time I see it passing thru in debugger on each consumers construction (what effect on references would this have... is SignalStore meant to be used as singleton (by reference)? or by value? ... if by reference this could be a shared reference pool issue across all consumers because its behaving like by value with references everywhere across all consumers.)

I will also checkout ngrx-toolkit

thanks

if anything breaks on your side of the fence from my postings please advise

• cheers
  KEN

[nhhockeyplayer]

• Make sure that you don't have issues with the change detection, i.e. dirty marking doesn't work
• Is your effect running on the same signal that you are using in your template?

changes.markForChange() is isolated to an imageWidget self contained

effect is running on same signal as injected by appComponent
template though is using observable in separate component/tab but has to inject the store to get to the signal collection and wrap it up in observable so my template has no real direct access to the signal beyond receiving its collection within a transient observable

so I dont know whats causing this corruption spanning components its definitely signalstore or signals beneath

the corruption is there and I know it when i see it (no more breaks at breakpoints)

my gut feel is it has to do with the references being tracked by the signal eFrastructure there is a break in integrity across the store being initialized across 3 components and then the redux attempting to run thru after

something is being clobbered and leading the runtime astray

I feel firm this is a bug
I been developing this codebase for months now with pure clean debugging using ngrx, d3.js angular and more inside an nx monorepo

I wish I had better to report about signals just seen too much trouble with javascript and functional closure (including promise) programming

I will try to get a repo together by end of week

and zip it up, Nx lends very well to this need so it will be in the form of an Nx monorepo but trimmed down

• cheers

[rainerhahnekamp]

Thanks for the update. It would be great if you can provide us with an example. Very curious about it.

[nhhockeyplayer]

Hello Rainer,

since you've taken interest

I attempted to create a trimmed down repo and no chance. Too much work.
I think my repo is a great test anyway.
I granted you admin privs to 2 pkg's and the repo
Feel free to download and give it a whirl

repo
https://github.com/nhhockeyplayer/meanstack

there is a clean.zsh script at root of the Nx monorepo
if your adept to setting up a mongodb instance named 'energy; thats all you need to do

• launch mongodb

mongod --dbpath ~/data/db --bind_ip 127.0.0.1 --config /usr/local/etc/mongod.conf --noauth --bind_ip_all

• launch mongosh if you want to peek at objects

mongosh
use energy

my repo does the rest automagically that will automatically launch and seed on boot

what the clean script does is just that, resets node_modules, cleans cache, installs pkgs, runs build and launches server which auto-seeds itself

launch clean script (does it all)
% source .clean.zsh

then goto another terminal and launch the nx app
nx serve signs

or you can try to set it up manually
install
build
launch server & app

rm -rf node_modules
yarn install
nx run-many --all --target build
nx serve admin-api
nx serve signs

let me know if you like this

KEN

[rainerhahnekamp]

Thanks, I will open an issue in your repo then, where we can discuss issues I might encounter during the setup.

[nhhockeyplayer]

Thanks, I will open an issue in your repo then, where we can discuss issues I might encounter during the setup.

its turnkey
just make sure latest Nx is installed to be on course

yarn global add nx@latest

I just migrated to very latest NX

and checkout my nx report for more revisions

• cheers

[markostanimirovic]

I'm going to convert this issue to a Q&A discussion. If there is a bug with SignalStore, it should be doable to create a minimal reproduction via Stackblitz playground or a public GitHub repo without Nx, Mongo, or any other third-party tool.