Merge pull request #2725 from objectcomputing/bugfix-2724/do-not-reset-csrf-unnecessarily

Changed app context logic to get CSRF value and reuse it if available

Author: mkimberlin

web-ui/src/context/AppContext.jsx

@@ -34,6 +34,17 @@ import {getCertifications} from "../api/certification.js";
 
 const AppContext = React.createContext();
 
+function getSessionCookieValue(name) {
+  const cookies = document?.cookie?.split(';');
+  for (let i = 0; i < cookies.length; i++) {
+    const cookie = cookies[i].trim();
+    if (cookie.startsWith(name + '=')) {
+      return decodeURIComponent(cookie.substring(name.length + 1));
+    }
+  }
+  return null;
+}
+
 const AppContextProvider = props => {
   const [state, dispatch] = useReducer(
     reducer,
@@ -64,12 +75,17 @@ const AppContextProvider = props => {
   useEffect(() => {
     const getCsrf = async () => {
       if (!csrf) {
-        const res = await fetch(url, {
-          responseType: 'text',
-          credentials: 'include'
-        });
-        if (res && res.ok) {
-          dispatch({ type: SET_CSRF, payload: await res.text() });
+        const payload = getSessionCookieValue('_csrf');
+        if (payload) {
+          dispatch({ type: SET_CSRF, payload });
+        } else {
+          const res = await fetch(url, {
+            responseType: 'text',
+            credentials: 'include'
+          });
+          if (res && res.ok) {
+            dispatch({ type: SET_CSRF, payload: await res.text() });
+          }
         }
       }
     };

web-ui/src/pages/AnniversaryReportPage.test.jsx

@@ -14,26 +14,28 @@ const userStateWithPermission = {
 
 it('renders correctly', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider value={userStateWithPermission}>
       <AnniversaryReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });
 
 it('renders an error if user does not have appropriate permission', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider>
       <AnniversaryReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });

web-ui/src/pages/BirthdayReportPage.test.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { vi } from 'vitest';
 import BirthdayReportPage from './BirthdayReportPage';
 import { AppContextProvider } from '../context/AppContext';
 
@@ -14,26 +15,28 @@ const userStateWithPermission = {
 
 it('renders correctly', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider value={userStateWithPermission}>
       <BirthdayReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });
 
 it('renders an error if user does not have appropriate permission', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider>
       <BirthdayReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });