反应形式getter函数单元测试角度答案

【问题标题】：Reactive form getter function unit test angular反应形式getter函数单元测试角度
【发布时间】：2021-08-03 11:07:30
【问题描述】：

getter 函数的角度单元测试如何实现此方法。

 get f() {
        return this.setUpForm.controls;
      }
      get bp() {
        return (<FormGroup>this.setUpForm.get('bookingPeriodTime')).controls;
      }

【问题讨论】：

你刚刚删除了你的问题，所以我在这里评论：两个“JSON”“对象”实际上是数组（JSON是一种文本格式）。您可以简单地将它们 .concat() 放入一个数组中。

标签： angular unit-testing karma-jasmine

【解决方案1】：

 // imports

 
 @Component({
      selector: 'mock-form-component',
      template: `<form [formGroup]="form">
        <input formControlName="number"/>
<div formArrayName="bookingPeriodTime">
    <div *ngFor="let name of bookingPeriodTime.controls; index as i" [formGroupName]="i"></div>
</div>
      </form>`,
    })
    class HostComponent {
    this.form = this.formBuilder.group({
      number: new FormControl('',Validators.required )
      bookingPeriodTime: new FormArray([new FormGroup({ 
         name: new FormControl('name')
}),
  ]),
      });
    }

describe('SetUpFormComponent', () => {
  let component: SetUpFormComponent;
  let fixture: ComponentFixture<HostComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ReactiveFormsModule, FormsModule],
      declarations: [SetUpFormComponent, HostComponent]
    }).compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(SetUpFormComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create component', () => {
    expect(component).toBeTruthy();
  });

  it('should test getter f', () => {
const controls = this.formBuilder.group({
      number: new FormControl('',Validators.required )
      bookingPeriodTime: new FormArray([new FormGroup({ 
         name: new FormControl('name')
}),
  ]),
      });


   expect(component.f).toEqual(controls); 
  });

  it('should test getter bookingPeriodTime', () => {
   const bookingPeriodTime = this.formBuilder.group({
      number: new FormControl('',Validators.required )
      bookingPeriodTime: new FormArray([new FormGroup({ 
         name: new FormControl('name')
}),
  ]),
      });

expect(component.bp).toEqual(bookingPeriodTimeControl.get('bookingPeriodTime')).controls;); 
  });
});

【讨论】：