7

people! Please, be kind to share your ideas about fixing the following. While writing a test for Angular2 component I encountered this kind of error:

Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

The component under test is: (sorry, it is bulky)

The test:

import { TestBed, ComponentFixture, async, inject } from '@angular/core/testing';
import { DebugElement } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {Injectable} from '@angular/core';

import {FormGroup, FormBuilder, ReactiveFormsModule} from '@angular/forms';

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/of';

import SignupComponent from './signup.component';
import {UserService} from '../services/user.service';


@Injectable()
export class MockUserService {
    public signup(user: any) {
        return Observable.of({});
    }
}

let component: SignupComponent;
let fixture: ComponentFixture<SignupComponent>;

describe('SignupComponent', () => {
     beforeEach(async(() => {
         TestBed.configureTestingModule({
            declarations: [ SignupComponent ],
            imports: [
                 BrowserModule,
                 ReactiveFormsModule
            ]
        })
        .overrideComponent(SignupComponent, {
            set: {
                templateUrl: 'app/components/signup.component.html'
            }}
        )
        .overrideComponent(SignupComponent, {
            set: {
                providers: [
                    { provide: UserService, useClass: MockUserService },
                ]
            }
        })
        .compileComponents().then(createComponent);
}));

    it('should create an instance', () => {
        expect(component).toBeDefined();
    });
});

 /***** HELPERS *****/
 function createComponent() {
      fixture = TestBed.createComponent(SignupComponent);
      component = fixture.componentInstance;
      fixture.detectChanges();

     return fixture.whenStable().then(() => {
         fixture.detectChanges();
     });
 }
1

1 Answer 1

4

This happens when you async spec finishes after the default time out that jasmine has specified, which is 5 seconds. This is taken from Jasmine documentation -

By default jasmine will wait for 5 seconds for an asynchronous spec to 
finish before causing a timeout failure. If the timeout expires before 
done is called, the current spec will be marked as failed and suite 
execution will continue as if done was called.

If specific specs should fail faster or need more time this can be 
adjusted by setting jasmine.DEFAULT_TIMEOUT_INTERVAL around them.

If the entire suite should have a different timeout, 
jasmine.DEFAULT_TIMEOUT_INTERVAL can be set globally, outside of any 
given describe.

Here is the link for the same. Please increase the DEFAULT_TIMEOUT_INTERVAL for your async calls so that jasmine has enough time to know the call got processed. This might be because of your component being bulky (as you have specified).

Sign up to request clarification or add additional context in comments.

1 Comment

Thanks for your reply bad_deadpool. I tried what you suggest but unfortunatelly it didn't work for me.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.