Angular单元测试中如何验证双if条件判断？

业务代码（.ts） #

public showStatus(str: Event) {
  if (this.currUser != null && this.statusValid.valid) {
    const status = new Status();
    status.statustext = this.statusValid.value;
    status.name = this.currUser.username;

    if (str.statuses == null) {
      str.statuses = new Statuses(); // 注：原代码里写的是event，应该是str，属于笔误
    }

    str.statuses.allstatus.push(status);
  }
}

你当前的测试用例 #

it('should validate', () => {
  spyOn(obj, 'showStatus').and.returnValue(true);
  component.showStatus(mockdata);
});

正确的测试用例编写思路与示例 #

你现在的测试只是把showStatus方法mock掉并返回true，根本没验证方法内部的核心逻辑。得针对双条件都满足和条件不满足的场景分别写测试：

1. 测试双条件都满足时的逻辑 #

手动把currUser和statusValid设成符合条件的状态，调用方法后，检查传入的str对象里的statuses.allstatus是否正确添加了预期的Status实例。

it('should add status to str.statuses.allstatus when currUser exists and statusValid is valid', () => {
  // 准备测试数据
  const mockEvent: Event = { statuses: null }; // 根据你的Event实际类型调整结构
  component.currUser = { username: 'test-user' }; // 给组件的currUser赋值
  component.statusValid = { valid: true, value: 'test-status-content' }; // 设置statusValid为有效状态

  // 调用目标方法
  component.showStatus(mockEvent);

  // 验证结果
  expect(mockEvent.statuses).toBeInstanceOf(Statuses); // 确认statuses被初始化
  expect(mockEvent.statuses.allstatus.length).toBe(1); // 确认数组新增了一条数据
  expect(mockEvent.statuses.allstatus[0].name).toBe('test-user'); // 验证用户名正确
  expect(mockEvent.statuses.allstatus[0].statustext).toBe('test-status-content'); // 验证状态文本正确
});

2. 测试条件不满足的场景 #

要覆盖所有条件不满足的情况：

• currUser为null，statusValid.valid为true
• currUser存在，statusValid.valid为false
• currUser为null，statusValid.valid为false

举其中一个场景的例子：

it('should do nothing when currUser is null', () => {
  const mockEvent: Event = { statuses: { allstatus: [] } };
  component.currUser = null;
  component.statusValid = { valid: true, value: 'test-text' };

  component.showStatus(mockEvent);

  // 确认数组没有新增数据
  expect(mockEvent.statuses.allstatus.length).toBe(0);
});

再看另一个场景：

it('should do nothing when statusValid is invalid', () => {
  const mockEvent: Event = { statuses: { allstatus: [] } };
  component.currUser = { username: 'test-user' };
  component.statusValid = { valid: false, value: 'test-text' };

  component.showStatus(mockEvent);

  expect(mockEvent.statuses.allstatus.length).toBe(0);
});

注意点 #

• 测试前要确保组件的currUser和statusValid都被正确初始化，别依赖未赋值的变量
• 如果Status或Statuses是自定义类，要保证测试环境里能正常实例化它们
• 先修复业务代码里的笔误：event.statuses = new Statuses();应该改成str.statuses = new Statuses();，不然代码跑不起来

内容的提问来源于stack exchange，提问作者marshmellow