Migrating to pendingUntilEvent

Author: jamesdaniels

samples/advanced/src/app/app-check/app-check.component.ts

@@ -1,10 +1,8 @@
-import { CompilerFactory, DoBootstrap, NgModule, NgZone, PendingTasks, PlatformRef } from '@angular/core';
+import { CompilerFactory, DoBootstrap, NgModule, PlatformRef } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
-import { ɵAngularFireSchedulers, ɵZoneScheduler, ɵkeepUnstableUntilFirstFactory } from '@angular/fire';
+import { ɵZoneScheduler } from '@angular/fire';
 import { AngularFireModule, FirebaseApp } from '@angular/fire/compat';
 import { BrowserModule } from '@angular/platform-browser';
-import { Observable, Subject, of } from 'rxjs';
-import { tap } from 'rxjs/operators';
 import { TestScheduler } from 'rxjs/testing';
 import { COMMON_CONFIG } from '../../src/test-config';
 import { rando } from '../../src/utils';
@@ -85,112 +83,6 @@ describe('angularfire', () => {
     });
   });
 
-  describe('keepUnstableUntilFirstFactory', () => {
-    let schedulers: ɵAngularFireSchedulers;
-    let outsideZone: Zone;
-    let insideZone: Zone;
-    beforeEach(() => {
-      outsideZone = Zone.current;
-      insideZone = Zone.current.fork({
-        name: 'ngZone'
-      });
-      const ngZone = {
-        run: insideZone.run.bind(insideZone),
-        runGuarded: insideZone.runGuarded.bind(insideZone),
-        runOutsideAngular: outsideZone.runGuarded.bind(outsideZone),
-        runTask: insideZone.run.bind(insideZone)
-      } as NgZone;
-      schedulers = new ɵAngularFireSchedulers(ngZone, TestBed.inject(PendingTasks));
-    });
-
-    it('should re-schedule emissions asynchronously', done => {
-      const keepUnstableOp = ɵkeepUnstableUntilFirstFactory(schedulers);
-
-      let ran = false;
-      of(null).pipe(
-        keepUnstableOp,
-        tap(() => ran = true)
-      ).subscribe(() => {
-        expect(ran).toEqual(true);
-        done();
-      }, () => fail('Should not error'));
-
-      expect(ran).toEqual(false);
-    });
-
-    it(`should subscribe outside angular and observe inside angular`, done => {
-
-      const keepUnstableOp = ɵkeepUnstableUntilFirstFactory(schedulers);
-
-      insideZone.run(() => {
-        new Observable(s => {
-          expect(Zone.current).toEqual(outsideZone);
-          s.next('test');
-        }).pipe(
-          keepUnstableOp,
-          tap(() => {
-            expect(Zone.current).toEqual(insideZone);
-          })
-        ).subscribe(() => {
-          expect(Zone.current).toEqual(insideZone);
-          done();
-        }, err => {
-          fail(err);
-        });
-      });
-
-    });
-
-    // TODO(davideast): new Zone['TaskTrackingZoneSpec'](); no longer works
-    xit('should block until first emission', done => {
-      const testScheduler = new TestScheduler(null);
-      testScheduler.run(helpers => {
-        const outsideZone = Zone.current;
-        // eslint-disable-next-line @typescript-eslint/dot-notation
-        const taskTrack = new Zone['TaskTrackingZoneSpec']();
-        const insideZone = Zone.current.fork(taskTrack);
-        const trackingSchedulers: ɵAngularFireSchedulers = {
-          ngZone: {
-            run: insideZone.run.bind(insideZone),
-            runGuarded: insideZone.runGuarded.bind(insideZone),
-            runOutsideAngular: outsideZone.runGuarded.bind(outsideZone),
-            runTask: insideZone.run.bind(insideZone)
-          } as NgZone,
-          outsideAngular: new ɵZoneScheduler(outsideZone, testScheduler),
-          insideAngular: new ɵZoneScheduler(insideZone, testScheduler),
-          pendingTasks: TestBed.inject(PendingTasks),
-        };
-        const keepUnstableOp = ɵkeepUnstableUntilFirstFactory(trackingSchedulers);
-
-        const s = new Subject();
-        s.pipe(
-          keepUnstableOp
-        ).subscribe(() => undefined, err => {
-          fail(err);
-        }, () => undefined);
-
-        // Flush to ensure all async scheduled functions are run
-        helpers.flush();
-        // Should now be blocked until first item arrives
-        expect(taskTrack.macroTasks.length).toBe(1);
-        expect(taskTrack.macroTasks[0].source).toBe('firebaseZoneBlock');
-
-        // Emit next item
-        s.next(123);
-        helpers.flush();
-
-        // TODO drop this, it's to work around my 15ms timeout hack
-        setTimeout(() => {
-          // Should not be blocked after first item
-          expect(taskTrack.macroTasks.length).toBe(0);
-          done();
-        }, 150);
-
-      });
-    });
-
-  });
-
   describe('FirebaseApp', () => {
 
     it('should provide a FirebaseApp for the FirebaseApp binding', () => {

samples/advanced/src/app/storage/storage.component.ts

@@ -1,6 +1,7 @@
 import { isPlatformServer } from '@angular/common';
 import { Inject, Injectable, InjectionToken, NgZone, Optional, PLATFORM_ID } from '@angular/core';
-import { keepUnstableUntilFirst, ɵAngularFireSchedulers } from '@angular/fire';
+import { pendingUntilEvent } from '@angular/core/rxjs-interop';
+import { ɵAngularFireSchedulers } from '@angular/fire';
 import { AppCheckInstances } from '@angular/fire/app-check';
 import { ɵPromiseProxy, ɵapplyMixins, ɵlazySDKProxy } from '@angular/fire/compat';
 import { FIREBASE_APP_NAME, FIREBASE_OPTIONS, FirebaseApp, ɵcacheInstance, ɵfirebaseAppFactory } from '@angular/fire/compat';
@@ -121,7 +122,7 @@ export class AngularFireAuth {
 
       const redirectResult = auth.pipe(
         switchMap(auth => auth.getRedirectResult().then(it => it, () => null)),
-        keepUnstableUntilFirst,
+        pendingUntilEvent(),
         shareReplay({ bufferSize: 1, refCount: false }),
       );
 

samples/advanced/src/app/upboats/lazyFirestore.ts

@@ -1,4 +1,4 @@
-import { NgZone, PendingTasks } from '@angular/core';
+import { NgZone } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
 import { ɵAngularFireSchedulers } from '@angular/fire';
 import { AngularFireModule, FIREBASE_APP_NAME, FIREBASE_OPTIONS, FirebaseApp } from '@angular/fire/compat';
@@ -41,7 +41,7 @@ describe('AngularFireDatabase', () => {
     });
 
     it('should accept a Firebase App in the constructor', (done) => {
-      const schedulers = new ɵAngularFireSchedulers(zone, TestBed.inject(PendingTasks));
+      const schedulers = new ɵAngularFireSchedulers();
       const database = new AngularFireDatabase(
         app.options, rando(), undefined, {}, zone, schedulers, undefined, undefined,
         undefined, undefined, undefined, undefined, undefined, undefined, undefined,

samples/modular/src/app/app-check/app-check.component.ts

@@ -1,4 +1,4 @@
-import { Inject, Injectable, InjectionToken, NgZone, Optional, PLATFORM_ID } from '@angular/core';
+import { Inject, Injectable, InjectionToken, NgZone, Optional, PLATFORM_ID, inject } from '@angular/core';
 import { ɵAngularFireSchedulers } from '@angular/fire';
 import { AppCheckInstances } from '@angular/fire/app-check';
 import { FIREBASE_APP_NAME, FIREBASE_OPTIONS, ɵcacheInstance, ɵfirebaseAppFactory } from '@angular/fire/compat';
@@ -68,7 +68,7 @@ export class AngularFireDatabase {
   }
 
   list<T>(pathOrRef: PathReference, queryFn?: QueryFn): AngularFireList<T> {
-    const ref = this.schedulers.ngZone.runOutsideAngular(() => getRef(this.database, pathOrRef));
+    const ref = inject(NgZone).runOutsideAngular(() => getRef(this.database, pathOrRef));
     let query: DatabaseQuery = ref;
     if (queryFn) {
       query = queryFn(ref);
@@ -77,12 +77,12 @@ export class AngularFireDatabase {
   }
 
   object<T>(pathOrRef: PathReference): AngularFireObject<T> {
-    const ref = this.schedulers.ngZone.runOutsideAngular(() => getRef(this.database, pathOrRef));
+    const ref = inject(NgZone).runOutsideAngular(() => getRef(this.database, pathOrRef));
     return createObjectReference<T>(ref, this);
   }
 
   createPushId() {
-    const ref = this.schedulers.ngZone.runOutsideAngular(() => this.database.ref());
+    const ref = inject(NgZone).runOutsideAngular(() => this.database.ref());
     return ref.push().key;
   }
 

samples/modular/src/app/storage/storage.component.ts

@@ -1,4 +1,5 @@
-import { keepUnstableUntilFirst } from '@angular/fire';
+import { NgZone, inject } from '@angular/core';
+import { pendingUntilEvent } from '@angular/core/rxjs-interop';
 import type { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { AngularFireDatabase } from '../database';
@@ -11,21 +12,21 @@ import { stateChanges } from './state-changes';
 
 export function createListReference<T= any>(query: DatabaseQuery, afDatabase: AngularFireDatabase): AngularFireList<T> {
   const outsideAngularScheduler = afDatabase.schedulers.outsideAngular;
-  const refInZone = afDatabase.schedulers.ngZone.run(() => query.ref);
+  const refInZone = inject(NgZone).run(() => query.ref);
   return {
     query,
     update: createDataOperationMethod(refInZone, 'update'),
     set: createDataOperationMethod(refInZone, 'set'),
     push: (data: T) => refInZone.push(data),
     remove: createRemoveMethod(refInZone),
     snapshotChanges(events?: ChildEvent[]) {
-      return snapshotChanges<T>(query, events, outsideAngularScheduler).pipe(keepUnstableUntilFirst);
+      return snapshotChanges<T>(query, events, outsideAngularScheduler).pipe(pendingUntilEvent());
     },
     stateChanges(events?: ChildEvent[]) {
-      return stateChanges<T>(query, events, outsideAngularScheduler).pipe(keepUnstableUntilFirst);
+      return stateChanges<T>(query, events, outsideAngularScheduler).pipe(pendingUntilEvent());
     },
     auditTrail(events?: ChildEvent[]) {
-      return auditTrail<T>(query, events, outsideAngularScheduler).pipe(keepUnstableUntilFirst);
+      return auditTrail<T>(query, events, outsideAngularScheduler).pipe(pendingUntilEvent());
     },
     valueChanges<K extends string>(events?: ChildEvent[], options?: {idField?: K}): Observable<(T & Record<string, string>)[]> {
       const snapshotChanges$ = snapshotChanges<T>(query, events, outsideAngularScheduler);
@@ -42,7 +43,7 @@ export function createListReference<T= any>(query: DatabaseQuery, afDatabase: An
             return a.payload.val() as T & Record<string, string>
           }
         })),
-        keepUnstableUntilFirst
+        pendingUntilEvent()
       );
     }
   };