如何覆盖 Jasmine 中的 RXJS 管道功能？

Question

我想在Angular/Jasmine中介绍RXJS的管道功能。

我收到此错误：

TypeError: this.element.children.pipe is not a function

代码：

ngOnInit() {
    this.element.children.pipe(
      mapObservableArray((children: ObservableTree<ItemModel>) => children.value.properties))
        .subscribe((props: Properties[]) => {
        // do something with the props or children
        this.childrenElements = props as any;
    });
}

这确保我可以检索孩子的值并将其保存在 this.childrenElements 上。

.spec 文件：

import { CommonModule } from '@angular/common';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { myComponent } from './my.component';

describe('myComponent', () => {

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [CommonModule],
      declarations: [myComponent],
      providers: [],
      schemas: [NO_ERRORS_SCHEMA],
    }).compileComponents();
  });

  it('should create the component', async () => {
    const fixture = TestBed.createComponent(myComponent);
    const componentInst = fixture.componentInstance;

    componentInst.childrenElements = [
      { name: 'name1' },
      { name: 'name2' }
    ];

    // when
    componentInst.ngOnInit();

    // then
    expect(componentInst).toBeDefined();
  });
});

尝试存根： spyOn(componentInst.element.children, 'pipe').and.stub();

但这没有帮助。

this.element.children：

如何覆盖我的这部分代码？

Answer 1

您必须删除 element.children 的可观察数据（无论它是什么）。

这是我第一次见到mapObservableArray，所以我认为那是内部运营商。

试试：

import { of } from 'rxjs';
.....
 it('should create the component', async () => {
    const fixture = TestBed.createComponent(myComponent);
    const componentInst = fixture.componentInstance;

    (componentInst as any).element = {
      children: of(/* mock how the children property should look like */);
    };

    // when
    // componentInst.ngOnInit();
    // don't call ngOnInit directly, the first detectChanges will call ngOnInit for you
    fixture.detectChanges();

    // then
    expect(componentInst).toBeDefined();
  });

如果 element.children 是从另一个 observable 派生的，您必须像我展示的那样模拟另一个 observable，它应该可以很好地流动。

编辑 尝试将它分配给我上面的对象。如果元素是只读的或私有的，那么将很难模拟。尝试做(componentInst as any) 虽然我不认为这是最好的做法。出于测试目的，可能会删除它的只读或私有方面。你发给我的截图是被包装的 observable，你必须把未包装的值放在 of 里面。