fix(storage): task promise fixes (#1430)

Author: davideast

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angularfire2",
-  "version": "5.0.0-rc.5.6-next",
+  "version": "5.0.0-rc.6",
   "description": "The official library of Firebase and Angular.",
   "private": true,
   "scripts": {

src/storage/observable/fromTask.ts

@@ -2,7 +2,7 @@ import { UploadTask, UploadTaskSnapshot } from '@firebase/storage-types';
 import { Observable } from 'rxjs/Observable';
 
 export function fromTask(task: UploadTask) {
-  return new Observable<UploadTaskSnapshot | undefined>(subscriber => {
+  return new Observable<UploadTaskSnapshot>(subscriber => {
     const progress = (snap: UploadTaskSnapshot) => subscriber.next(snap);
     const error = e => subscriber.error(e);
     const complete = () => subscriber.complete();

src/storage/ref.ts

@@ -20,20 +20,18 @@ export interface AngularFireStorageReference {
  */
 export function createStorageRef(ref: Reference): AngularFireStorageReference {
   return {
-    getDownloadURL() { return from(ref.getDownloadURL()); },
-    getMetadata() { return from(ref.getMetadata()) },
-    delete() { return from(ref.delete()); },
-    child(path: string) { return createStorageRef(ref.child(path)); },
-    updateMetatdata(meta: SettableMetadata) {
-      return from(ref.updateMetadata(meta));
-    },
-    put(data: any, metadata?: UploadMetadata) {
+    getDownloadURL: () => from(ref.getDownloadURL()),
+    getMetadata: () => from(ref.getMetadata()),
+    delete: () => from(ref.delete()),
+    child: (path: string) => createStorageRef(ref.child(path)),
+    updateMetatdata: (meta: SettableMetadata) => from(ref.updateMetadata(meta)),
+    put: (data: any, metadata?: UploadMetadata) => {
       const task = ref.put(data, metadata);
       return createUploadTask(task);
     },
-    putString(data: string, format?: StringFormat, metadata?: UploadMetadata) {
+    putString: (data: string, format?: StringFormat, metadata?: UploadMetadata) => {
       const task = ref.putString(data, format, metadata);
       return createUploadTask(task);
     }
-  }
+  };
 }

src/storage/storage.spec.ts

@@ -3,7 +3,7 @@ import { Observable } from 'rxjs/Observable'
 import { forkJoin } from 'rxjs/observable/forkJoin';
 import { TestBed, inject } from '@angular/core/testing';
 import { FirebaseApp, FirebaseAppConfig, AngularFireModule } from 'angularfire2';
-import { AngularFireStorageModule, AngularFireStorage } from 'angularfire2/storage';
+import { AngularFireStorageModule, AngularFireStorage, AngularFireUploadTask } from 'angularfire2/storage';
 import { COMMON_CONFIG } from './test-config';
 
 describe('AngularFireStorage', () => {
@@ -63,6 +63,18 @@ describe('AngularFireStorage', () => {
         () => { ref.delete().subscribe(done, done.fail); }
       );
     });
+
+    it('should resolve the task as a promise', (done) => {
+      const data = { angular: "promise" };
+      const blob = new Blob([JSON.stringify(data)], { type : 'application/json' });
+      const ref = afStorage.ref('afs.json');
+      const task: AngularFireUploadTask = ref.put(blob);
+      task.then(snap => { 
+        expect(snap).toBeDefined(); 
+        done();
+      }).catch(done.fail);
+    });
+
   });
 
   describe('reference', () => {

src/storage/storage.ts

@@ -11,7 +11,6 @@ import { Observable } from 'rxjs/Observable';
  * This service is the main entry point for this feature module. It provides
  * an API for uploading and downloading binary files from Cloud Storage for
  * Firebase.
- *
  */
 @Injectable()
 export class AngularFireStorage {

src/storage/task.ts

@@ -2,41 +2,42 @@ import { UploadTaskSnapshot, UploadTask } from '@firebase/storage-types';
 import { fromTask } from './observable/fromTask';
 import { Observable } from 'rxjs/Observable';
 import { map, filter } from 'rxjs/operators';
+import { from } from 'rxjs/observable/from';
 
 export interface AngularFireUploadTask {
+  task: UploadTask,
   snapshotChanges(): Observable<UploadTaskSnapshot | undefined>;
   percentageChanges(): Observable<number | undefined>;
   downloadURL(): Observable<string | null>;
   pause(): boolean;
   cancel(): boolean;
   resume(): boolean;
-  then(): Promise<any>;
+  then(
+    onFulfilled?: ((a: UploadTaskSnapshot) => any) | null, 
+    onRejected?: ((a: Error) => any) | null
+  ): Promise<any>;
   catch(onRejected: (a: Error) => any): Promise<any>;
 }
 
+/**
+ * Create an AngularFireUploadTask from a regular UploadTask from the Storage SDK.
+ * This method creates an observable of the upload and returns on object that provides
+ * multiple methods for controlling and monitoring the file upload.
+ * @param task 
+ */
 export function createUploadTask(task: UploadTask): AngularFireUploadTask {
   const inner$ = fromTask(task);
   return {
-    pause() { return task.pause(); },
-    cancel() { return task.cancel(); },
-    resume() { return task.resume(); },
-    then() { return task.then(); },
-    catch(onRejected: (a: Error) => any) {
-      return task.catch(onRejected);
-    },
-    snapshotChanges() { return inner$; },
-    percentageChanges() {
-      return inner$.pipe(
-        filter(s => s !== undefined),
-        map(s => s!.bytesTransferred / s!.totalBytes * 100)
-      );
-    },
-    downloadURL() {
-      return inner$.pipe(
-        filter(s => s !== undefined),
-        filter(s => s!.bytesTransferred === s!.totalBytes),
-        map(s => s!.downloadURL)
-      );
-    }
+    task: task,
+    then: task.then.bind(task),
+    catch: task.catch.bind(task),
+    pause: task.pause.bind(task),
+    cancel: task.cancel.bind(task),
+    resume: task.resume.bind(task),
+    snapshotChanges: () => inner$,
+    downloadURL: () => from(task.then(s => s.downloadURL)),
+    percentageChanges: () => inner$.pipe(
+      map(s => s.bytesTransferred / s.totalBytes * 100)
+    )
   };
 }