As the title suggests, I'd like to ask if anyone knows the solution to how to get this unit test to pass, after adding the support service to the test123 component, it won't display true anymore no matter what I do. Image sample of the code and error messages
Asked
Active
Viewed 1,686 times
2 Answers
1
In the future, please post code as code, not as an image.
There are a number of issues with the code as you outlined. Here are a few:
- You showed us the service function
secondsToTimeFormat()
, but in the component you callthis.supportService.secondsToTime()
. - in the component you call that same function with what appears to be an object, without the curly braces.
- you do not provide for SupportService in your providers array of the TestBed in your .spec file.
- Since SupportService is not mocked, it tries to call the real service, which resulted in the error you saw of
no provider for Router!
. In order to isolate this component, you ought to mock the service call with a spy.
To show you all this actually working, I put together this Stackblitz.
See the docs for details on how to do all this.

dmcgrandle
- 5,934
- 1
- 19
- 38
-
Thanks for the help – Kiki Dec 18 '18 at 17:46
-
can I ask you for one more question regarding angular testin? – Kiki Dec 19 '18 at 15:10
-
I've added/edited the component and html that I should test, I went trough the docs and tried to do something with the help of your example but I can't get this to work... Can I ask if you have time to check this out and send help on how this should work: https://stackblitz.com/edit/stackoverflow-q-53823441-8r3kit?file=app%2Ftest123.component.spec.ts – Kiki Dec 19 '18 at 15:17
-
@Kiki - This should really be a separate question, but I forked your Stackblitz in order to edit it and came up with this [Working Stackblitz](https://stackblitz.com/edit/stackoverflow-q-53823441-part2?file=app/test123.component.spec.ts) with your updates. Too much detail for a comment, so I commented the code with what I had updated. – dmcgrandle Dec 19 '18 at 19:33
0
You need to provide a stub of the service that you are injecting to the component.
providers: [
{
provide: SupportService,
useValue: supportServiceStub
}
]
where you define supportServiceStub mocking out functions in the service, read more here https://angular.io/guide/testing#component-class-testing

spfellers
- 141
- 5