未捕获的类型错误：无法读取未定义抛出的属性“coSearchCriteria” - Angular Karma/Jasmine

Posted 2023-03-16

【中文标题】未捕获的类型错误：无法读取未定义抛出的属性“coSearchCriteria” - Angular Karma/Jasmine

【英文标题】：Uncaught TypeError: Cannot read property 'coSearchCriteria' of undefined thrown - Angular Karma/Jasmine

【发布时间】：2019-02-07 21:01:27

【问题描述】：

我尝试使用 Karma/Jasmine 测试 Angular 组件。坦率地说，我对业力/茉莉花并没有太多了解，并且在测试出现诸如“未捕获的类型错误：无法读取未定义抛出的属性‘coSearchCriteria’”之类的错误时。但是正常的组件功能工作正常。如果有任何想法，请帮助我。

这是我的测试代码，这里基本的“应该创建”测试用例正在运行，但第二个给出错误。

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

  beforeEach(async(() => 
    TestBed.configureTestingModule(
      imports: [ReactiveFormsModule, FormsModule, HttpModule, CarbonDatepickerModule, CarbonModalModule,CarbonIconModule, StoreModule.forRoot()],
      declarations: [ SearchPanelComponent, UploadsearchcriteriaComponent ],
      providers: [ Store, StoreModule, CustomerorderService,ConnectionBackend, ApiConnectorService, HttpClient, HttpHandler,Http, CarbonModalService]    )
    .compileComponents();
  ));

  beforeEach(() => 
    fixture = TestBed.createComponent(SearchPanelComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  );

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

it('RSSD To should be invalid', async( () => 
  const dateValue = component.orderUnitForm.controls['rssddateto'];
  dateValue.setValue('12-02/2012');
  fixture.detectChanges();
  expect(component.orderUnitForm.valid).toEqual(false);
));

而我在 .ts 文件中使用过的“coSearchCriteria”只是这样

this.store.select(selectorCOCriteriaState)
    .subscribe((coSearchCriteria: SearchCriteriaState) =>    
       this.searchState = coSearchCriteria.lastUsedCriteria;     
    );   
    if(this.searchState)
        this.fillSearchStateData();  
    

【问题讨论】：

你确定这是唯一的地方吗？当错误涉及of undefined 时，通常意味着您正在尝试从未定义的父级读取它。在这种情况下，它被传入，所以你没有引用任何父母。

user184994 感谢您的回复，是的，这是我在课堂上唯一使用“coSearchCriteria”的地方。

如果您不确定并想摆脱它，可以添加schemas: [NO_ERRORS_SCHEMA]。我的猜测是它可能来自SearchPanelComponent 的子组件。另请注意，添加 NO_ERROR_SCHEMA 也会隐藏其他错误。

@AmitChigadani 试过但没用，我在仅进行测试时出错，正常功能工作正常。

能否也添加可能有问题的最小模板和 ts 代码？

【参考方案1】：

终于搞定了，只需要在spec文件中模拟ngrx存储即可。

class MockStore 
  public dispatch(obj) 
    console.log('dispatching from the mock store!')
  

  public select(obj) 
    console.log('selecting from the mock store!');

    return Observable.of()