I am trying to sign out currently signed in user in my angular app. That's my client service:
export class AuthClientService {
public register(email: string, password: string): Observable<Object> {
return from(
createUserWithEmailAndPassword(this.firebaseService.auth, email, password)
);
}
public logIn(email: string, password: string): Observable<Object> {
return from(
signInWithEmailAndPassword(this.firebaseService.auth, email, password)
);
}
public logOut(): Observable<void> {
return from(signOut(this.firebaseService.auth));
}
constructor(private firebaseService: FirebaseService) {}
}
and firebase service:
@Injectable({
providedIn: 'root',
})
export class FirebaseService {
public app = initializeApp(firebaseConfig);
public auth = getAuth();
}
but when i call logOut function theres this error:
ERROR Error: Uncaught (in promise): TypeError: Cannot assign to read only property 'currentUser' of object '[object Object]' TypeError: Cannot assign to read only property 'currentUser' of object '[object Object]' at index-8593558d.js:2473 at Generator.next () at asyncGeneratorStep (asyncToGenerator.js:3) at _next (asyncToGenerator.js:25) at asyncToGenerator.js:32 at new ZoneAwarePromise (zone.js:1387) at asyncToGenerator.js:21 at AuthImpl.directlySetCurrentUser (index-8593558d.js:2466) at index-8593558d.js:2329 at Generator.next () at resolvePromise (zone.js:1213) at zone.js:1120 at zone.js:1136 at ZoneDelegate.invoke (zone.js:372) at Object.onInvoke (core.js:28692) at ZoneDelegate.invoke (zone.js:371) at Zone.run (zone.js:134) at zone.js:1276 at ZoneDelegate.invokeTask (zone.js:406) at Object.onInvokeTask (core.js:28679)
app is calling it from ngrx effects, but i don't think thats an issue, because i tried to call it without ngrx and there's still this error.
So after some investigation i found solution, i am not sure about the cause of this problem, but this may be helpful to someone. First i moved user auth logic from ngrx effects to Angular fire auth observer like this:
public authObserver(): void {
this.angularFireAuth.user.subscribe((user) => {
if (user) {
this.store.dispatch(readCredentials({ userCredential: user }));
this.router.navigate(['/dashboard']);
}
});
}
After that i realized that cause of error was passing user object to ngrx action function. When i create deep copy of the object user and pass it to function like this it works fine.
public authObserver(): void {
this.angularFireAuth.user.subscribe((user) => {
if (user) {
let copy = JSON.parse(JSON.stringify(user));
this.store.dispatch(readCredentials({ userCredential: copy }));
this.router.navigate(['/dashboard']);
}
});
}