cuzureau
cuzureau

Reputation: 380

How can I test with Jasmine private ActivatedRoute in constructor?

Here's my component:

@Component({
    selector: 'app-signup',
    templateUrl: './signup.component.html',
    styleUrls: ['./signup.component.scss']
})
export class SignUpComponent implements OnInit {
    specialLink: string;

    constructor(
        private activatedRoute: ActivatedRoute,
    ) {
        this.specialLink = this.activatedRoute.snapshot.params.id;

        if (this.specialLink !== undefined) {
            this.setSpecialSignup();
        }
    }

And here's my tests:

describe('SignUpComponent', () => {
  let component: SignUpComponent;
  let fixture: ComponentFixture<SignUpComponent>;
  let ActivatedRouteMock: any;
  
  beforeEach(async(() => {
    ActivatedRouteMock = jasmine.createSpyObj('ActivatedRoute', ['snapshot']);
    ActivatedRouteMock.snapshot.and.returnValue({ params: { id: "123" } });

    TestBed.configureTestingModule({
      declarations: [ SignUpComponent ],
      imports: [ RouterTestingModule ],
      providers: [
        {provide: ActivatedRoute, useValue: ActivatedRouteMock}
      ]
    })
    .compileComponents();
  }));

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

  describe('Function calls', () => {
    beforeEach(() => {
      fixture.detectChanges();
    });

    describe('Patient Side', () => {
   
      it('should call setSpecialSignup() when user is coming from specialLink', () => {
        expect(ActivatedRouteMock.snapshot).toHaveBeenCalled();
      });

I'm trying to test the ActivatedRoute, which is used in the constructor of my component, but I get this error : TypeError: Cannot read property 'id' of undefined

It's like it doesn't recognize the ActivatedRoute in my very Component, not just in the tests.

What did I miss ?

Upvotes: 0

Views: 114

Answers (1)

tmhao2005
tmhao2005

Reputation: 17484

The way you mocked a bit weird why don't you mock simply like this:

activatedRouteMock: Partial<ActivatedRoute>;

beforeEach(async(() => {
  activatedRouteMock = {
    snapshot: {
      params: { id: 1 }
    } as ActivatedRouteSnapshot,
  };

  TestBed.configureTestingModule({
    declarations: [ SignUpComponent ],
    imports: [ RouterTestingModule ],
    providers: [
      { provide: ActivatedRoute, useValue: activatedRouteMock }
    ]
  })
  .compileComponents();
}));

Upvotes: 1

Related Questions