Cannot call .then on UploadTask

deoxen0n2 commented 7 years ago

Version info

Angular: 1.4.3

Firebase: 3.7.5

AngularFire: 2.3.0

Browser: Chrome 56.0.2924.87

Steps to reproduce

const imageStorageRef = firebase.storage().ref('images')
const imageStorage = $firebaseStorage(imageStorageRef)
const uploadTask = imageStorage.$putString(image, 'base64')

uploadTask.then((snap) => {
  console.log('downloadURL:', snap.downloadURL)
})

Expected behavior

Log the download URL successfully.

Actual behavior

An error occurred on Firebase SDK (not on the AngularFire): TypeError: Cannot read property 'then' of undefined.

Hi, I have an unexpected behavior as specified above. But if I use imageStorage.putString(...) that is the method not wrapped by AngularFire, the error disappear. I also tried changing the following lines on AngularFire (https://github.com/firebase/angularfire/blob/master/src/storage/FirebaseStorage.js#L40):

From

      $cancel: task.cancel,
      $resume: task.resume,
      $pause: task.pause,
      then: task.then,
      catch: task.catch,
      $snapshot: task.snapshot
};

to

      $cancel: task.cancel,
      $resume: task.resume,
      $pause: task.pause,
      then: task.then.bind(task),
      catch: task.catch.bind(task),
      $snapshot: task.snapshot
};

Which add .bind(task) to the then and catch methods and now it works as expected. Not sure if this is a correct solution.

jwngr commented 7 years ago

Seems like we might need to bind task to all of those methods actually so they have the proper scope. I'm surprised the tests pass as is though... I don't have time to look into this, but maybe David (who wrote the initial code) does. Otherwise, if you can find a failing test and put together a PR which fixes it, that would be awesome!