test: payment stepper form molecule

components/atoms/Stepper/Forms/__snapshots__/payment2.test.js.snap

@@ -0,0 +1,56 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Payment2 component renders the component without crashing 1`] = `
+Object {
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "logTestingPlaygroundURL": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+}
+`;

components/atoms/Stepper/Forms/payment2.js

@@ -269,9 +269,9 @@ function Amount({
   );
   const [currencyPatientName, setCurrencyPatientName] = useState(
     patient.countryLabel ??
-      new Intl.DisplayNames(['en'], { type: 'region' }).of(
-        patient?.country?.toUpperCase(),
-      ),
+    new Intl.DisplayNames(['en'], { type: 'region' }).of(
+      patient?.country?.toUpperCase(),
+    ),
   );
 
   const [currencySender, setCurrencySender] = useState('EUR');
@@ -380,9 +380,8 @@ function Amount({
                       Pays:{' '}
                       <b className="text-gray-700 flex gap-1 items-center">
                         <Image
-                          src={`https://flagcdn.com/w20/${
-                            patient.country ?? 'cd'
-                          }.png`}
+                          src={`https://flagcdn.com/w20/${patient.country ?? 'cd'
+                            }.png`}
                           alt="cd"
                           width={20}
                           height={20}

components/atoms/Stepper/Forms/payment2.test.js

@@ -0,0 +1,41 @@
+import '@testing-library/jest-dom';
+import { render, screen, fireEvent } from '@testing-library/react';
+import Payment2 from './payment2';
+import { FormContext } from '../../../../pages/voucher/buy';
+import { Provider } from 'react-redux';
+import { store } from '../../../../redux/store';
+import { SessionProvider } from 'next-auth/react';
+require('jest-fetch-mock').enableMocks();
+
+
+describe('Payment2 component', () => {
+  it('renders the component without crashing', () => {
+
+    fetch.mockResponse('{}');
+
+    jest.spyOn(window.localStorage.__proto__, 'getItem').mockReturnValue(JSON.stringify({
+      firstName: 'John',
+      amount: 123,
+    }));
+
+    render(
+      <SessionProvider session={{
+        user: {
+          name: 'John',
+          data: {
+            userId: 1,
+          }
+        }
+      }}>
+        <Provider store={store}>
+          <FormContext.Provider value={{
+            activeStepIndex: 0, // identity step
+          }}>
+            <Payment2 />
+          </FormContext.Provider >
+        </Provider>
+      </SessionProvider>
+    );
+    expect(screen).toMatchSnapshot();
+  });
+});