@lookininward wrote:
I have a component with a form that holds the email and password. Imports at the top:
import Component from '@ember/component'; import { inject as service } from '@ember/service'; import { computed } from '@ember/object'; import * as firebase from 'firebase';
Next, I inject the service for the firebaseApp and session (session just has some attrs that I set to tell the app we’re authenticated – these will be refactored later):
session: service(), firebaseApp: service(),
If I pass these values into the
signInWithEmailAndPassword()
function fromfbApp.auth()
, the account is validated and logged in. Works as expected:login() { const session = this.get('session'); const fbApp = this.get('firebaseApp'); const e = this.get('form.email'); const p = this.get('form.password'); fbApp.auth().signInWithEmailAndPassword(e, p).then(u => { session.set('user.email', u.email); session.set('user.signedIn', true); this.get('goHome')(); // route transition to home }).catch(e => { this.set('error', 'Something went wrong. Try again?'); }); }
Next, I wanted to persist the session so that the user is not logged out on refresh, only if the tab is closed. So I modified the code and wrapped the
signInWithEmailAndPassword
in withsetPersistence
as follows:login() { const session = this.get('session'); const fbApp = this.get('firebaseApp'); const e = this.get('form.email'); const p = this.get('form.password'); fbApp.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION) .then(()=> { fbApp.auth().signInWithEmailAndPassword(e, p).then(u => { session.set('user.email', u.email); session.set('user.signedIn', true); this.get('goHome')(); // route transition to home }).catch(e => { this.set('error', 'Something went wrong. Try again?'); }); }).catch(e => { this.set('error', 'Something went wrong. Try again?'); }); }
This doesn’t work. I get a
Cannot read property 'SESSION' of undefined
error in the console. I’m sure it has to do with how firebase is imported but I’m having trouble with it.
Posts: 1
Participants: 1