angular: Test with Router injected - Cannot resolve all parameters for 'Router'

I have a component with the following constructor:

constructor(
    private _router: Router,
    private dispatcher: Observer<Action>,
    fb: FormBuilder
) { ... }

And if I run project everything works. But I need tests for it so here they are:

import {
it,
inject,
injectAsync,
beforeEachProviders,
TestComponentBuilder
} from "angular2/testing";

import {provide} from "angular2/core";
import {FormBuilder} from 'angular2/common';
import {Subject} from 'rxjs/Subject';
import {Router, RouteParams} from 'angular2/router';
// other imports ...

describe("SomeInfoEdit form", () => {

    const actions = new Subject<Action>(null);

    // provide our implementations or mocks to the dependency injector
    beforeEachProviders(() => {

        return [
            Router,
            FormBuilder,
            provide(dispatcher, { useValue: actions }),
            SomeInfoEdit
        ];
    });

    it('should have default data', inject([SomeInfoEdit], (component) => {
        expect(component.galtitle.value).toEqual("");
        expect(component.friendlyUrl.value).toEqual("");
        expect(component.isVisible.value).toBe(false);
    }));
...

This the test runs it gives me the error:

Cannot resolve all parameters for ‘Router’(?, ?, ?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that ‘Router’ is decorated with Injectable.

I tried to put ROUTE_DIRECTIVES into beforeEachProviders but this doesn’t help. Is there a bug or am I doing something wrong?

I appreciate some explanation.

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 22 (3 by maintainers)

Most upvoted comments

@TrevorBroderick1, This worked for me.

class MockRouter {
  navigate = jasmine.createSpy('navigate');
}

...

TestBed.configureTestingModule({
  declarations: [MyComponent],
  providers: [
    {provide: Router, useClass: MockRouter}
  ]
});

You could use an instance with the provider key useValue if you wanted to access the Jasmine spies from your tests.

const mockRouter = new MockRouter();

...

TestBed.configureTestingModule({
  declarations: [MyComponent],
  providers: [
    {provide: Router, useValue: mockRouter}
  ]
});

@zhuanjiaozm

Try this

const fakeActivatedRoute = {
       snapshot: { data: {} }
   }
{ provide: ActivatedRoute, useClass: fakeActivatedRoute },

So… any idea how to get this working on RC5?

Github link for navigation_spec is not working. Could you please share updated link?

@zhuanjiaozm You have to remove the ActivatedRoute from the providers in your @Component then you can provide a mock in your test without problems 😃

@programmist your solution worked for me

How come you only have to create a spy for navigate in this instance?

@alvipeo could you please write your solution here it will help all of us. the link @ericcarraway is not working

Miracle! Thank you! Made it work!