You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

NgRx新手求助:如何为Angular项目的NgRx Action编写测试用例

Testing NgRx Action Dispatch in Angular's ProjActionCreator

Got it, let's break down how to test your ProjActionCreator's insertRecord method properly. The core goal here is verifying that when you call insertRecord, the NgRx Store's dispatch method is triggered with the correct action type and payload—no need for a real Store instance, just a spy object to track calls.

Here's a step-by-step solution with full test code:

1. Set Up the Spy for NgRx Store

First, we'll create a spy object for the Store class, mocking only the dispatch method we care about. This lets us track when and how dispatch is called without spinning up a real NgRx store.

2. Instantiate Your Action Creator with the Spy

Pass the spy store into your ProjActionCreator so all dispatch calls go through our spy instead of a real store.

3. Run the Test & Assert Results

Call insertRecord with test data, then verify that dispatch was called exactly once, with the right action type and payload.


Full Test Code Example

import { ProjActionCreator, ProjAction } from './your-file-path'; // Update this path
import { Store } from '@ngrx/store';
import { Action } from '@ngrx/store';

describe('ProjActionCreator', () => {
  let actionCreator: ProjActionCreator;
  let storeSpy: jasmine.SpyObj<Store>;

  beforeEach(() => {
    // Create a spy for the Store, only mocking the `dispatch` method
    storeSpy = jasmine.createSpyObj('Store', ['dispatch']);

    // Initialize the action creator with our spy store
    actionCreator = new ProjActionCreator(storeSpy);
  });

  it('should dispatch INSERT_RECORD action with the provided payload', () => {
    // Define test data to pass to insertRecord
    const testPayload = { id: 123, content: 'Test Project Record' };

    // Call the method we're testing
    actionCreator.insertRecord(testPayload);

    // Verify dispatch was called exactly once
    expect(storeSpy.dispatch).toHaveBeenCalledTimes(1);

    // Extract the dispatched action from the spy's call history
    const dispatchedAction = storeSpy.dispatch.calls.mostRecent().args[0];

    // Assert the action has the correct type and payload
    expect(dispatchedAction.type).toBe(ProjAction.INSERT_RECORD);
    expect(dispatchedAction.payload).toEqual(testPayload);
  });
});

Why This Works (And Fixes Your Spy Issue)

If your previous spy attempts failed, it's likely because:

  • You weren't injecting the spy store into your ProjActionCreator instance (you need to pass the spy instead of a real Store).
  • You weren't properly tracking the dispatch method on the spy. Using jasmine.createSpyObj ensures we're mocking the exact method the action creator uses.

This approach keeps your test fast and isolated—we don't need to set up a full NgRx test bed, we just verify the interaction between your action creator and the store.

内容的提问来源于stack exchange,提问作者Nik Varma

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.07 20:02:50