是否可以从组件测试服务中的一个可观察属性

Question

我不知道我想做的这个是否可行，我有一个组件 FiltersComponent 和一个服务 FiltersService。在 FiltersService 中，我有一个 BehaviorSubject 类型的属性 onFilterChange。我将它公开为 Observable，并且我想在应用此 observable 抛出的更改时进行测试。

FilterService.service.ts

export class FilterService {
    private _onFilterChange$: BehaviorSubject<any>;
    constructor() {}

    get onFilterChange(): any {
        return this._onFilterChange$.asObservable;
    }

    public onApplyFilter(filter) {
        this._onFilterChange$.next(filter);
    }
}

FilterComponent

export class FiltersComponent implements OnInit, OnDestroy {
    filterForm: FormGroup;
    constructor(private _filterService: FilterService){}

    onApplyFilter() {
        const pfilter = this.filterForm.getRawValue();

        this._filterService.onApplyFilter(newF);
    }
}

我如何在应用过滤器时进行测试

this._filterService.onApplyFilter(newF);

this._filterService.onFilterChange().subscribe(d => {
    respond the same filter that I apllied 
});

Answer 1

从您问题的标签中，我可以看出您正在使用 jasmine-marbles 来测试可观察对象。如果是这样，那么您应该像这样设置 FilterService：

export class FilterService {

    private _onFilterChange$: BehaviorSubject<any> = new BehaviorSubject<any>(null);
    constructor() {}

    get onFilterChange(): Observable<any> {
        return this._onFilterChange$.asObservable();
    }

    public onApplyFilter(filter) {
        this._onFilterChange$.next(filter);
    }
}

要进行单元测试，FilterService，在 filter.service.spec.ts 文件中包含以下代码：

import { TestBed } from '@angular/core/testing';
import {cold} from 'jasmine-marbles';
import { FilterService } from './filter.service';

describe('FilterService', () => {
  beforeEach(() => TestBed.configureTestingModule({}));

  it('should be created', () => {
    const service: FilterService = TestBed.get(FilterService);
    const expected = cold('a', {a: 2});
    service.onApplyFilter(2);
    const p = service.onFilterChange;
    expect(p).toBeObservable(expected);
  });
});

是否可以从组件测试服务中的一个可观察属性

Is possible test one observable attribute in the service from component

unit-testing

karma-jasmine

angular

jasmine-marbles