Merge branch 'fix/application-unit-test'

Author: Tung-Huynh-Shopmacher

application/src/components/method-details/availability/details-form.tsx

@@ -67,6 +67,7 @@ const AvailabilityDetailsForm = (props: TAvailabilityDetailsFormProps) => {
   const [selectedCurrency, setSelectedCurrency] = useState<TCurrencyCode>(
     projectCurrencies[0] as TCurrencyCode
   );
+
   const [countryOptions, setCountryOptions] = useState<
     { value: string; label: string }[]
   >(

application/src/components/method-details/availability/details.tsx

@@ -86,7 +86,7 @@ const AvailabilityDetails = (props: TAvailabilityDetailFormProps) => {
         maxAmount: maxAmount?.toString(),
         surchargeCost: {
           percentageAmount: surchargeCost?.percentageAmount ?? 0,
-          fixedAmount: surchargeCost?.fixedAmount.toString() ?? '0',
+          fixedAmount: surchargeCost?.fixedAmount?.toString() ?? '0',
         },
       };
 

application/src/components/method-details/availability/list.spec.tsx

@@ -1,39 +1,62 @@
 import {
-  screen,
   render,
+  screen,
 } from '@commercetools-frontend/application-shell/test-utils';
 import { Suspense } from 'react';
 import { MemoryRouter } from 'react-router';
 import { IntlProvider } from 'react-intl';
 import AvailabilityList from './list';
 import { TFetchCustomObjectDetailsQuery } from '../../../types/generated/ctp';
+import { useApplicationContext } from '@commercetools-frontend/application-shell-connectors';
+import { useMcMutation } from '@commercetools-frontend/application-shell';
+import { useShowNotification } from '@commercetools-frontend/actions-global';
+
+jest.mock('@commercetools-frontend/application-shell-connectors', () => ({
+  useApplicationContext: jest.fn(),
+}));
+jest.mock('@commercetools-frontend/application-shell', () => ({
+  useMcMutation: jest.fn(),
+}));
+jest.mock('@commercetools-frontend/actions-global', () => ({
+  useShowNotification: jest.fn(),
+}));
 
 describe('test MethodDetails.tsx', () => {
   it('test render', async () => {
     const pricingConstraints = [
       {
         id: 1,
-        currency: 'GBP1',
-        country: 'UK1',
+        currencyCode: 'GBP1',
+        countryCode: 'UK1',
         minAmount: 100,
         maxAmount: 2000,
-        surchargeCost: '2%',
+        surchargeCost: {
+          percentageAmount: 2,
+          renderedText: '2%',
+        },
       },
       {
         id: 2,
-        currency: 'GBP2',
-        country: 'DE2',
+        currencyCode: 'GBP2',
+        countryCode: 'DE2',
         minAmount: 1000,
         maxAmount: 30000,
-        surchargeCost: '4%',
+        surchargeCost: {
+          percentageAmount: 4,
+          renderedText: '4%',
+        },
       },
       {
         id: 3,
-        currency: 'EUR3',
-        country: 'DE3',
+        currencyCode: 'EUR3',
+        countryCode: 'DE3',
         minAmount: 500,
         maxAmount: 10000,
-        surchargeCost: '2 % + € 0,35',
+        surchargeCost: {
+          percentageAmount: 2,
+          fixedAmount: 100,
+          renderedText: '2% + 100EUR3',
+        },
       },
     ];
 
@@ -62,7 +85,23 @@ describe('test MethodDetails.tsx', () => {
       } as unknown as string,
     };
 
-    render(
+    (useApplicationContext as jest.Mock).mockReturnValue({
+      dataLocale: 'de',
+      projectLanguages: ['de'],
+      projectCurrencies: ['GBP1', 'GBP2', 'EUR3'],
+      projectCountries: ['UK1', 'DE2', 'DE3'],
+    });
+
+    (useMcMutation as jest.Mock).mockReturnValue([
+      jest.fn().mockResolvedValue({}),
+      {
+        loading: false,
+      },
+    ]);
+
+    (useShowNotification as jest.Mock).mockReturnValue(jest.fn());
+
+    const result = render(
       <MemoryRouter>
         <Suspense fallback={<div>Loading...</div>}>
           <IntlProvider
@@ -76,12 +115,12 @@ describe('test MethodDetails.tsx', () => {
     );
 
     pricingConstraints.forEach(
-      ({ currency, country, minAmount, maxAmount, surchargeCost }) => {
-        expect(screen.getByText(currency)).not.toBeNull();
-        expect(screen.getByText(country)).not.toBeNull();
+      ({ currencyCode, countryCode, minAmount, maxAmount, surchargeCost }) => {
+        expect(screen.getByText(currencyCode)).not.toBeNull();
+        expect(screen.getByText(countryCode)).not.toBeNull();
         expect(screen.getByText(minAmount)).not.toBeNull();
         expect(screen.getByText(maxAmount)).not.toBeNull();
-        expect(screen.getByText(surchargeCost)).not.toBeNull();
+        expect(screen.getByText(surchargeCost.renderedText)).not.toBeNull();
       }
     );
   });

application/src/components/method-details/method-details.spec.tsx

@@ -81,6 +81,8 @@ describe('Test method-details.tsx', () => {
     (useApplicationContext as jest.Mock).mockReturnValue({
       dataLocale: 'de',
       projectLanguages: ['de'],
+      projectCurrencies: ['DE'],
+      projectCountries: ['EUR'],
     });
 
     (useShowNotification as jest.Mock).mockReturnValue(jest.fn());