From 59e3339d46eb38426b0518f162a1f9f987f23d97 Mon Sep 17 00:00:00 2001
From: jwu-fisker <jwu@fiskerinc.com>
Date: Wed, 6 Jan 2021 18:53:17 -0800
Subject: [PATCH] Add UserContext signin and signout tests

---
 src/components/contexts/UserContext.test.jsx | 156 ++++++++++++++++---
 1 file changed, 131 insertions(+), 25 deletions(-)

diff --git a/src/components/contexts/UserContext.test.jsx b/src/components/contexts/UserContext.test.jsx
index 7a2c41d..7479165 100644
--- a/src/components/contexts/UserContext.test.jsx
+++ b/src/components/contexts/UserContext.test.jsx
@@ -1,10 +1,12 @@
-import {render, cleanup, screen, fireEvent, waitFor} from '@testing-library/react'
-import { UserProvider, useUserContext }  from '../Contexts/UserContext';
+import {render, cleanup, screen, fireEvent, waitFor} from "@testing-library/react"
+import { UserProvider, useUserContext }  from "../Contexts/UserContext";
 import auth from "../../services/auth";
 
-jest.mock('../../services/auth');
+const TEST_TOKEN = { accessToken: { jwtToken: "TEST" }};
 
-describe('UseContext', () => {
+jest.mock("../../services/auth");
+
+describe("UseContext", () => {
   
   describe("Signup", () => {
     beforeEach(() => {
@@ -14,10 +16,10 @@ describe('UseContext', () => {
           <>
             <div data-testid="error">{error}</div>
             <div data-testid="fetching">{fetching.toString()}</div>
-            <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="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")}/>          
           </>
         );
       };
@@ -29,43 +31,147 @@ describe('UseContext', () => {
     });
 
     it("Initial state", () => {
-      expect(screen.getByTestId('error').innerHTML).toEqual("");
-      expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+      expect(screen.getByTestId("error").innerHTML).toEqual("");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
     });
 
     it("Error with no email address", () => {
-      fireEvent.click(screen.getByTestId('signUpNoEmail'));
-      expect(screen.getByTestId('error').innerHTML).toEqual("Email is required");
-      expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+      fireEvent.click(screen.getByTestId("signUpNoEmail"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("Email is required");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
     });
 
     it("Error with no password", () => {
-      fireEvent.click(screen.getByTestId('signUpNoPassword'));
-      expect(screen.getByTestId('error').innerHTML).toEqual("Password is required");
-      expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+      fireEvent.click(screen.getByTestId("signUpNoPassword"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("Password is required");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
     });
 
     it("Error with non-matching password", () => {
-      fireEvent.click(screen.getByTestId('signUpBadConfirm'));
-      expect(screen.getByTestId('error').innerHTML).toEqual("Passwords do not match");
-      expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+      fireEvent.click(screen.getByTestId("signUpBadConfirm"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("Passwords do not match");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
     });
 
     it("No error sign up", async () => {
-      fireEvent.click(screen.getByTestId('signUp'));
+      fireEvent.click(screen.getByTestId("signUp"));
       await waitFor(() => {
-        expect(screen.getByTestId('error').innerHTML).toEqual("");
-        expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+        expect(screen.getByTestId("error").innerHTML).toEqual("");
+        expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
       });
     });
 
     it("Handle server error", async () => {
       auth.setSignUpResponse({ message: "SERVER-ERROR", error: "ERR" });
-      fireEvent.click(screen.getByTestId('signUp'));
+      fireEvent.click(screen.getByTestId("signUp"));
       await waitFor(() => {
-        expect(screen.getByTestId('error').innerHTML).toEqual("SERVER-ERROR");
-        expect(screen.getByTestId('fetching').innerHTML).toEqual("false");
+        expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
+        expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
       });
+      auth.setSignUpResponse({});
     });
   });
+
+  describe("Signin", () => {
+
+    beforeEach(() => {
+      const TestComp = () => {
+        const { signIn, error, token, fetching } = useUserContext();
+        return (
+          <>
+            <div data-testid="error">{error}</div>
+            <div data-testid="fetching">{fetching.toString()}</div>
+            <div data-testid="token">{JSON.stringify(token)}</div>
+            <button data-testid="signInNoEmail" onClick={() => signIn("")}/>
+            <button data-testid="signInNoPassword" onClick={() => signIn("test@test.com", "")}/>
+            <button data-testid="signIn" onClick={() => signIn("test@test.com", "password", "password")}/>          
+          </>
+        );
+      };
+      render(<UserProvider><TestComp /></UserProvider>);  
+    });
+
+    afterEach(() => {
+      cleanup();
+    });
+
+    it("Initial state", () => {
+      expect(screen.getByTestId("error").innerHTML).toEqual("");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+      expect(screen.getByTestId("token").innerHTML).toEqual("null");
+    });
+
+    it("Error with no email address", () => {
+      fireEvent.click(screen.getByTestId("signInNoEmail"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("Email is required");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+      expect(screen.getByTestId("token").innerHTML).toEqual("null");
+    });
+
+    it("Error with no password", () => {
+      fireEvent.click(screen.getByTestId("signInNoPassword"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("Password is required");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+      expect(screen.getByTestId("token").innerHTML).toEqual("null");
+    });
+
+    it("No error sign in", async () => {
+      auth.setSignInResponse(TEST_TOKEN);
+      fireEvent.click(screen.getByTestId("signIn"));
+      await waitFor(() => {
+        const TOKEN_STRING = JSON.stringify(TEST_TOKEN);
+        expect(screen.getByTestId("error").innerHTML).toEqual("");
+        expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+        expect(screen.getByTestId("token").innerHTML).toEqual(TOKEN_STRING);
+        if (!sessionStorage) return;
+        expect(sessionStorage.getItem("token")).toEqual(TOKEN_STRING);
+        sessionStorage.removeItem("token");
+      });
+    });
+
+    it("Handle server error", async () => {
+      auth.setSignInResponse({ message: "SERVER-ERROR", error: "ERR" });
+      fireEvent.click(screen.getByTestId("signIn"));
+      await waitFor(() => {
+        expect(screen.getByTestId("error").innerHTML).toEqual("SERVER-ERROR");
+        expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+      });
+      auth.setSignUpResponse({});
+    });
+  });
+
+  describe("Signout", () => {
+    beforeEach(async () => {
+      const TestComp = () => {
+        const { signIn, signOut, error, token, fetching } = useUserContext();
+        return (
+          <>
+            <div data-testid="error">{error}</div>
+            <div data-testid="fetching">{fetching.toString()}</div>
+            <div data-testid="token">{JSON.stringify(token)}</div>
+            <button data-testid="signIn" onClick={() => signIn("test@test.com", "password", "password")}/>          
+            <button data-testid="signOut" onClick={() => signOut()}/>          
+          </>
+        );
+      };
+      render(<UserProvider><TestComp /></UserProvider>);  
+      auth.setSignInResponse(TEST_TOKEN);
+      fireEvent.click(screen.getByTestId("signIn"));
+      await waitFor(() => {});
+    });
+
+    afterEach(() => {
+      auth.setSignInResponse({});
+      cleanup();
+    });
+
+    it("Token cleared", () => {
+      fireEvent.click(screen.getByTestId("signOut"));
+      expect(screen.getByTestId("error").innerHTML).toEqual("");
+      expect(screen.getByTestId("fetching").innerHTML).toEqual("false");
+      expect(screen.getByTestId("token").innerHTML).toEqual("null");
+      if (!sessionStorage) return;
+      expect(sessionStorage.getItem('token')).toBeNull();
+    })
+  })
 });
\ No newline at end of file