feat: session provider work for unit testing also

IQSS · Nov 27, 2024 · 07bd1cd · 07bd1cd
1 parent f77475c
commit 07bd1cd
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 10 deletions.
diff --git a/src/sections/session/SessionProvider.tsx b/src/sections/session/SessionProvider.tsx
@@ -1,5 +1,5 @@
 import { Outlet, useNavigate } from 'react-router-dom'
-import { useCallback, useContext, useEffect, useState } from 'react'
+import { ReactNode, useCallback, useContext, useEffect, useState } from 'react'
 import { AuthContext } from 'react-oauth2-code-pkce'
 import { User } from '../../users/domain/models/User'
 import { SessionContext, SessionError } from './SessionContext'
@@ -13,11 +13,23 @@ import { ReadError } from '@iqss/dataverse-client-javascript'
 export const BEARER_TOKEN_IS_VALID_BUT_NOT_LINKED_MESSAGE =
   'Bearer token is validated, but there is no linked user account.'
 
-interface SessionProviderProps {
-  repository: UserRepository
-}
+type SessionProviderProps =
+  | {
+      repository: UserRepository
+      forComponentTesting?: false
+      testComponent?: never
+    }
+  | {
+      repository: UserRepository
+      forComponentTesting: true
+      testComponent: ReactNode
+    }
 
-export function SessionProvider({ repository }: SessionProviderProps) {
+export function SessionProvider({
+  repository,
+  forComponentTesting,
+  testComponent
+}: SessionProviderProps) {
   const navigate = useNavigate()
   const { token, loginInProgress } = useContext(AuthContext)
   const [user, setUser] = useState<User | null>(null)
@@ -90,7 +102,14 @@ export function SessionProvider({ repository }: SessionProviderProps) {
     if (token && !loginInProgress) {
       void fetchUser()
     }
-  }, [repository, token, loginInProgress, navigate, fetchUser])
+  }, [token, loginInProgress, fetchUser])
+
+  // This is only for component testing purposes
+  useEffect(() => {
+    if (forComponentTesting) {
+      void fetchUser()
+    }
+  }, [fetchUser, forComponentTesting])
 
   return (
     <SessionContext.Provider
@@ -102,7 +121,7 @@ export function SessionProvider({ repository }: SessionProviderProps) {
         logout: submitLogOut,
         refetchUserSession
       }}>
-      <Outlet />
+      {!forComponentTesting ? <Outlet /> : testComponent}
     </SessionContext.Provider>
   )
 }
diff --git a/tests/support/commands.tsx b/tests/support/commands.tsx
@@ -44,11 +44,11 @@ import { ReactNode } from 'react'
 import { I18nextProvider } from 'react-i18next'
 import i18next from '../../src/i18n'
 import { UserRepository } from '../../src/users/domain/repositories/UserRepository'
-import { SessionProvider } from '../../src/sections/session/SessionProvider'
 import { MemoryRouter } from 'react-router-dom'
 import { TestsUtils } from '@tests/e2e-integration/shared/TestsUtils'
 import { Utils } from '@/shared/helpers/Utils'
 import { OIDC_AUTH_CONFIG } from '@/config'
+import { SessionProvider } from '@/sections/session/SessionProvider'
 
 // Define your custom mount function
 
@@ -68,7 +68,9 @@ Cypress.Commands.add('mountAuthenticated', (component: ReactNode) => {
   userRepository.getAuthenticated = cy.stub().resolves(user)
   userRepository.removeAuthenticated = cy.stub().resolves()
 
-  return cy.customMount(<SessionProvider repository={userRepository}>{component}</SessionProvider>)
+  return cy.customMount(
+    <SessionProvider repository={userRepository} forComponentTesting testComponent={component} />
+  )
 })
 
 Cypress.Commands.add('mountSuperuser', (component: ReactNode) => {
@@ -77,7 +79,9 @@ Cypress.Commands.add('mountSuperuser', (component: ReactNode) => {
   userRepository.getAuthenticated = cy.stub().resolves(user)
   userRepository.removeAuthenticated = cy.stub().resolves()
 
-  return cy.customMount(<SessionProvider repository={userRepository}>{component}</SessionProvider>)
+  return cy.customMount(
+    <SessionProvider repository={userRepository} forComponentTesting testComponent={component} />
+  )
 })
 
 Cypress.Commands.add('login', () => {