fix(component): transform to Observable if Input is Promise

Author: DaSchTour

modules/component/spec/core/cd-aware/cd-aware_creator.spec.ts

@@ -108,6 +108,13 @@ describe('CdAware', () => {
       expect(cdAwareImplementation.renderedValue).toBe(42);
     });
 
+    it('should render_creator emitted value from passed promise without changing it', () => {
+      cdAwareImplementation.cdAware.nextPotentialObservable(
+        Promise.resolve(42)
+      );
+      expect(cdAwareImplementation.renderedValue).toBe(42);
+    });
+
     it('should render_creator undefined as value when a new observable NEVER was passed (as no value ever was emitted from new observable)', () => {
       cdAwareImplementation.cdAware.nextPotentialObservable(of(42));
       expect(cdAwareImplementation.renderedValue).toBe(42);

modules/component/spec/let/let.directive.spec.ts

@@ -5,7 +5,15 @@ import {
   ViewContainerRef,
 } from '@angular/core';
 import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing';
-import { EMPTY, interval, NEVER, Observable, of, throwError } from 'rxjs';
+import {
+  EMPTY,
+  interval,
+  NEVER,
+  Observable,
+  ObservableInput,
+  of,
+  throwError,
+} from 'rxjs';
 import { take } from 'rxjs/operators';
 
 import { LetDirective } from '../../src/let/let.directive';
@@ -65,7 +73,7 @@ class LetDirectiveTestCompleteComponent {
 
 let fixtureLetDirectiveTestComponent: any;
 let letDirectiveTestComponent: {
-  value$: Observable<any> | undefined | null;
+  value$: ObservableInput<any> | undefined | null;
 };
 let componentNativeElement: any;
 
@@ -188,6 +196,12 @@ describe('LetDirective', () => {
       expect(componentNativeElement.textContent).toBe('42');
     });
 
+    it('should render_creator emitted value from passed promise without changing it', () => {
+      letDirectiveTestComponent.value$ = Promise.resolve(42);
+      fixtureLetDirectiveTestComponent.detectChanges();
+      expect(componentNativeElement.textContent).toBe('42');
+    });
+
     it('should render_creator undefined as value when a new observable NEVER was passed (as no value ever was emitted from new observable)', () => {
       letDirectiveTestComponent.value$ = of(42);
       fixtureLetDirectiveTestComponent.detectChanges();

modules/component/spec/push/push.pipe.spec.ts

@@ -1,6 +1,6 @@
 import { ChangeDetectorRef, Component } from '@angular/core';
 import { TestBed, waitForAsync } from '@angular/core/testing';
-import { EMPTY, NEVER, Observable, of } from 'rxjs';
+import { EMPTY, NEVER, Observable, ObservableInput, of } from 'rxjs';
 
 import { PushPipe } from '../../src/push/push.pipe';
 import { MockChangeDetectorRef } from '../fixtures/fixtures';
@@ -20,7 +20,7 @@ class PushPipeTestComponent {
 
 let fixturePushPipeTestComponent: any;
 let pushPipeTestComponent: {
-  value$: Observable<any> | undefined | null;
+  value$: ObservableInput<any> | undefined | null;
 };
 let componentNativeElement: any;
 
@@ -71,6 +71,10 @@ describe('PushPipe', () => {
         expect(pushPipe.transform(of(42))).toBe(42);
       });
 
+      it('should return emitted value from passed promise without changing it', () => {
+        expect(pushPipe.transform(Promise.resolve(42))).toBe(42);
+      });
+
       it('should return undefined as value when a new observable NEVER was passed (as no value ever was emitted from new observable)', () => {
         expect(pushPipe.transform(of(42))).toBe(42);
         expect(pushPipe.transform(NEVER)).toBe(undefined);
@@ -148,6 +152,12 @@ describe('PushPipe', () => {
         expect(componentNativeElement.textContent).toBe(wrapWithSpace('42'));
       });
 
+      it('should emitted value from passed promise without changing it', () => {
+        pushPipeTestComponent.value$ = Promise.resolve(42);
+        fixturePushPipeTestComponent.detectChanges();
+        expect(componentNativeElement.textContent).toBe(wrapWithSpace('42'));
+      });
+
       it('should return undefined as value when a new observable NEVER was passed (as no value ever was emitted from new observable)', () => {
         pushPipeTestComponent.value$ = of(42);
         fixturePushPipeTestComponent.detectChanges();

modules/component/src/core/cd-aware/cd-aware_creator.ts

@@ -1,21 +1,26 @@
 import {
+  asapScheduler,
   EMPTY,
+  isObservable,
   NextObserver,
   Observable,
+  ObservableInput,
+  scheduled,
   Subject,
   Subscribable,
   Subscription,
 } from 'rxjs';
 import {
   catchError,
   distinctUntilChanged,
-  filter,
   switchMap,
   tap,
 } from 'rxjs/operators';
 
 export interface CdAware<U> extends Subscribable<U> {
-  nextPotentialObservable: (value: any) => void;
+  nextPotentialObservable: (
+    value: ObservableInput<any> | null | undefined
+  ) => void;
 }
 
 /**
@@ -32,12 +37,12 @@ export function createCdAware<U>(cfg: {
   resetContextObserver: NextObserver<void>;
   updateViewContextObserver: NextObserver<U | undefined | null>;
 }): CdAware<U | undefined | null> {
-  const potentialObservablesSubject = new Subject<
-    Observable<U> | undefined | null
-  >();
-  const observablesFromTemplate$ = potentialObservablesSubject.pipe(
-    distinctUntilChanged()
-  );
+  const potentialObservablesSubject: Subject<
+    ObservableInput<U> | undefined | null
+  > = new Subject();
+  const observablesFromTemplate$: Observable<
+    ObservableInput<U> | undefined | null
+  > = potentialObservablesSubject.pipe(distinctUntilChanged());
 
   const rendering$ = observablesFromTemplate$.pipe(
     // Compose the observables from the template and the strategy
@@ -54,25 +59,30 @@ export function createCdAware<U>(cfg: {
         return EMPTY;
       }
 
+      const ob$: Observable<U> = isObservable(observable$)
+        ? (observable$ as Observable<U>)
+        : scheduled<U>(observable$, asapScheduler);
+
       // If a new Observable arrives, reset the value to render_creator
       // We do this because we don't know when the next value arrives and want to get rid of the old value
       cfg.resetContextObserver.next();
       cfg.render();
 
-      return observable$.pipe(
+      return (ob$ as Observable<U>).pipe(
         distinctUntilChanged(),
         tap(cfg.updateViewContextObserver),
         tap(() => cfg.render()),
         catchError((e) => {
-          console.error(e);
           return EMPTY;
         })
       );
     })
   );
 
   return {
-    nextPotentialObservable(value: Observable<U> | undefined | null): void {
+    nextPotentialObservable(
+      value: ObservableInput<U> | undefined | null
+    ): void {
       potentialObservablesSubject.next(value);
     },
     subscribe(): Subscription {