Angular Karma - TypeError: невозможно прочитать свойство _id из undefined - PullRequest
0 голосов
/ 01 августа 2020

Когда я пытаюсь протестировать с помощью karma jasmin, я получаю эту ошибку ...

TypeError: Cannot read property '_id' of undefined

Component.ts

import { Component, OnInit } from '@angular/core';
import { ApiService } from '../../../services/api.service';
import { Router } from '@angular/router';
import { NgxSpinnerService } from "ngx-spinner";
import { ToasterConfig } from 'angular2-toaster';
import { NbComponentStatus, NbGlobalPhysicalPosition, NbToastrService } from '@nebular/theme';
import { ToastrService } from 'ngx-toastr';

@Component({
  selector: 'ngx-edit-subscription',
  templateUrl: './edit-subscription.component.html',
  styleUrls: ['./edit-subscription.component.scss']
})
export class EditSubscriptionComponent implements OnInit {

  title = [
    {"name": "Name"},
    {"name": "Description"}, 
    {"name": "Price"}, 
    {"name": "Quantity"}, 
    {"name": "Total"}];
  
  review = false;
  recipientDetails:any;
  subtotal: number = 0;
  tax: number = 100.00;
  total: number = 0;
  orders: any = [];
  menuitems: any = [];
  selectedItems: any = [];
  recipientId:any;
  recipientAddressId:any;
  cartId:any;
  searchItem:string='';
  searchitemNumber="";
  searchDescription:string='';
  searchPrice:string='';
  imageShow: boolean = false;
  imageUrl: any = '';
  item: any = '';
  itemNumber= '';
  desc: any = '';
  price: any = '';
  vendorID: any;
  response: any;
  subscriptionItem : any;
  subscriptionItemsId : any;
  subscriptionItems_Id : any;
  cartDetails:any;

  constructor(private apiService: ApiService,
    private router: Router,
        private toastrService: ToastrService,
    private spinner: NgxSpinnerService) { 
    this.recipientDetails = JSON.parse(localStorage.getItem('recipientDetails')) || {};
    localStorage.setItem('subId', this.recipientDetails._id);

    this.recipientId = this.recipientDetails.recipientId._id ? this.recipientDetails.recipientId._id : '';
    this.recipientAddressId = this.recipientDetails._id ? this.recipientDetails._id : '';
    this.vendorID = localStorage.getItem('vendorID');
    let zipCode = this.recipientDetails.zipCode;
    this.spinner.show();
    this.venueId = this.recipientDetails.deliveryAreaId[0].venueId;

     this.apiService.getMenubyCategory(this.vendorID).subscribe((res)=>{
      this.spinner.hide();
      this.orders = res.body.vendorTags;
      for(let order of this.orders) {
        for(let prod of order.menudetails) {
          prod['quantity'] = 0;
        }
      }
      this.spinner.show();
     this.apiService.userSubscription(this.recipientDetails._id).subscribe((resp)=>{
      this.spinner.hide();
      this.response = resp;
      this.subscriptionItem = this.response.subscriptionItem[0];
      this.subscriptionItemsId = this.subscriptionItem.subscriptionItemsId[0];
      this.subscriptionItems_Id = this.subscriptionItemsId._id;
      for(let menuItems of this.subscriptionItemsId.menuItems) {
        for(let order of this.orders) {
          for(let prod of order.menudetails) {
            if(prod._id === menuItems.menuItemId._id) {
              prod['quantity'] = menuItems.quantity;
            }
          }
        }
      }
     });
     });
  }

  venueId:any;

  ngOnInit() {
    this.apiService.editSubscription = true;
  }

  imagePopupShow(url: any) {
    var scrollElem= document.querySelector('#moveTop-row');
    scrollElem.scrollIntoView();
    this.imageShow = true;
    this.imageUrl = url;
  }
  imagePopupHide() {
    this.imageShow = false;
    this.imageUrl = '';
  }
  search(query, tab) {

    if(tab === 'item') {
      this.item = query;
    }
    if(tab === 'itemNumber') {
      this.itemNumber = query;
    }
    if(tab === 'description') {
      this.desc = query;
    }
    if(tab === 'price') {
      this.price = query;
    }
    var data2 = {
      "item" : this.item,
      "itemNumber" : this.itemNumber,
      "description" : this.desc,
      "price":this.price,
      "vendorId":this.vendorID
    };
    this.spinner.show();
    this.apiService.searchOrder(data2).subscribe((res)=>{
     this.spinner.hide();
     this.orders = res.body.vendorTags;
     for(let order of this.orders) {
       for(let prod of order.menudetails) {
         prod['quantity'] = 0;
       }
     }
     });

  }
  reviewOrder() {
    this.menuitems = [];
    this.spinner.show();
      for(let order of this.orders) {
        for(let product of order.menudetails) {
          if(product.quantity > 0){
              this.menuitems.push({
                deliverRestOfOrder: true,
                menuItemId: {
                  _id: product._id,
                  name: product.name,
                  price: product.price
                },
                quantity: product.quantity,
             });
          }
        }
      }
      if(this.menuitems.length == 0){
        this.toastrService.error('', 'Please Select Atleast One menu');
        this.spinner.hide();
        return;
      }
      var data2 = {
       "subscriptionItemId": this.subscriptionItems_Id,
       "menuItems": this.menuitems
     };
      this.apiService.reviewSubscription(data2).subscribe((res)=>{
        this.spinner.hide();
        this.toastrService.success('', 'Succesfully Added');
        this.cartDetails = res;
        localStorage.setItem('totalAmount',this.cartDetails.subscriptionItem[0].totalAmount);
        localStorage.setItem('typeOfSubscription', this.cartDetails.subscriptionItem[0].subscriptionId[0].typeOfSubscription);
        this.review = true;
      });
  }

 

  addToCart(item) {
    if(item.quantity<0){
      item.quantity = 0;
    }
    return;
    if(this.menuitems.length>0){
      var arr = this.menuitems;
      function userExists(menuItemId) {
        return arr.some(function(el) {
          return el.menuItemId === menuItemId;
        }); 
      }
      var exists = userExists(item._id);
      if(exists == true){
        for(var i in this.menuitems){
          if(this.menuitems[i].menuItemId == item._id){
            this.menuitems[i].quantity = this.menuitems[i].quantity+1;
            break;  
          }
        }
      } else {
        this.menuitems.push({menuItemId: item._id, quantity: 1, name: item.name, price:  item.price});
      } 
      var data = {
        "cartId" : this.cartId,
        "vendorId" : this.vendorID,
        "venueId" : this.venueId,
        "recipientId":this.recipientId,
        "recipientAddressId":this.recipientAddressId,
        "menuItems": this.menuitems
      };
      this.apiService.updateCart(data).subscribe((res)=>{
        
      });
    } else {
      this.menuitems.push({menuItemId: item._id, quantity: 1, name: item.name, price:  item.price});
      var data2 = {
        "vendorId" : this.vendorID,
        "venueId" : this.venueId,
        "recipientId":this.recipientId,
        "recipientAddressId":this.recipientAddressId,
        "menuItems": this.menuitems
      };
      this.apiService.addToCart(data2).subscribe((res)=>{
        this.cartId = res.cartId;
      });
    } 
  }
}


Spe c .ts

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

import { EditSubscriptionComponent } from './edit-subscription.component';
import { NbCardModule } from '@nebular/theme';
import { FormsModule } from '@angular/forms';
import { DummyService } from '../../../services/dummy.service';
import { RouterTestingModule } from '@angular/router/testing';
import { ToastrService } from 'ngx-toastr';
import { HttpClientTestingModule } from '@angular/common/http/testing';

class MockDummyService extends DummyService {
  // mock everything used by the component
};

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: 
      [
        RouterTestingModule,
        NbCardModule,
        FormsModule,
        HttpClientTestingModule
      ],
      declarations: [ EditSubscriptionComponent ],
      providers: 
      [

        {
          provide: ToastrService,
          useClass: MockDummyService
        },
      ]
    })
    .compileComponents();
  }));

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

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

Спасибо ........................................ .................................................. .................................................. .................................................. .........................

1 Ответ

0 голосов
/ 01 августа 2020

Вы проверяете, существует ли recipientDetails в localStorage:

this.recipientDetails = JSON.parse(localStorage.getItem('recipientDetails')) || {};

и здесь, если _id из заданного recipientDetails существует:

this.recipientId = this.recipientDetails.recipientId._id ? this.recipientDetails.recipientId._id : '';

, но вы подписываетесь на userDetails вместо this.recipientId в любом случае:

this.apiService.userSubscription(this.recipientDetails._id).subscribe((resp)=>{

Если this.recipientDetails будет {}, как указано в первой строке, использование this.recipientDetails._id вызовет ошибку "Cannot read property '_id' of undefined"

Попробуйте отправить this.recipientId в подписку и обработайте возможность отсутствия _id в вашем бэкэнде

...