@websolutespa/bom-mixer-hooks 3.1.0 → 3.1.2

package/src/useCollectionApi/useCollectionApi.test.tsx

@@ -1,194 +1,194 @@
-import { render, renderHook, screen, waitFor, waitForElementToBeRemoved } from '@testing-library/react';
-import { ILayout } from '@websolutespa/bom-core';
-import { getLocalApiUrl } from '@websolutespa/bom-mixer-store';
-import { afterAll, beforeEach, describe, expect, test, vi } from 'vitest';
-import { useApiFetch } from '../useApi/useApi';
-import { LayoutProvider } from '../useLayout/useLayout';
-import { LayoutDefaults } from '../useLayout/useLayout.default';
-import { useCollectionApi, useCollectionApiDelete, useCollectionApiGet, useCollectionApiPatch, useCollectionApiPost, useCollectionApiPut } from './useCollectionApi';
-
-const wrapper = (props: { children: React.ReactNode }) => (
-  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
-);
-
-const defaultResponse = {
-  ok: true,
-  status: 200,
-  json: () => Promise.resolve(null),
-};
-
-function mockFetch(
-  method: string = 'GET',
-  result: any = { message: 'ok' },
-  overrideResponse: Partial<typeof defaultResponse> = {}
-) {
-  const endpoint = '/endpoint';
-  const url = `${getLocalApiUrl(endpoint)}?locale=en&market=ww`;
-  const payload = { data: 'data' };
-  const response = {
-    ...defaultResponse,
-    ...overrideResponse,
-    json: () => Promise.resolve(result),
-  } as Response;
-  global.fetch = vi.fn(() =>
-    Promise.resolve(response)
-  );
-  const request: {
-    body?: string;
-    headers: { [key: string]: string },
-    method: string;
-  } = {
-    headers: {
-      'Content-Type': 'application/json',
-    },
-    method,
-  };
-  if (['POST', 'PATCH', 'PUT'].includes(method)) {
-    request.body = JSON.stringify(payload);
-  }
-  return { endpoint, url, payload, result, request, response };
-}
-
-describe('useCollectionApi', () => {
-  const ENV = process.env;
-  const FETCH = global.fetch;
-
-  beforeEach(() => {
-    vi.resetModules();
-    vi.resetAllMocks();
-    vi.spyOn(console, 'error').mockImplementation(() => { });
-    vi.spyOn(console, 'log').mockImplementation(() => { });
-    process.env = {
-      MIXER_SECRET: 'MIXER_SECRET_32_CHARS_LONG_12345',
-      NEXT_PUBLIC_API: '/api',
-      NEXT_PUBLIC_MOCK_FALLBACK_URL: 'http://localhost:3000',
-      NEXT_PUBLIC_URL: 'http://localhost:3000',
-      NODE_ENV: 'test',
-      STORE_API_KEY: 'STORE_API_KEY',
-      STORE_API: '/bowl/api',
-      STORE_STRATEGY: 'mock',
-      STORE_URL: 'http://localhost:4000',
-    };
-  });
-
-  afterAll(() => {
-    process.env = ENV;
-    global.fetch = FETCH;
-  });
-
-  test('should throw without provider', () => {
-    expect(() => {
-      renderHook(() => useCollectionApi());
-    }).toThrow('useGenericContext must be used within a Provider');
-  });
-
-  test('should not throw with provider', () => {
-    expect(() => {
-      renderHook(() => useCollectionApi(), { wrapper });
-    }).not.toThrow();
-  });
-
-  test('api.get should return ok', async () => {
-    const { result } = renderHook(() => useCollectionApi(), { wrapper });
-    const mock = mockFetch();
-    const response = await result.current.get(mock.endpoint);
-    expect(fetch).toHaveBeenCalledTimes(1);
-    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-    expect(response).toBe(mock.result);
-  });
-
-  test('api.post should return ok', async () => {
-    const { result } = renderHook(() => useCollectionApi(), { wrapper });
-    const mock = mockFetch('POST');
-    const response = await result.current.post(mock.endpoint, mock.payload);
-    expect(fetch).toHaveBeenCalledTimes(1);
-    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-    expect(response).toBe(mock.result);
-  });
-
-  test('api.patch should return ok', async () => {
-    const { result } = renderHook(() => useCollectionApi(), { wrapper });
-    const mock = mockFetch('PATCH');
-    const response = await result.current.patch(mock.endpoint, mock.payload);
-    expect(fetch).toHaveBeenCalledTimes(1);
-    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-    expect(response).toBe(mock.result);
-  });
-
-  test('api.put should return ok', async () => {
-    const { result } = renderHook(() => useCollectionApi(), { wrapper });
-    const mock = mockFetch('PUT');
-    const response = await result.current.put(mock.endpoint, mock.payload);
-    expect(fetch).toHaveBeenCalledTimes(1);
-    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-    expect(response).toBe(mock.result);
-  });
-
-  test('api.delete should return ok', async () => {
-    const { result } = renderHook(() => useCollectionApi(), { wrapper });
-    const mock = mockFetch('DELETE');
-    const response = await result.current.delete(mock.endpoint);
-    expect(fetch).toHaveBeenCalledTimes(1);
-    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-    expect(response).toBe(mock.result);
-  });
-
-  test('useCollectionApiGet expect result ok', TestMethod('GET'));
-
-  test('useCollectionApiPost expect result ok', TestMethod('POST'));
-
-  test('useCollectionApiPatch expect result ok', TestMethod('PATCH'));
-
-  test('useCollectionApiPut expect result ok', TestMethod('PUT'));
-
-  test('useCollectionApiDelete expect result ok', TestMethod('DELETE'));
-
-  function TestMethod(method?: string) {
-    const useHook = (mock: ReturnType<typeof mockFetch>) => {
-      switch (method) {
-        case 'GET':
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useCollectionApiGet(mock.endpoint);
-        case 'POST':
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useCollectionApiPost(mock.endpoint, mock.payload);
-        case 'PATCH':
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useCollectionApiPatch(mock.endpoint, mock.payload);
-        case 'PUT':
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useCollectionApiPut(mock.endpoint, mock.payload);
-        case 'DELETE':
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useCollectionApiDelete(mock.endpoint);
-        default:
-          // eslint-disable-next-line react-hooks/rules-of-hooks
-          return useApiFetch(mock.endpoint);
-      }
-    };
-    return async () => {
-      const mock = mockFetch(method);
-      const Wrapper = () => {
-        const [response, loading, error, setError] = useHook(mock);
-        return (
-          <>
-            {loading && <div data-testid="loading">loading</div>}
-            {response && <div data-testid="result">{JSON.stringify(response)}</div>}
-            {error && <div data-testid="error">{JSON.stringify(error)}</div>}
-          </>
-        );
-      };
-      render(
-        <LayoutProvider layout={LayoutDefaults as ILayout}><Wrapper /></LayoutProvider>
-      );
-      expect(screen.getByTestId('loading')).toHaveTextContent('loading');
-      await waitForElementToBeRemoved(() => screen.getByTestId('loading'));
-      expect(fetch).toHaveBeenCalledTimes(1);
-      expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
-      const result = await waitFor(() => screen.getByTestId('result'));
-      expect(result).toHaveTextContent(JSON.stringify(mock.result));
-    };
-  }
-
-});
-
+import { render, renderHook, screen, waitFor, waitForElementToBeRemoved } from '@testing-library/react';
+import { ILayout } from '@websolutespa/bom-core';
+import { getLocalApiUrl } from '@websolutespa/bom-mixer-store';
+import { afterAll, beforeEach, describe, expect, test, vi } from 'vitest';
+import { useApiFetch } from '../useApi/useApi';
+import { LayoutProvider } from '../useLayout/useLayout';
+import { LayoutDefaults } from '../useLayout/useLayout.default';
+import { useCollectionApi, useCollectionApiDelete, useCollectionApiGet, useCollectionApiPatch, useCollectionApiPost, useCollectionApiPut } from './useCollectionApi';
+
+const wrapper = (props: { children: React.ReactNode }) => (
+  <LayoutProvider layout={LayoutDefaults as ILayout}>{props.children}</LayoutProvider>
+);
+
+const defaultResponse = {
+  ok: true,
+  status: 200,
+  json: () => Promise.resolve(null),
+};
+
+function mockFetch(
+  method: string = 'GET',
+  result: any = { message: 'ok' },
+  overrideResponse: Partial<typeof defaultResponse> = {}
+) {
+  const endpoint = '/endpoint';
+  const url = `${getLocalApiUrl(endpoint)}?locale=en&market=ww`;
+  const payload = { data: 'data' };
+  const response = {
+    ...defaultResponse,
+    ...overrideResponse,
+    json: () => Promise.resolve(result),
+  } as Response;
+  global.fetch = vi.fn(() =>
+    Promise.resolve(response)
+  );
+  const request: {
+    body?: string;
+    headers: { [key: string]: string },
+    method: string;
+  } = {
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    method,
+  };
+  if (['POST', 'PATCH', 'PUT'].includes(method)) {
+    request.body = JSON.stringify(payload);
+  }
+  return { endpoint, url, payload, result, request, response };
+}
+
+describe('useCollectionApi', () => {
+  const ENV = process.env;
+  const FETCH = global.fetch;
+
+  beforeEach(() => {
+    vi.resetModules();
+    vi.resetAllMocks();
+    vi.spyOn(console, 'error').mockImplementation(() => { });
+    vi.spyOn(console, 'log').mockImplementation(() => { });
+    process.env = {
+      MIXER_SECRET: 'MIXER_SECRET_32_CHARS_LONG_12345',
+      NEXT_PUBLIC_API: '/api',
+      NEXT_PUBLIC_MOCK_FALLBACK_URL: 'http://localhost:3000',
+      NEXT_PUBLIC_URL: 'http://localhost:3000',
+      NODE_ENV: 'test',
+      STORE_API_KEY: 'STORE_API_KEY',
+      STORE_API: '/bowl/api',
+      STORE_STRATEGY: 'mock',
+      STORE_URL: 'http://localhost:4000',
+    };
+  });
+
+  afterAll(() => {
+    process.env = ENV;
+    global.fetch = FETCH;
+  });
+
+  test('should throw without provider', () => {
+    expect(() => {
+      renderHook(() => useCollectionApi());
+    }).toThrow('useGenericContext must be used within a Provider');
+  });
+
+  test('should not throw with provider', () => {
+    expect(() => {
+      renderHook(() => useCollectionApi(), { wrapper });
+    }).not.toThrow();
+  });
+
+  test('api.get should return ok', async () => {
+    const { result } = renderHook(() => useCollectionApi(), { wrapper });
+    const mock = mockFetch();
+    const response = await result.current.get(mock.endpoint);
+    expect(fetch).toHaveBeenCalledTimes(1);
+    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+    expect(response).toBe(mock.result);
+  });
+
+  test('api.post should return ok', async () => {
+    const { result } = renderHook(() => useCollectionApi(), { wrapper });
+    const mock = mockFetch('POST');
+    const response = await result.current.post(mock.endpoint, mock.payload);
+    expect(fetch).toHaveBeenCalledTimes(1);
+    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+    expect(response).toBe(mock.result);
+  });
+
+  test('api.patch should return ok', async () => {
+    const { result } = renderHook(() => useCollectionApi(), { wrapper });
+    const mock = mockFetch('PATCH');
+    const response = await result.current.patch(mock.endpoint, mock.payload);
+    expect(fetch).toHaveBeenCalledTimes(1);
+    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+    expect(response).toBe(mock.result);
+  });
+
+  test('api.put should return ok', async () => {
+    const { result } = renderHook(() => useCollectionApi(), { wrapper });
+    const mock = mockFetch('PUT');
+    const response = await result.current.put(mock.endpoint, mock.payload);
+    expect(fetch).toHaveBeenCalledTimes(1);
+    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+    expect(response).toBe(mock.result);
+  });
+
+  test('api.delete should return ok', async () => {
+    const { result } = renderHook(() => useCollectionApi(), { wrapper });
+    const mock = mockFetch('DELETE');
+    const response = await result.current.delete(mock.endpoint);
+    expect(fetch).toHaveBeenCalledTimes(1);
+    expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+    expect(response).toBe(mock.result);
+  });
+
+  test('useCollectionApiGet expect result ok', TestMethod('GET'));
+
+  test('useCollectionApiPost expect result ok', TestMethod('POST'));
+
+  test('useCollectionApiPatch expect result ok', TestMethod('PATCH'));
+
+  test('useCollectionApiPut expect result ok', TestMethod('PUT'));
+
+  test('useCollectionApiDelete expect result ok', TestMethod('DELETE'));
+
+  function TestMethod(method?: string) {
+    const useHook = (mock: ReturnType<typeof mockFetch>) => {
+      switch (method) {
+        case 'GET':
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useCollectionApiGet(mock.endpoint);
+        case 'POST':
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useCollectionApiPost(mock.endpoint, mock.payload);
+        case 'PATCH':
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useCollectionApiPatch(mock.endpoint, mock.payload);
+        case 'PUT':
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useCollectionApiPut(mock.endpoint, mock.payload);
+        case 'DELETE':
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useCollectionApiDelete(mock.endpoint);
+        default:
+          // eslint-disable-next-line react-hooks/rules-of-hooks
+          return useApiFetch(mock.endpoint);
+      }
+    };
+    return async () => {
+      const mock = mockFetch(method);
+      const Wrapper = () => {
+        const [response, loading, error, setError] = useHook(mock);
+        return (
+          <>
+            {loading && <div data-testid="loading">loading</div>}
+            {response && <div data-testid="result">{JSON.stringify(response)}</div>}
+            {error && <div data-testid="error">{JSON.stringify(error)}</div>}
+          </>
+        );
+      };
+      render(
+        <LayoutProvider layout={LayoutDefaults as ILayout}><Wrapper /></LayoutProvider>
+      );
+      expect(screen.getByTestId('loading')).toHaveTextContent('loading');
+      await waitForElementToBeRemoved(() => screen.getByTestId('loading'));
+      expect(fetch).toHaveBeenCalledTimes(1);
+      expect(fetch).toHaveBeenCalledWith(mock.url, mock.request);
+      const result = await waitFor(() => screen.getByTestId('result'));
+      expect(result).toHaveTextContent(JSON.stringify(mock.result));
+    };
+  }
+
+});
+