Files
Matthieu Riegler 78cf9bfc0e fix(core): Do not migrate HttpClientModule imports on components. (#56067)
`provideHttpClient()` returns a `EnvironmentProvider` which is not compatible with component providers.

PR Close #56067
2024-05-30 14:55:06 +00:00
..

Replace Http modules from @angular/common/http with provider functions

HttpClientModule, HttpClientXsrfModule, HttpClientJsonpModule are deprecated in favor of provideHttpClient and its options. HttpClientTestingModule is deprecated in favor or provideHttpClientTesting()

This migration updates any @NgModule, @Component, @Directive that imports those modules.

Http Modules

Before


import { HttpClientModule, HttpClientJsonpModule, HttpClientXsrfModule } from '@angular/common/http';

@NgModule({
    imports: [CommonModule, HttpClientModule, HttpClientJsonpModule, HttpClientXsrfModule]
})
export class AppModule {}

After

import { provideHttpClient, withJsonpSupport, withXsrfConfiguration } from '@angular/common/http';

@NgModule({
    imports: [CommonModule],
    providers: [provideHttpClient(withJsonpSupport(), withXsrfConfiguration())]
})
export class AppModule {}

Testing

Before

import { HttpClientTestingModule } from '@angular/common/http/testing';

describe('some test', () => {

    it('...', () => {
      TestBed.configureTestingModule({
        imports: [HttpClientTestingModule]
      })
    })
})

After

import { provideHttpClientTesting } from '@angular/common/http/testing';
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';

describe('some test', () => {

    it('...', () => {
      TestBed.configureTestingModule({
        providers: [provideHttpClient(withInterceptorsFromDi()), provideHttpClientTesting()]
      })
    })
})

Before

import { HttpClientTesting } from '@angular/common/http';

describe('some test', () => {

    it('...', () => {
      TestBed.configureTestingModule({
        imports: [HttpClientTesting],
      })
    })
});

After

import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';

describe('some test', () => {

    it('...', () => {
      TestBed.configureTestingModule({
        providers: [provideHttpClient(withInterceptorsFromDi())]
      })
    })
})