I am using Angular 18 with Angular testing library: my issues is that I am able access route param as required input signal. However when I run the tests that depends on this input it's complaining that Input is required but no value available yet error.
How to provide this to My test in ATL so I can use the input.
I am using Angular 18 with Angular testing library: my issues is that I am able access route param as required input signal. However when I run the tests that depends on this input it's complaining that Input is required but no value available yet error.
How to provide this to My test in ATL so I can use the input.
Share Improve this question asked Nov 15, 2024 at 19:50 Eternal SunshineEternal Sunshine 951 silver badge7 bronze badges1 Answer
Reset to default 1Create a mock ParamMap that simulates route parameters, then create a mock ActivatedRoute that returns the mock ParamMap as an Observable.
Using this approach you can test both the initial route parameter binding and parameter changes (by calling next with a new ParamMap on paramMapSubject and then calling fixture.detectChanges())
const paramMapSubject = new Subject<ParamMap>();
const createParamMap = (id: string): ParamMap => ({
get: (param: string) => param === 'id' ? id : null,
getAll: (param: string) => param === 'id' ? [id] : [],
has: (param: string) => param === 'id',
keys: ['id']
});
async function setup() {
return render(ExampleComponent, {
providers: [
{
provide: ActivatedRoute,
useValue: {
paramMap: paramMapSubject.asObservable()
}
}
]
});
}