角6单位，可观测到的()是同步的

Question

如果您有疑问，必须删除前面的一个问题，以便重新表述：

我已经设置了这个组件：

@Component({
  selector: 'app-async',
  templateUrl: './async.component.html',
  styleUrls: ['./async.component.scss']
})
export class AsyncComponent implements OnInit {

  title$: Observable<string>;
  constructor(private stringService: AsyncStringService) { }

  ngOnInit() {
    this.title$ = this.stringService.getString();
  }
}

其中AsyncStringService.getString是这样的：

getString(): Observable<string>

组件的模板是：

<h1 id="title">{{title$ | async}}</h1>

我想用jasmines异步特性测试组件行为，但是如果不考虑任何异步延续，我的测试也能工作：

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AsyncComponent ],
      providers: [ AsyncStringService ]
    })
    .compileComponents().then(() =>
      fixture = TestBed.createComponent(AsyncComponent));

  }));

  it('should not have resolved observable immedeatly', () => {
    const spy = spyOn(fixture.debugElement.injector.get(AsyncStringService), 'getString')
      .and.returnValue(of( 'value 1'));
    fixture.detectChanges();
    expect(fixture.debugElement.query(By.css('#title')).nativeElement.innerText).toEqual('value 1');
  });

  it('should have all observables resolved in whenStable', async(() => {
    const spy = spyOn(fixture.debugElement.injector.get(AsyncStringService), 'getString')
      .and.returnValue(of( 'value 1'));
    fixture.detectChanges();
    fixture.whenStable().then(() => {
      fixture.detectChanges();
      expect(fixture.debugElement.query(By.css('#title')).nativeElement.innerText).toEqual('value 1');
    });
  }));


  it('should have all observables resolved when ticking', fakeAsync(() => {
    const spy = spyOn(fixture.debugElement.injector.get(AsyncStringService), 'getString')
      .and.returnValue(of( 'value 1'));
    fixture.detectChanges();
    tick();

    expect(fixture.debugElement.query(By.css('#title')).nativeElement.innerText).toEqual('value 1');
  }));
});

所有三个测试都成功了，我希望间谍返回第一个测试失败的可观察到的结果，因为它不考虑异步性。

此外，如果我不正确地使用这些特性(异步/ fakeAsync)，任何提示都会受到赞赏！

编辑：

我尝试了(‘value 1').pipe(delay(100))，它会导致所有测试失败。我假设它以某种方式连接到异步/fakeAsync流看不到的异步管道？

编辑：

当完成()和通过从我的间谍返回timer(10).pipe(map(() => 'value 1'))传递时，同步任务失败了。

然而，假异步测试的行为却很奇怪：

如果我检查订阅服务器中可观察到的值，那么它就会过去，即使我根本没有调用抽签()，所以时间不应该过去，时间也不应该发出值。

调用蜱(100)，使发出的时间(10)不导致在订阅者之外的模板中的值。

 it('should have all observables resolved when ticking the appropriate amount of time', fakeAsync(() => {
    const spy = spyOn(fixture.debugElement.injector.get(AsyncStringService), 'getString')
      .and.returnValue(timer(10).pipe(map(() => 'value 1')));
    fixture.componentInstance.ngOnInit();
    fixture.componentInstance.title$.subscribe(value => expect(value).toEqual('value 1'));
    fixture.componentInstance.title$.subscribe(() => {
      fixture.detectChanges();
      expect(fixture.debugElement.query(By.css('#title')).nativeElement.innerText).toEqual('value 1');
    });
    tick(100); // this does nothing
    fixture.detectChanges();
    expect(fixture.debugElement.query(By.css('#title')).nativeElement.innerText).toEqual('value 1');
    discardPeriodicTasks();
  }));

Answer 1

通过将异步调度程序作为第二个参数传递给of()，我获得了模拟的可观察性：

import {async as _async} from 'rxjs/scheduler/async';

var stub$ = of(stub, _async);