How to mock ControlContainer in angular unit test?

Thanks to @KiraAG for comment and was able to work out what was required from provided link, so posting answer here in case anyone else comes across this question

So in your test you need to provide the ControlContainer instance in your test module, this is basically going to be either a FormGroupDirective or a FormControlDirective depending on what you expect to be passed to your component.

For example, in your test file create the FormGroup that represents the part of the form you are using

const fg: FormGroup = new FormGroup({
  'answer': new FormControl(''),
  ...
});

Next create a FormGroupDirective and set the form property to the FormGroup created above

const fgd: FormGroupDirective = new FormGroupDirective([], []);
fgd.form = fg;

Now in you test module setup you can provide the ControlContainer

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [TestingModule],
      declarations: [ScoreCardComponent],
      providers: [
        { provide: ControlContainer, useValue: fgd }
      ]
      schemas: [NO_ERRORS_SCHEMA]
    })
      .compileComponents();
  }));

And that's it, the constructor injection is satisfied.


I used Neil Stevens's answer.

But I had

viewProviders: [{provide: ControlContainer, useExisting: FormGroupDirective}],

in the component.

So in tests I have to use

providers: [{provide: FormGroupDirective, useValue: fgd}],

Maybe this will help someone.