From 8f396fdd7c7eb8ed2093bb4f3ace05a44c9576ca Mon Sep 17 00:00:00 2001 From: Wonsuk Choi Date: Tue, 20 Oct 2026 11:59:47 +0900 Subject: [PATCH] docs(angular/guides/testing): use 'provideHttpClientTesting' instead of the deprecated 'HttpClientTestingModule' and add 'initialPageParam' to the infinite query example --- docs/framework/angular/guides/testing.md | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/docs/framework/angular/guides/testing.md b/docs/framework/angular/guides/testing.md index 7648d7f6b32..28b00bd8ace 100644 --- a/docs/framework/angular/guides/testing.md +++ b/docs/framework/angular/guides/testing.md @@ -80,12 +80,15 @@ Retries slow failing tests because the default backoff runs three times. Set `re ## HttpClient & network stubs -Angular's `HttpClientTestingModule` plays nicely with PendingTasks. Register it alongside the Query provider and flush responses through `HttpTestingController`: +Angular's `HttpClient` testing utilities play nicely with PendingTasks. Register `provideHttpClient()` and `provideHttpClientTesting()` alongside the Query provider and flush responses through `HttpTestingController`: ```ts TestBed.configureTestingModule({ - imports: [HttpClientTestingModule], - providers: [provideTanStackQuery(queryClient)], + providers: [ + provideHttpClient(), + provideHttpClientTesting(), + provideTanStackQuery(queryClient), + ], }) const httpCtrl = TestBed.inject(HttpTestingController) @@ -112,7 +115,8 @@ Use the same pattern for infinite queries: call `fetchNextPage()`, advance timer const infinite = TestBed.runInInjectionContext(() => injectInfiniteQuery(() => ({ queryKey: ['pages'], - queryFn: ({ pageParam = 1 }) => fetchPage(pageParam), + queryFn: ({ pageParam }) => fetchPage(pageParam), + initialPageParam: 1, getNextPageParam: (last, all) => all.length + 1, })), ) @@ -152,6 +156,6 @@ expect(mutation.data()).toBe('TEST') - Fresh `QueryClient` per test (and clear it afterwards) - Disable or control retries to avoid timeouts - Advance timers + microtasks before `whenStable()` when using fake timers -- Use `HttpClientTestingModule` or your preferred mock to assert network calls +- Use `provideHttpClientTesting()` or your preferred mock to assert network calls - Await `whenStable()` after every `refetch`, `fetchNextPage`, or mutation - Prefer `TestBed.runInInjectionContext` for service tests and `fixture.whenStable()` for component tests