Flutter, Redux and Firebase Auth Invalid argument(

Question

I'm developing flutter app and I added firebase auth to project. And it's running fine for Google SignIn but I don't understand how make works Sign In with email and Password.

I'm follow the example there https://flutterbyexample.com/log-in-redux-cycle-contd.

I've added actions, reducers and middleware follow the guideline for Google Sign In but in Email and Password case some strange happens.

Here the log:

I/FirebaseAuth(27942): [FirebaseAuth:] Loading module via FirebaseOptions.
I/FirebaseAuth(27942): [FirebaseAuth:] Preparing to create service connection to gms implementation
D/FirebaseAuth(27942): Notifying id token listeners about user ( MZr9euoZKEbWWqNIrB5OcZIWcwf2 ).
D/FirebaseApp(27942): Notifying auth state listeners.
D/FirebaseApp(27942): Notified 0 auth state listeners.
I/flutter (27942): [INFO] LoggingMiddleware: {Action: LogInWithMailAndPasswordFail{There was an error loggin in: Invalid argument(s)}, State: AppState{isLoading: false, currentUser: null}}, ts: 2018-12-27 09:03:18.185480}
I/flutter (27942): [INFO] LoggingMiddleware: {Action: Instance of 'LogInWithMailAndPassword', State: AppState{isLoading: false, currentUser: null}}, ts: 2018-12-27 09:03:18.199120}

As you can see in reality the Log In works but immediately after the log in the action LogInWithMailAndPasswordFail is call.

Part of middleware code here:

    Middleware<AppState> _createLogInWithMailAndPasswordMiddleware() {
  // These functions will always take
  // your store,
  // the action thats been dispatched
  // and the a special function called next.
  return (Store store, action, NextDispatcher next) async {
    // FirebaseUser is the type of your User.
    FirebaseUser user;
    // Firebase 'instances' are temporary instances which give
    // you access to your FirebaseUser. This includes
    // some tokens we need to sign in.
    final FirebaseAuth _auth = FirebaseAuth.instance;

    if (action is LogInWithMailAndPassword) {
      try {

        user = await _auth.signInWithEmailAndPassword(
              email: action.getUsername(),
              password: action.getPassword());


        print('Logged in ' + user.displayName);
        // This can be tough to reason about -- or at least it was for me.
        // We're going to dispatch a new action if we logged in,
        //
        // We also continue the current cycle below by calling next(action).
        store.dispatch(new LogInWithMailAndPasswordSuccessful(user: user));
      } catch (error) {
        store.dispatch(new LogInWithMailAndPasswordFail(error));
      }
    }

    // After you do whatever logic you need to do,
    // call this Redux built-in method,
    // It continues the redux cycle.
    next(action);
  };
}

Answer 1

I would check if user object has displayName property.

Verify by printing the user object rather than user.displayName

Answer 2

My problem was that I didn't instanciate correctly the middleware because in this section I have more than one middleware.

List<Middleware<AppState>> createAuthMiddleware()  {
  print('createAuthMiddleware');
  final logIn = createLogInMiddleware();
  final logOut = createLogOutMiddleware();
  final signUp = createSignUpMiddleware();
  return [
    TypedMiddleware<AppState, LogInWithGoogle>(logIn),
    TypedMiddleware<AppState, LogInWithFacebook>(logIn),
    TypedMiddleware<AppState, LogInEmailAndPassword>(logIn),
    TypedMiddleware<AppState, CheckLogIn>(logIn),
    TypedMiddleware<AppState, ForgotPassword>(logIn),
    TypedMiddleware<AppState, SignUpEmailAndPassword>(signUp),
    TypedMiddleware<AppState, LogOut>(logOut),
  ];
}