add tests

packages/core/admin/admin/src/hooks/useNavigatorOnLine/tests/index.test.js

@@ -0,0 +1,48 @@
+import { renderHook, act } from '@testing-library/react-hooks';
+import useNavigatorOnLine from '../index';
+
+describe('useNavigatorOnLine', () => {
+  it('returns the online state', () => {
+    jest.spyOn(window.navigator, 'onLine', 'get').mockReturnValue(true);
+    const { result } = renderHook(() => useNavigatorOnLine());
+
+    expect(result.current).toEqual(true);
+  });
+
+  it('returns the offline state', () => {
+    jest.spyOn(window.navigator, 'onLine', 'get').mockReturnValue(false);
+    const { result } = renderHook(() => useNavigatorOnLine());
+
+    expect(result.current).toEqual(false);
+  });
+
+  it('listens for network change online', async () => {
+    // Initialize an offline state
+    jest.spyOn(window.navigator, 'onLine', 'get').mockReturnValue(false);
+    const { result, waitForNextUpdate } = renderHook(() => useNavigatorOnLine());
+
+    await act(async () => {
+      // Simulate a change from offline to online
+      window.dispatchEvent(new window.Event('online'));
+
+      await waitForNextUpdate();
+    });
+
+    expect(result.current).toEqual(true);
+  });
+
+  it('listens for network change offline', async () => {
+    // Initialize an online state
+    jest.spyOn(window.navigator, 'onLine', 'get').mockReturnValue(true);
+    const { result, waitForNextUpdate } = renderHook(() => useNavigatorOnLine());
+
+    await act(async () => {
+      // Simulate a change from online to offline
+      window.dispatchEvent(new window.Event('offline'));
+
+      await waitForNextUpdate();
+    });
+
+    expect(result.current).toEqual(false);
+  });
+});

packages/core/admin/admin/src/pages/MarketplacePage/index.js

@@ -29,7 +29,7 @@ import useFetchInstalledPlugins from '../../hooks/useFetchInstalledPlugins';
 import useFetchMarketplacePlugins from '../../hooks/useFetchMarketplacePlugins';
 import adminPermissions from '../../permissions';
 import offlineCloud from '../../assets/images/icon_offline-cloud.svg';
-import useNavigatorOnLine from '../../hooks/use-navigator-on-line';
+import useNavigatorOnLine from '../../hooks/useNavigatorOnLine';
 
 const matchSearch = (plugins, search) => {
   return matchSorter(plugins, search, {

packages/core/admin/admin/src/pages/MarketplacePage/tests/index.test.js

@@ -11,11 +11,14 @@ import { IntlProvider } from 'react-intl';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { ThemeProvider, lightTheme } from '@strapi/design-system';
 import { useTracking, useAppInfos } from '@strapi/helper-plugin';
+import useNavigatorOnLine from '../../../hooks/useNavigatorOnLine';
 import MarketPlacePage from '../index';
 import server from './server';
 
 const toggleNotification = jest.fn();
 
+jest.mock('../../../hooks/use-navigator-on-line', () => jest.fn(() => true));
+
 jest.mock('@strapi/helper-plugin', () => ({
   ...jest.requireActual('@strapi/helper-plugin'),
   useNotification: jest.fn(() => {
@@ -1533,7 +1536,7 @@ describe('Marketplace page', () => {
     expect(noResult).toBeVisible();
   });
 
-  it('handles production environment', async () => {
+  it('handles production environment', () => {
     // Simulate production environment
     useAppInfos.mockImplementation(() => ({ autoReload: false }));
     const { queryByText } = render(App);
@@ -1547,9 +1550,25 @@ describe('Marketplace page', () => {
       },
       blockTransition: true,
     });
+
     expect(toggleNotification).toHaveBeenCalledTimes(1);
 
     // Should not show install buttons
     expect(queryByText(/copy install command/i)).not.toBeInTheDocument();
   });
+
+  it('shows an online layout', () => {
+    render(App);
+    const offlineText = screen.queryByText('You are offline');
+
+    expect(offlineText).toEqual(null);
+  });
+
+  it('shows the offline layout', () => {
+    useNavigatorOnLine.mockReturnValueOnce(false);
+    render(App);
+    const offlineText = screen.getByText('You are offline');
+
+    expect(offlineText).toBeVisible();
+  });
 });