reduxjs · crutchcorn · Oct 9, 2024 · Oct 9, 2024 · Oct 9, 2024
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -60,7 +60,6 @@ After you have submitted your pull request, we'll try to get back to you as soon
 
 Thank you for contributing!
 
-
 # Cutting a release
 
 If you are a maintainer and want to cut a release, follow these steps:

diff --git a/angular.json b/angular.json
@@ -139,19 +139,15 @@
             "outputPath": "dist/angular-redux-injector-demo",
             "index": "projects/angular-redux-injector-demo/src/index.html",
             "browser": "projects/angular-redux-injector-demo/src/main.ts",
-            "polyfills": [
-              "zone.js"
-            ],
+            "polyfills": ["zone.js"],
             "tsConfig": "projects/angular-redux-injector-demo/tsconfig.app.json",
             "assets": [
               {
                 "glob": "**/*",
                 "input": "projects/angular-redux-injector-demo/public"
               }
             ],
-            "styles": [
-              "projects/angular-redux-injector-demo/src/styles.css"
-            ],
+            "styles": ["projects/angular-redux-injector-demo/src/styles.css"],
             "scripts": []
           },
           "configurations": {

diff --git a/projects/angular-redux-injector-demo/src/app/utils/async-run-in-injection-context.ts b/projects/angular-redux-injector-demo/src/app/utils/async-run-in-injection-context.ts
@@ -17,8 +17,6 @@ export const asyncRunInInjectionContext = <TReturn>(
   });
 };
 
-export type RunInInjectionContextProps<
-  T extends object,
-> = T & {
+export type RunInInjectionContextProps<T extends object> = T & {
   injector: EnvironmentInjector;
 };
diff --git a/projects/angular-redux-injector-demo/src/index.html b/projects/angular-redux-injector-demo/src/index.html
@@ -1,13 +1,13 @@
 <!doctype html>
 <html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>AngularReduxInjectorDemo</title>
-  <base href="/">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
-<body>
-  <app-root></app-root>
-</body>
+  <head>
+    <meta charset="utf-8" />
+    <title>AngularReduxInjectorDemo</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
 </html>
diff --git a/projects/angular-redux-injector-demo/src/main.ts b/projects/angular-redux-injector-demo/src/main.ts
@@ -2,5 +2,6 @@ import { bootstrapApplication } from '@angular/platform-browser';
 import { appConfig } from './app/app.config';
 import { AppComponent } from './app/app.component';
 
-bootstrapApplication(AppComponent, appConfig)
-  .catch((err) => console.error(err));
+bootstrapApplication(AppComponent, appConfig).catch((err) =>
+  console.error(err),
+);
diff --git a/projects/angular-redux-injector-demo/tsconfig.app.json b/projects/angular-redux-injector-demo/tsconfig.app.json
@@ -6,10 +6,6 @@
     "outDir": "../../out-tsc/app",
     "types": []
   },
-  "files": [
-    "src/main.ts"
-  ],
-  "include": [
-    "src/**/*.d.ts"
-  ]
+  "files": ["src/main.ts"],
+  "include": ["src/**/*.d.ts"]
 }
diff --git a/projects/angular-redux/src/lib/inject-selector.ts b/projects/angular-redux/src/lib/inject-selector.ts
@@ -1,6 +1,7 @@
 import { EqualityFn } from './types';
 import {
   assertInInjectionContext,
+  DestroyRef,
   effect,
   inject,
   Signal,
@@ -80,6 +81,7 @@ export function createSelectorInjection(): InjectSelector {
   ): Signal<Selected> => {
     assertInInjectionContext(injectSelector);
     const reduxContext = inject(ReduxProvider);
+    const destroyRef = inject(DestroyRef);
 
     const { equalityFn = refEquality } =
       typeof equalityFnOrOptions === 'function'
@@ -90,19 +92,17 @@ export function createSelectorInjection(): InjectSelector {
 
     const selectedState = signal(selector(store.getState()));
 
-    effect((onCleanup) => {
-      const unsubscribe = subscription.addNestedSub(() => {
-        const data = selector(store.getState());
-        if (equalityFn(selectedState(), data)) {
-          return;
-        }
+    const unsubscribe = subscription.addNestedSub(() => {
+      const data = selector(store.getState());
+      if (equalityFn(selectedState(), data)) {
+        return;
+      }
 
-        selectedState.set(data);
-      });
+      selectedState.set(data);
+    });
 
-      onCleanup(() => {
-        unsubscribe();
-      });
+    destroyRef.onDestroy(() => {
+      unsubscribe();
     });
 
     return selectedState;

diff --git a/projects/angular-redux/src/tests/inject-selector-and-dispatch.spec.ts b/projects/angular-redux/src/tests/inject-selector-and-dispatch.spec.ts
@@ -1,9 +1,10 @@
 import { Component } from '@angular/core';
-import { render } from '@testing-library/angular';
+import { render, waitFor } from '@testing-library/angular';
 import '@testing-library/jest-dom';
 import { configureStore, createSlice } from '@reduxjs/toolkit';
 import { provideRedux, injectDispatch, injectSelector } from '../public-api';
 import { userEvent } from '@testing-library/user-event';
+import { createStore } from 'redux';
 
 const user = userEvent.setup();
 
@@ -70,3 +71,32 @@ it('injectSelector should work with reactivity', async () => {
 
   expect(getByText('Count: 1')).toBeInTheDocument();
 });
+
+it('should show a value dispatched during ngOnInit', async () => {
+  const store = configureStore({
+    reducer: {
+      counter: counterSlice.reducer,
+    },
+  });
+
+  @Component({
+    selector: 'app-root',
+    standalone: true,
+    template: '<p>Count: {{count()}}</p>',
+  })
+  class Comp {
+    count = injectSelector((state: any) => state.counter.value);
+    dispatch = injectDispatch();
+    increment = counterSlice.actions.increment;
+
+    ngOnInit() {
+      this.dispatch(this.increment());
+    }
+  }
+
+  const { getByText } = await render(Comp, {
+    providers: [provideRedux({ store })],
+  });
+
+  await waitFor(() => expect(getByText('Count: 1')).toBeInTheDocument());
+});
Original file line number	Diff line number	Diff line change
Expand Up		@@ -60,7 +60,6 @@ After you have submitted your pull request, we'll try to get back to you as soon

		Thank you for contributing!


		# Cutting a release

		If you are a maintainer and want to cut a release, follow these steps:
Expand Down