NgRx Signal Store — How to write Unit Test

In this article we will learn how to write unit test for NgRx Signal Store. We will be using SIFERS approach to write unit test.

I am assuming that you have already setup angular application on you machine.

If not then you can create using below command

npm install -g @angular/cli
ng new my-app

Now we will generate an angular component using below command.

ng generate component post-list

Now we will add a service to fetch post list using below command.

ng generate service post-list

Now we will write a method in service to fetch data from API.
In this article we will be using fake API from https://jsonplaceholder.typicode.com

Add below code to your post-list.service.ts file.

export class PostListService {
  readonly API_URL = 'https://jsonplaceholder.typicode.com/todos';
  readonly httpClient = inject(HttpClient);

  get() {
    return this.httpClient.get(this.API_URL);
  }
}

Now we will add a new file for signal store and name it as post-list.store.ts.

First of all we add below type and interface to our store file. Which will be use to set loading state.