zoukankan      html  css  js  c++  java
  • [RxJS] Marbles Testings

    Install:

    npm install — save-dev jasmine-marbles

    Basic example:

    import {cold, getTestScheduler} from 'jasmine-marbles';
    import 'rxjs/add/operator/concat';
    
    describe('Test', () => {
      it('concat', () => {
        const one$ = cold('x-x|');
        const two$ = cold('-y|');
    
        expect(one$.concat(two$)).toBeObservable(cold('x-x-y|'));
      });
    });

    Advanced example:

    import { MovieShowingsComponent } from './movie-showings.component';
    import { cold, getTestScheduler } from 'jasmine-marbles';
    
    describe('MovieShowingsComponent', () => {
      it('should not have a race condition', () => {
        const backend = jasmine.createSpyObj('backend', ['getShowings']);
        const cmp = new MovieShowingsComponent(backend);
    
        backend.getShowings.and.returnValue(cold('--x|', {x: ['10am']}));
        cmp.selectMovie('After the Storm');
    
        backend.getShowings.and.returnValue(cold('-y|', {y: ['11am']}));
        cmp.selectMovie('Paterson');
    
        // this will flush all observables
        getTestScheduler().flush();
    
        expect(cmp.movieTitle).toEqual('Paterson');
        expect(cmp.showings).toEqual(['11am']); // This will fail because showings is ['10am'].
      });
    });

    Component:

    @Component({
      selector: 'movie-showings-cmp',
      templateUrl: './movie-showings.component.html'
    })
    export class MovieShowingsComponent {
      public movieTitle: string;
      public showings: string[];
    
      private getShowings = new Subject<string>();
    
      constructor(private backend: Backend) {
        this.getShowings.switchMap(movieTitle => this.backend.getShowings(movieTitle)).subscribe(showings => {
          this.showings = showings;
        });
      }
    
      showShowings(movieTitle: string) {
        this.movieTitle = movieTitle;
        this.getShowings.next(movieTitle);
      }
    }
  • 相关阅读:
    Web 前端 UI 组件库文档自动化方案 All In One
    how to auto open demo and create it in a new codesandbox
    TypeScript & Canvas 实现可视化白板
    2020~2021 职业规划书
    PostCSS All In One
    zsh terminal set infinity scroll height
    npm version ^ meaning
    vue-cli & webpack & vue.config.js
    [HDOJ5350]MZL's munhaff function
    [POJ3061]Subsequence
  • 原文地址:https://www.cnblogs.com/Answer1215/p/7763257.html
Copyright © 2011-2022 走看看