How to use rxjs-marbles - 10 common examples

const error = new Error('oops!');
        const MyComponent = createComponent(
            () => concat(of(7), throwError(error)),
            template
        );
        /* eslint-disable no-console */
        const temp = console.error;
        console.error = jest.fn();
        render(root, MyComponent);
        expect(console.error).toHaveBeenCalledWith('Error: ', error);
        console.error = temp;
        /* eslint-enable no-console */
    });
    it(
        'should not emit a warning message after if component emits state before 500ms if not state updates',
        fakeSchedulers(advance => {
            jest.useFakeTimers();
            const root = document.createElement('div');
            const MyComponent = createComponent(({ props }) => props, template);
            render(root, MyComponent, { value: 'foo' });
            /* eslint-disable no-console */
            const temp = console.warn;
            console.warn = jest.fn();
            advance(500);
            expect(console.warn).not.toHaveBeenCalledWith(
                'Warning: Your Component did not emit any state updates for at least 500ms.'
            );
            console.warn = temp;
            /* eslint-enable no-console */
        })
    );
    it('should unmount replaced components', () => {

// act
        const createdRecords = m.cold(
          'a|',
          service.createManyAsync([item1ToAdd, item2ToAdd]),
        );
        const actualRecords = m.cold('a|', service.records);

        // assert
        m.expect(actualRecords).toBeObservable(expectedRecords);
        m.expect(createdRecords).toBeObservable(expectedRecords);
      }),
    );
    test(
      'should return generated ids asyncronously',
      marbles(m => {
        // arrange
        service.records = [];
        const item1ToAdd: Partial = { someField: 'Test' };
        const item2ToAdd: Partial = { someField: 'Another' };

        const expectedGeneratedRecords = m.cold('a|', [
          { ...item1ToAdd, id: 1 },
          { ...item2ToAdd, id: 2 },
        ]);

        // act
        const actualGeneratedRecords = m.cold(
          'a|',
          service.createManyAsync([item1ToAdd, item2ToAdd]),
        );

expect(steps[1].anchorId).toEqual('test2');
      expect(steps[1].placement).toEqual('right');
      expect(steps[2].anchorId).toEqual('test3');
      expect(steps[2].placement).toEqual('right');
    });
    tourService.initialize(mockdata);
  });

  it('should trigger a start event when the toggle() method call is execute', marbles((m) => {
    const tourServiceStartStream = tourService.start$.map(() => 'a');
    m.hot('-a-').do(() => tourService.toggle()).subscribe();
    const expectedStream = m.hot('-a-');
    m.expect(tourServiceStartStream).toBeObservable(expectedStream);
  }));

  it('should trigger an end event when the end() method call is executed', marbles((m) => {
    const tourServiceEndStream = tourService.end$.map(() => 'a');
    // change this tourService.end() call to html element triggerEvent(click, null) once toggle problem is resolved
    m.hot('-a-').do(() => tourService.end()).subscribe();
    const expectedStream = m.hot('-a-');
    m.expect(tourServiceEndStream).toBeObservable(expectedStream);
  }));

});

]
      });
      try {
        effects = TestBed.get(LayoutMenuService);
        console.log('Dep!!!!!!!!!!!!!',
          TestBed.get(Store),
          TestBed.get(Actions)
        );
      } catch(e) {
        console.warn(e);
      }
      console.log('Setup', provideMockActions(() => mockActions),);
      */
    });

    it('should select on Navigation', marbles(m => {
      const getStoreStub = ():any => {
        const s = {
          scMenu: menuReducer(menuEntityAdapter.getInitialState(), addAllItemsAction)
        }
        return {
          select: (selector) => Observable.of(selector(s))
        }
      };

      const getRouterStub = ():any => {
        return {
          serializeUrl(v: string[]) {
            return '/' + v.join('/');
          },
          createUrlTree(v) {
            return v;

proxy.stopDaemon(key)
    }
  })

  it('should trigger callback after first being activated', marbles((m) => {
    const wsMsg$ =    m.hot('^-a-b---c-----d--e-', matchingMessages)
    const daemon =   m.cold('-------u-----------', daemonStatusChange).scan(onStatusChange('test1'), null)
    const expected = m.cold('--------c-----d--e-', matchingMessages)

    wsMsg$.subscribe(proxy.apply)
    daemon.subscribe()

    m.expect(callbackSpy1).toBeObservable(expected)
  }))

  it('should not trigger callback after suspension', marbles((m) => {
    const wsMsg$ =    m.hot('^-a-b---c-----d--e-', matchingMessages)
    const daemon =   m.cold('-------u-----d-----', daemonStatusChange).scan(onStatusChange('test1'), null)
    const expected = m.cold('--------c----------', matchingMessages)

    wsMsg$.subscribe(proxy.apply)
    daemon.subscribe()

    m.expect(callbackSpy1).toBeObservable(expected)
  }))

  it('should not trigger callback after re-activation if there is no matching message during suspension', marbles((m) => {
    const wsMsg$ =    m.hot('^-a-b---c----------', matchingMessages)
    const daemon =   m.cold('-------u-----d---u-', daemonStatusChange).scan(onStatusChange('test1'), null)
    const expected = m.cold('--------c----------', matchingMessages)

    wsMsg$.subscribe(proxy.apply)

m.expect(validationWorkflowService.getOperatorValidationStream()).toBeObservable(expected);
  }
  ));

  it('should receive false from validateOperator when operator box is not connected or required properties are not complete ',
  () => {
    workflowActionservice.addOperator(mockScanPredicate, mockPoint);
    workflowActionservice.addOperator(mockResultPredicate, mockPoint);
    workflowActionservice.addLink(mockScanResultLink);
    expect(validationWorkflowService.validateOperator(mockResultPredicate.operatorID)).toBeTruthy();
    expect(validationWorkflowService.validateOperator(mockScanPredicate.operatorID)).toBeFalsy();
  });

  it('should subscribe the changes of validateOperatorStream when one operator box is deleted after valid status ',
  marbles((m) => {
    const testEvents = m.hot('-a-b-c----d-e-----', {
      'a': () => workflowActionservice.addOperator(mockScanPredicate, mockPoint),
      'b': () => workflowActionservice.addOperator(mockResultPredicate, mockPoint),
      'c': () => workflowActionservice.addLink(mockScanResultLink),
      'd': () => workflowActionservice.setOperatorProperty(mockScanPredicate.operatorID, { 'tableName': 'test-table' }),
      'e': () => workflowActionservice.deleteOperator(mockResultPredicate.operatorID)
    });

    testEvents.subscribe(action => action());

    const expected = m.hot('-t-u-(vw)-x-(yz)-)', {
      't': {operatorID: '1', status: false},
      'u': {operatorID: '3', status: false},
      'v': {operatorID: '1', status: false},
      'w': {operatorID: '3', status: true},
      'x': {operatorID: '1', status: true},

);

    const testComponent = new ResultPanelComponent(executeWorkflowService, ngbModel, resultPanelToggleService);

    executeWorkflowService.getExecuteEndedStream().subscribe({
      complete: () => {
        const mockColumns = Object.keys(mockResultData[0]);
        expect(testComponent.currentDisplayColumns).toEqual(mockColumns);
        expect(testComponent.currentColumns).toBeTruthy();
        expect(testComponent.currentDataSource).toBeTruthy();
      }
    });

  }));

  it(`should create error message and update the Component's properties when the execution result size is 0`, marbles((m) => {
    const endMarbleString = '-e-|';
    const endMarbleValues = {
      e: mockExecutionEmptyResult
    };

    spyOn(executeWorkflowService, 'getExecuteEndedStream').and.returnValue(
      m.hot(endMarbleString, endMarbleValues)
    );

    const testComponent = new ResultPanelComponent(executeWorkflowService, ngbModel, resultPanelToggleService);
    executeWorkflowService.getExecuteEndedStream().subscribe({
      complete: () => {
        expect(testComponent.message).toEqual(`execution doesn't have any results`);
        expect(testComponent.currentDataSource).toBeFalsy();
        expect(testComponent.currentColumns).toBeFalsy();
        expect(testComponent.currentDisplayColumns).toBeFalsy();

};

    const transformer1Spy = spyOn(testTransformers, 'transformer1').and.callThrough();
    const transformer2Spy = spyOn(testTransformers, 'transformer2').and.callThrough();

    dynamicSchemaService.registerInitialSchemaTransformer(testTransformers.transformer1);
    dynamicSchemaService.registerInitialSchemaTransformer(testTransformers.transformer2);

    workflowActionService.addOperator(mockScanPredicate, mockPoint);

    expect(transformer1Spy).toHaveBeenCalledTimes(1);
    expect(transformer2Spy).toHaveBeenCalledTimes(1);

  });

  it('should emit event when dynamic schema is changed', marbles((m) => {
    const workflowActionService: WorkflowActionService = TestBed.get(WorkflowActionService);
    const dynamicSchemaService: DynamicSchemaService = TestBed.get(DynamicSchemaService);

    const newSchema: OperatorSchema = {
      ...mockScanSourceSchema,
      jsonSchema: {
        properties: {
          tableName: {
            type: 'string'
          }
        },
        type: 'object'
      }
    };

    const trigger = m.hot('-a-c-', {

m.hot(marbleString, marbleValues)
    );

    const workflowActionService: WorkflowActionService = TestBed.get(WorkflowActionService);

    dragDropService.handleOperatorDropEvent();

    const addOperatorStream = workflowActionService.getTexeraGraph().getOperatorAddStream().map(() => 'a');

    const expectedStream = m.hot('-a-');
    m.expect(addOperatorStream).toBeObservable(expectedStream);


  }));

  it('should change the add an operator at correct position when the element is dropped', marbles((m) => {
    const workflowActionService: WorkflowActionService = TestBed.get(WorkflowActionService);

    workflowActionService.getJointGraphWrapper().setPanningOffset({x: 100, y: 100});
    workflowActionService.getJointGraphWrapper().setZoomProperty(0.1);

    const operatorType = mockOperatorMetaData.operators[0].operatorType;
    const marbleString = '-e-|';
    const marbleValues = {
      e : {operatorType: operatorType, offset: {x: 200, y: 200}}
    };

    spyOn(dragDropService, 'getOperatorDropStream').and.returnValue(
      m.hot(marbleString, marbleValues)
    );

expect(newRatio).toBeGreaterThan(originalZoomRatio);
       expect(newRatio).toEqual(originalZoomRatio + JointGraphWrapper.ZOOM_DIFFERENCE);
     }
   );


  }));

  it('should execute the zoom in function when the user click on the Zoom In button', marbles((m) => {
    m.hot('-e-').do(event => component.onClickZoomIn()).subscribe();
    const zoomEndStream = workflowActionService.getJointGraphWrapper().getWorkflowEditorZoomStream().map(value => 'e');
    const expectedStream = '-e-';
    m.expect(zoomEndStream).toBeObservable(expectedStream);
  }));

  it('should execute the zoom out function when the user click on the Zoom Out button', marbles((m) => {
    m.hot('-e-').do(event => component.onClickZoomOut()).subscribe();
    const zoomEndStream = workflowActionService.getJointGraphWrapper().getWorkflowEditorZoomStream().map(value => 'e');
    const expectedStream = '-e-';
    m.expect(zoomEndStream).toBeObservable(expectedStream);
  }));

  it('should execute restore default when the user click on restore button', marbles((m) => {
    m.hot('-e-').do(event => component.onClickRestoreZoomOffsetDefaullt()).subscribe();
    const restoreEndStream = workflowActionService.getJointGraphWrapper().getRestorePaperOffsetStream().map(value => 'e');
    const expectStream = '-e-';
    m.expect(restoreEndStream).toBeObservable(expectStream);
  }));

});