angular test fails at injector?

Question

I have the following component:

@Component({
  selector: 'app-comment-table',
  templateUrl: './comment-table.component.html',
  styleUrls: ['./comment-table.component.css']
})
export class CommentTableComponent implements OnInit {
  @Input() line: string;
  comments: Array<IComments>;
  constructor(private socketService: SocketService) {
    this.comments = [];
  }
  //some functions
}

and I am trying to test it with the following test:

class mockSocket {
  getComments() { return Observable.of() }
};

describe('Comment Table Component', () => {
  let fixture, comp, el;
  let mockSock = new mockSocket();

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [Ng2SmartTableModule],
      declarations: [CommentTableComponent],
      providers: [
        { provide: SocketService, useValue: mockSock }],
    });
  });

  it('should call service',
    inject([CommentTableComponent], (cmp: CommentTableComponent) => {
      spyOn(mockSock, 'getComments');
      cmp.ngOnInit();
      expect(mockSock.getComments).toHaveBeenCalled();
    }));
});

However, this test is failing with the error message:

Error at injectionError (webpack:///~/@angular/core/@angular/core.es5.js:1231:21 <- client/src/test.ts:6040:86) [ProxyZone] at noProviderError (webpack:///~/@angular/core/@angular/core.es5.js:1269:0 <- client/src/test.ts:6078:12) [ProxyZone]

I think the component only needs the SocketService provided to it, which I am providing, yet that error looks as though it is missing a provider? What am I doing wrong?

Answer 1

Add .compileComponents() to the TestBed creation, and wrap it in an async() function:

beforeEach( async( () => {
    TestBed.configureTestingModule( {
        imports: [ Ng2SmartTableModule ],
        declarations: [ CommentTableComponent ],
        providers: [
            { provide: SocketService, useValue: mockSock }
        ],
    } ).compileComponents();
} ) );

If that's not enough, wrap the inject in an async() as well:

it('should call service',
    async( inject( [ CommentTableComponent ], ( cmp: CommentTableComponent ) => {
        spyOn( mockSock, 'getComments' );
        cmp.ngOnInit();
        expect( mockSock.getComments ).toHaveBeenCalled();
} ) ) );