Angular 16 Component Unit Test Using Jasmine Spy and callFake

I’m having an issue with my component unit test.
This is the synopsis, I have a product. service.ts which is called by the product-list.component.ts . My product.service.spec.ts is successful, but my product-list.component.spec.ts fails the component never gets created(should create). I’m stuck when I get to the callFake(). Can someone point me in the right direction I tried using an anonymous function but it didn’t work. Did some research but no luck, it will be greatly appreciated!

This is the issue

I have included a code snippet is included below;

Here is my prodcut-list.component

 export class ProductListComponent implements OnInit {


       products:Products[] = [];


      allLoadProducts(){

        this.productService.getallProducts().
         pipe(tap((products)=>
          (this.products = products)))

      }



   }

Here is my product service:

 getallProducts(): Observable<Products[]>{
     return this._http.get<Products[]>(this.rootUrl + '/getProducts/someClothing')
  
  }

Here is my product-list.component.spec.ts

    import { ComponentFixture, TestBed } from '@angular/core/testing'; 
    import { ProductListComponent } from './product-list.component';
    import { ProductService } from '@app/services/product.service';
    import { of } from 'rxjs';

   describe('ProductListComponent', () => {
   let component: ProductListComponent;
   let fixture: ComponentFixture<ProductListComponent>;
   console.log("doest it get here");

  beforeEach(async () => {
  const productServiceSpy = jasmine.createSpyObj<ProductService>(['getallProducts']);
  productServiceSpy.getallProducts.and.callFake(function (){  //This the issue
 
  return of({
    products: [
      
        {
          "_id": "0001",
          "name": "Black One Piece",
          "size": "M",
          "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
          "imageUrl": "Test",
          "price": 199
        },            
    ]
  

  })



});

await TestBed.configureTestingModule({
  declarations: [ ProductListComponent ],
  providers:[
    {
      provide: ProductService,
      userValue: productServiceSpy
      
    }
  
  ]
 })
.compileComponents();

 })

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

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