angularfire: Property 'auth' does not exist on type 'AngularFireAuth'

Version info

Angular: "@angular/cdk": "^9.2.1"

Firebase: "firebase": "^7.14.1"

AngularFire: "@angular/fire": "^6.0.0"

It works well before I’ve updated npm packges to the latest versions. After update I get error:

Property 'auth' does not exist on type 'AngularFireAuth'.

Steps to set up and reproduce

import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';

@Injectable({
  providedIn: 'root'
})
export class AuthService {

  constructor(private authFire: AngularFireAuth) { }

  initAuthListener(){
    this.authFire.auth.onAuthStateChanged(user => {
      if(user) {
        // code
      } else {
        this.authFire.auth.signOut();
      }
    })
  }
}

** Screenshots **

image

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 7
  • Comments: 29 (1 by maintainers)

Commits related to this issue

Most upvoted comments

See the changelog item 6.0.0-rc.0 (2020-01-30)

@angular/fire/auth AngularFireAuth has dropped the auth property and instead Promise Proxies the underlying Firebase auth.Auth instance

Just delete the “auth”, and it will work

The documentation should be fine so far. If you just updated your dependencies / packages, don’t forget to restart or reload your code editor. May some old / false references are loaded.

For VS Code for example (macOS), hit Command + Shift + P and search for reload, hit enter.

After restarting / reloading your code editor, it should work without the .auth call, this.authFire.auth.* -> this.authFire.*. If you try to access the currentUser you need to change your code like following, a few examples:

import { AngularFireAuth }  from '@angular/fire/auth';
import * as firebase from 'firebase/app';

[...]

constructor(
  private authFire: AngularFireAuth
) {}

Update Password Old way: await this.authFire.currentUser.updatePassword('Passw0rd!'); New way: await (await this.authFire.currentUser).updatePassword('Passw0rd!');

Delete User Old way: await this.authFire.auth.currentUser.delete(); New way: (await this.authFire.currentUser).delete;

Sign out Old way: await this.authFire.auth.signOut(); New way: await this.authFire.signOut();

Auth state changed Old way: this.authFire.auth.onAuthStateChanged(...); New way: this.authFire.onAuthStateChanged(...);

Update mail Old way: await this.authFire.auth.currentUser.updateEmail('some@mail.address'); New way: await (await this.authFire.currentUser).updateEmail('some@mail.address');

Reauthenticate user Old way: await this.authFire.auth.currentUser.reauthenticateWithCredential(firebase.auth.EmailAuthProvider.credential(this.authFire.auth.currentUser.email, 'Passw0rd!')); New way: await (await this.authFire.currentUser).reauthenticateWithCredential(firebase.auth.EmailAuthProvider.credential((await this.authFire.currentUser).email, 'Passw0rd!'));

Send password reset mail Old way: await this.authFire.auth.sendPasswordResetEmail(mail); New way: await this.authFire.sendPasswordResetEmail(mail);

Fetch sign in methods Old way: await this.authFire.auth.fetchSignInMethodsForEmail('some@mail.address'); New way: await this.authFire.fetchSignInMethodsForEmail('some@mail.address');

Hope it helps.

Cheers Unkn0wn0x

Como lo solucionaste ? how did you solve it ?

sendmail

Here is your solution:

SendVerificationMail() { return this.afAuth.currentUser.then(u => u.sendEmailVerification()) .then(() => { this.router.navigate(['verify-email-address']); }) }

Hello folks! Thanks @Unkn0wn0x for this helpful thread… Im having some issues after my v9 upgrade.

TypeError: Cannot read property 'GoogleAuthProvider' of undefined

import {AngularFireAuth} from '@angular/fire/auth';
import {auth} from 'firebase/app';
...
constructor(private afAuth: AngularFireAuth )
...
const provider = new auth.GoogleAuthProvider();
const credential = await this.afAuth.signInWithPopup(provider);

– version –

"@angular/fire": "^6.0.0",
 "firebase": "7.14.2"

Any having the same issue? thanks…

Update: 35 minutes after this post…

I had a wrong reference:

import {AngularFireAuth} from '@angular/fire/auth';
import {auth} from 'firebase/app'; // Wrong 
import {auth} from 'firebase'; // Good
...
constructor(private afAuth: AngularFireAuth )
...
const provider = new auth.GoogleAuthProvider();
const credential = await this.afAuth.signInWithPopup(provider);

Como lo solucionaste ? how did you solve it ? sendmail

Here is your solution:

SendVerificationMail() { return this.afAuth.currentUser.then(u => u.sendEmailVerification()) .then(() => { this.router.navigate(['verify-email-address']); }) }

Wrote the same but the u.sendEmailVerification() in … (u => u.sendEmailVerification())… was flagged as “parameter u: firebase.User | null. object is possibly null” error. How does one fix that?

thanks for this. I’m trying to set the languageCode here. This works:

firebase.auth().languageCode = language;

but this does not:

this.angularFireAuth.languageCode = language;

is languageCode exposed through AngularFireAuth?

The documentation should be fine so far. If you just updated your dependencies / packages, don’t forget to restart or reload your code editor. May some old / false references are loaded.

For VS Code for example (macOS), hit Command + Shift + P and search for reload, hit enter.

After restarting / reloading your code editor, it should work without the .auth call, this.authFire.auth.* -> this.authFire.*. If you try to access the currentUser you need to change your code like following, a few examples:

import { AngularFireAuth }  from '@angular/fire/auth';
import * as firebase from 'firebase/app';

[...]

constructor(
  private authFire: AngularFireAuth
) {}

Update Password Old way: await this.authFire.currentUser.updatePassword('Passw0rd!'); New way: await (await this.authFire.currentUser).updatePassword('Passw0rd!');

Delete User Old way: await this.authFire.auth.currentUser.delete(); New way: (await this.authFire.currentUser).delete;

Sign out Old way: await this.authFire.auth.signOut(); New way: await this.authFire.signOut();

Auth state changed Old way: this.authFire.auth.onAuthStateChanged(...); New way: this.authFire.onAuthStateChanged(...);

Update mail Old way: await this.authFire.auth.currentUser.updateEmail('some@mail.address'); New way: await (await this.authFire.currentUser).updateEmail('some@mail.address');

Reauthenticate user Old way: await this.authFire.auth.currentUser.reauthenticateWithCredential(firebase.auth.EmailAuthProvider.credential(this.authFire.auth.currentUser.email, 'Passw0rd!')); New way: await (await this.authFire.currentUser).reauthenticateWithCredential(firebase.auth.EmailAuthProvider.credential((await this.authFire.currentUser).email, 'Passw0rd!'));

Send password reset mail Old way: await this.authFire.auth.sendPasswordResetEmail(mail); New way: await this.authFire.sendPasswordResetEmail(mail);

Fetch sign in methods Old way: await this.authFire.auth.fetchSignInMethodsForEmail('some@mail.address'); New way: await this.authFire.fetchSignInMethodsForEmail('some@mail.address');

Hope it helps.

Cheers Unkn0wn0x

Thank you

@harish1995

this.afAuth.onAuthStateChanged((user) => {
      user.sendEmailVerification();
});

Also look here: https://stackoverflow.com/questions/37431128/firebase-confirmation-email-not-being-sent

How can I get the uuid for an authenticated user?

@HnainiaHend Did you checked my comment here?

May you need to restart your Code Editor to get the latest references.

Hope it helps.

Cheers Unkn0wn0x