From 1a7ad4c2a270e1f69058131cf5db93eba1e77832 Mon Sep 17 00:00:00 2001
From: jwu-fisker <jwu@fiskerinc.com>
Date: Fri, 8 Jan 2021 15:06:19 -0800
Subject: [PATCH] Fix sign up form bug

---
 src/components/Contexts/UserContext.jsx       | 31 +++++++++++++++++--
 src/components/Contexts/UserContext.test.jsx  |  7 +++--
 .../Contexts/__mocks__/UserContext.jsx        | 15 +++++++--
 src/components/SignUpForm/SignUpForm.test.jsx | 11 ++++---
 src/components/SignUpForm/index.jsx           |  5 ++-
 5 files changed, 54 insertions(+), 15 deletions(-)

diff --git a/src/components/Contexts/UserContext.jsx b/src/components/Contexts/UserContext.jsx
index 0fa235a..af42fa3 100644
--- a/src/components/Contexts/UserContext.jsx
+++ b/src/components/Contexts/UserContext.jsx
@@ -26,6 +26,8 @@ export const UserProvider = ({ children }) => {
   }, []);
  
   const signIn = async (username, password) => {
+    let result = null;
+
     try {
       if (!username) throw new Error('Email is required');
       if (!password) throw new Error('Password is required');
@@ -33,7 +35,7 @@ export const UserProvider = ({ children }) => {
       setFetching(true);
       setError(null);
   
-      const result = await auth.signIn(username, password);
+      result = await auth.signIn(username, password);
 
       if (result.message) throw new Error(result.message);
       signedIn(result);
@@ -44,9 +46,13 @@ export const UserProvider = ({ children }) => {
     finally {
       setFetching(false);
     }
+
+    return result;
   };
 
   const signUp = async (username, password, confirmPassword) => {
+    let result = null;
+
     try {
       if (!username) throw new Error('Email is required');
       if (!password) throw new Error('Password is required');
@@ -55,7 +61,7 @@ export const UserProvider = ({ children }) => {
       setFetching(true);
       setError(null);
 
-      const result = await auth.signUp(username, password);
+      result = await auth.signUp(username, password);
       if (result.message) throw new Error(result.message);
     }
     catch (error) {
@@ -64,6 +70,26 @@ export const UserProvider = ({ children }) => {
     finally {
       setFetching(false);
     }
+
+    return result;
+  };
+
+  const signUpAndIn =  async (username, password, confirmPassword) => {
+    let result = null;
+
+    try {
+      result = await signUp(username, password, confirmPassword);
+      if (result.message) throw new Error(result.message);
+      result = await signIn(username, password);
+    }
+    catch (error) {
+      setError(error.message);
+    }
+    finally {
+      setFetching(false);
+    }
+
+    return result;
   };
 
   const signOut = async () => {
@@ -86,6 +112,7 @@ export const UserProvider = ({ children }) => {
       setError,
       signIn,
       signUp,
+      signUpAndIn,
       signOut,
     }}>
       {children}
diff --git a/src/components/Contexts/UserContext.test.jsx b/src/components/Contexts/UserContext.test.jsx
index 0e773a3..c46bf60 100644
--- a/src/components/Contexts/UserContext.test.jsx
+++ b/src/components/Contexts/UserContext.test.jsx
@@ -19,7 +19,7 @@ describe("UseContext", () => {
             <button data-testid="signUpNoEmail" onClick={() => signUp("")}/>
             <button data-testid="signUpNoPassword" onClick={() => signUp("test@test.com", "")}/>
             <button data-testid="signUpBadConfirm" onClick={() => signUp("test@test.com", "password", "")}/>
-            <button data-testid="signUp" onClick={() => signUp("test@test.com", "password", "password")}/>          
+            <button data-testid="signUp" onClick={() => signUp("test@test.com", "password", "password")}/>        
           </>
         );
       };
@@ -60,10 +60,11 @@ describe("UseContext", () => {
     });
 
     it("Handle server error", async () => {
-      auth.setSignUpResponse({ message: "SERVER-ERROR", error: "ERR" });
+      auth.setSignInResponse({ message: "SIGN-IN-ERROR" })
+      auth.setSignUpResponse({ message: "SIGN-UP-ERROR", error: "ERR" });
       fireEvent.click(screen.getByTestId("signUp"));
       await waitFor(() => expect(screen.getByTestId("fetching").innerHTML).toEqual("false"));
-      expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
+      expect(screen.getByTestId("error").innerHTML).toEqual("SIGN-UP-ERROR");
       auth.setSignUpResponse({});
     });
   });
diff --git a/src/components/Contexts/__mocks__/UserContext.jsx b/src/components/Contexts/__mocks__/UserContext.jsx
index 73e7b45..1505bb6 100644
--- a/src/components/Contexts/__mocks__/UserContext.jsx
+++ b/src/components/Contexts/__mocks__/UserContext.jsx
@@ -3,6 +3,8 @@ import React from 'react';
 let token = null;
 let fetching = false;
 let error = null;
+let signInResp = {};
+let signUpResp = {};
 
 export const UserProvider = ({ children }) => {
   return (
@@ -16,10 +18,13 @@ export const useUserContext = () => ({
   token,
   fetching,
   error,
-  setError: jest.fn(),
-  signIn: jest.fn(),
-  signUp: jest.fn(),
+  setError: jest.fn((value) => {
+    error = value;
+  }),
+  signIn: jest.fn(() => signInResp),
+  signUp: jest.fn(() => signUpResp),
   signOut: jest.fn(),
+  signUpAndIn: jest.fn(),
 });
 
 export const setToken = (val) => {
@@ -33,3 +38,7 @@ export const setFetching = (val) => {
 export const setError = (val) => {
   error = val;
 };
+
+export const setSignUpResp = (val) => {
+  signUpResp = val;
+};
diff --git a/src/components/SignUpForm/SignUpForm.test.jsx b/src/components/SignUpForm/SignUpForm.test.jsx
index 3e69fdc..859f2d7 100644
--- a/src/components/SignUpForm/SignUpForm.test.jsx
+++ b/src/components/SignUpForm/SignUpForm.test.jsx
@@ -1,14 +1,17 @@
 jest.mock("../Contexts/UserContext");
 
 import { BrowserRouter } from 'react-router-dom';
-import { render, cleanup } from "@testing-library/react"
+import { render, cleanup, screen, fireEvent, waitFor } from "@testing-library/react";
 import SignUpForm from './index';
 
-describe("Sign Up Form", () => {
+describe.only("Sign Up Form", () => {
+
+  afterEach(() => {
+    cleanup();
+  });
 
   it("Should render", () => {
     const { container } = render(<BrowserRouter><SignUpForm /></BrowserRouter>);
     expect(container).toMatchSnapshot();
-    cleanup();
-  })
+  });
 })
\ No newline at end of file
diff --git a/src/components/SignUpForm/index.jsx b/src/components/SignUpForm/index.jsx
index 1e27a75..145c097 100644
--- a/src/components/SignUpForm/index.jsx
+++ b/src/components/SignUpForm/index.jsx
@@ -5,7 +5,7 @@ import useStyles from '../Styles';
 import { useUserContext }  from '../Contexts/UserContext';
 
 export default function SignInForm() {
-    const { signUp, signIn, fetching, setError } = useUserContext();
+    const { signUpAndIn, fetching, setError } = useUserContext();
     const classes = useStyles();
     const emailEl = useRef(null);
     const passwordEl = useRef(null);
@@ -16,8 +16,7 @@ export default function SignInForm() {
         const email = emailEl.current.value;
         const password = passwordEl.current.value;
         const confirm = confirmEl.current.value;
-        await signUp(email, password, confirm);
-        await signIn(email, password);
+        await signUpAndIn(email, password, confirm);
       }
       catch (e) {
         setError(e.message);