1

I have some problem with testing my code.Has anyone else had this issue, and how were you able to resolve the issue. I've read the docs, and I can't get to the bottom of this issue. I use firebase 9, angular/fire 7.2.1, angular 13.

My test code:

import { ComponentFixture, TestBed } from '@angular/core/testing';

import { FriendsPageComponent } from './friends-page.component';
import { FriendsService } from './services/friends.service';

describe('FriendsPageComponent', () => {
  let component: FriendsPageComponent;
  let fixture: ComponentFixture<FriendsPageComponent>;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [ FriendsPageComponent ],
      providers: [FriendsService, Firestore]
    })
    .compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(FriendsPageComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Error:

error properties: Object({ code: 204 })
Error: NG0204: Can't resolve all parameters for Firestore: (?).
    at getUndecoratedInjectableFactory (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11486:1)
    at injectableDefOrInjectorDefFactory (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11472:1)
    at providerToFactory (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11519:1)
    at providerToRecord (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11506:1)
    at R3Injector.processProvider (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11402:1)
    at http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11388:1
    at http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:4138:1
    at Array.forEach (<anonymous>)
    at deepForEach (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:4138:1)
    at R3Injector.processInjectorType (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2015/core.mjs:11388:1)
Avalanche
  • 11
  • 2
  • 2

1 Answers1

0

You can use the FirebaseAppModule for imports and mock the Firestore object like this.

import { ComponentFixture, TestBed } from '@angular/core/testing';

import { FriendsPageComponent } from './friends-page.component';
import { FriendsService } from './services/friends.service';

import { FirebaseAppModule } from '@angular/fire/app';

describe('FriendsPageComponent', () => {
   let component: FriendsPageComponent;
   let fixture: ComponentFixture<FriendsPageComponent>;

   beforeEach(async () => {
       await TestBed.configureTestingModule({
          imports: [FirebaseAppModule],
          declarations: [ FriendsPageComponent ],
          providers: [
            FriendsService,
            { provide: Firestore, useValue: {} }
          ]
        })
        .compileComponents();
    });
});

Hope it helps.