Pipe Number cause karma to crash

Question

Using Pipe Number case karma to fail load component

When I remove the pipe the test pass

However in the app everything works fine

Here is how i use pipe in my template

{{ facture | number:'0.2':'fr' }}

or

{{ facture | currency:'EUR':'symbol':'0.2-2':'fr' }}

If I put every test passes except that I don't get the proper formatting

 {{ facture }}

Here is my test config

import { CurrencyPipe, DecimalPipe, PercentPipe } from '@angular/common';


fdescribe('MontantFacturesComponent', () => {
  const contentTitle: String = 'Choisissez les factures à payer' ;
  const facturesUpdate: String = '30 Octobre 2018 à 18:52:48' ;
  const factureTotal: String = '232,40' ;

  let component: MontantFacturesComponent;
  let fixture: ComponentFixture<MontantFacturesComponent>;
  let componentEL: DebugElement ;

  let contentTitleEL: DebugElement ;
  let nomClient: DebugElement ;
  let numClient: DebugElement ;

  let factureHead: DebugElement ;
  let factureBody: DebugElement ;
  let factureFoot: DebugElement ;

  beforeEach(async(() => {
    const comp = TestBed.configureTestingModule({
      imports: [
        NgbModule.forRoot(),
        AngularFontAwesomeModule,
        RouterModule.forRoot(<Routes>[]), 
        HttpClientModule, 
      ],
      declarations: [ 
        MontantFacturesComponent,
      ],
      providers : [
        AppService,
        {provide: APP_BASE_HREF, useValue : '/' },
        CommonModule,
        CurrencyPipe, DecimalPipe, PercentPipe
      ]
    }) ;

    // Configure the component with another set of Providers
    TestBed.overrideComponent(
        MontantFacturesComponent,
        {set: {providers: [{provide: AppService, useClass: MockAppService}]}}
    );
    comp.compileComponents();
  }));

With or without providers for pipe and commonModule nothing change

        CommonModule,
        CurrencyPipe, DecimalPipe, PercentPipe

It looks like my whole component goes undefined when I have the pipe in my template

Uncaught Error: Unexpected module 'CommonModule' declared by the module

 'DynamicTestModule'. Please add a @Pipe/@Directive/@Component annotation.

Looks like the problem is the use of local fr

both

{{factureTotal | currency:'EUR':'symbol':'0.2-2':'fr'}}

and

{{factureTotal | currency:'EUR':'symbol':'0.2-2':'fr-FR'}}

Fails but

{{factureTotal | currency:'EUR':'symbol':'0.2-2'}}

Is fine any idea how to make karma work

Answer 1

Found the problem after a week of looking

It looks like karma is not loading locals format

import { registerLocaleData } from '@angular/common';
import localeFr from '@angular/common/locales/fr';
registerLocaleData(localeFr);

this solves the problem that was causing the testComponent to crash