Object doesn't support this action at _ActivatedRoute_58

Question

Am using unit testing in Angular 2 by using Jasmin and Karma.

I need mock this below code

this.activatedRoute.url.subscribe(url => {
            debugger;
            this.isEdit = false;
            if (url[0].path === 'updatecoc') {
                this.isEdit = true;
            }
        });

I have tried mocking by this way : How to mock an activatedRoute parent Route in angular2 for testing purposes?

let fakeActivatedRoute = new MockActivatedRoute();
    fakeActivatedRoute.parent = new MockActivatedRoute();

    let urlSegment: UrlSegment[] = [];
    urlSegment.push({ path: "updatecoc", parameters: {} });
    fakeActivatedRoute.url = Observable.of(urlSegment);    
    beforeEach(() => {    
        TestBed.configureTestingModule({

            imports: [FormsModule, MessagesModule, DataTableModule, DropdownModule, ConfirmDialogModule, AccordionModule,
                AutoCompleteModule, DialogModule, EditorModule, HttpModule],
            declarations: [MaintainCOCComponent],
            providers: [{ provide: MaintainCOCService, useClass: MaintainCOCService },
            { provide: Configuration, useClass: Configuration },
            { provide: Router, useClass: MockRouter },
            { provide: ActivatedRoute, useClass: fakeActivatedRoute }];

But am getting an error while mocking ActivatedRoute Module. I have tried everything from 2 days. I can't resolve this issue.

The full error message is:

Object doesn't support this action
   at _ActivatedRoute_58.get (Function code:173:46)
   at DynamicTestModuleInjector.prototype.getInternal (Function code:281:43)
   at NgModuleInjector.prototype.get (http://localhost:9876/base/src/test.ts:60528:9)
   at TestBed.prototype.get (http://localhost:9876/base/src/test.ts:17440:13)
   at AppView.prototype.injectorGet (http://localhost:9876/base/src/test.ts:89000:17)
   at DebugAppView.prototype.injectorGet (http://localhost:9876/base/src/test.ts:89428:13)
   at View_MaintainCOCComponent_Host0.prototype.createInternal (Function code:20:3)
   at AppView.prototype.createHostView (http://localhost:9876/base/src/test.ts:88956:9)
   at DebugAppView.prototype.createHostView (http://localhost:9876/base/src/test.ts:89412:13)
   at ComponentFactory.prototype.create (http://localhost:9876/base/src/test.ts:44498:9)

Note: I should provide a bounty for resolved answer.

`fakeActivatedRoute ` is not a function so what you are doing makes no sense. You can use `useValue` or `useFactory` to inject an existing object. — Aluan Haddad, Jan 22 '18 at 09:57
@AluanHaddad could you please provide it as an answer? fakeActivatedRoute is an instance of a class. — Ramesh Rajendran, Jan 22 '18 at 09:59

score 2 · Accepted Answer · answered Jan 22 '18 at 10:07

The error occurs because you are an registering an existing object using the useClass provider option.

When the injector resolves the ActivatedRoute dependency, it sees that the registered provider has a useClass property and attempts to instantiate that property's value as a constructor.

Since you have an existing value fakeActivatedRoute you can register it using the useValue property instead

providers: [{provide: ActivatedRoute, useValue: fakeActivatedRoute}]

Alternately, you can register the MockActivatedRoute constructor, instead of creating an instance

providers: [{provide: ActivatedRoute, useClass: MockActivatedRoute}]

Additionally, your registration code can and should be simplified from

providers: [
  { provide: MaintainCOCService, useClass: MaintainCOCService },
  { provide: Configuration, useClass: Configuration },
  { provide: Router, useClass: MockRouter },
  { provide: ActivatedRoute, useClass: fakeActivatedRoute }
]

to

providers: [
  MaintainCOCService,
  Configuration,
  { provide: Router, useClass: MockRouter },
  { provide: ActivatedRoute, useValue: fakeActivatedRoute }
]

Object doesn't support this action at _ActivatedRoute_58

1 Answers1