@dhis2/app-service-offline 3.11.3 → 3.12.0-alpha.1

package/build/es/lib/__tests__/network-status.test.js

@@ -1,14 +1,11 @@
-import { render, screen, waitFor } from '@testing-library/react';
-import { act, renderHook } from '@testing-library/react-hooks';
+import { render, screen, waitFor, act, renderHook } from '@testing-library/react';
 import React from 'react';
 import { useNetworkStatus as useOnlineStatus } from '../network-status';
-
 function wait(ms) {
   return new Promise(resolve => {
     setTimeout(() => resolve(), ms);
   });
 }
-
 beforeEach(() => {
   jest.restoreAllMocks();
 });
@@ -35,13 +32,12 @@ describe('initalizes to navigator.onLine value', () => {
 });
 describe('state changes in response to browser "online" and "offline" events', () => {
   it('switches from online to offline when the "offline" event triggers', async () => {
-    jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true); // Capture callback to trigger later using addEventListener mock
-
+    jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
+    // Capture callback to trigger later using addEventListener mock
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
@@ -52,21 +48,20 @@ describe('state changes in response to browser "online" and "offline" events', (
     act(() => {
       // Trigger callback captured by addEventListener mock
       events.offline(new Event('offline'));
-    }); // Wait for debounce
+    });
 
-    await waitForNextUpdate({
-      timeout: 60
+    // Wait for debounce
+    await waitFor(() => {
+      expect(result.current.online).toBe(false);
+      expect(result.current.offline).toBe(true);
     });
-    expect(result.current.online).toBe(false);
-    expect(result.current.offline).toBe(true);
   });
   it('switches from offline to online when the "online" event triggers', async () => {
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(false);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
@@ -76,13 +71,13 @@ describe('state changes in response to browser "online" and "offline" events', (
     });
     act(() => {
       events.online(new Event('online'));
-    }); // Wait for debounce
+    });
 
-    await waitForNextUpdate({
-      timeout: 60
+    // Wait for debounce
+    await waitFor(() => {
+      expect(result.current.online).toBe(true);
+      expect(result.current.offline).toBe(false);
     });
-    expect(result.current.online).toBe(true);
-    expect(result.current.offline).toBe(false);
   });
 });
 describe('debouncing state changes', () => {
@@ -92,22 +87,22 @@ describe('debouncing state changes', () => {
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(() => useOnlineStatus());
     await act(async () => {
       // Multiple events in succession
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // Immediately, nothing should happen
-
-    expect(result.current.online).toBe(true); // 1s later, final 'offline' event should resolve
+    });
 
-    await waitForNextUpdate({
-      timeout: 1009
+    // Immediately, nothing should happen
+    expect(result.current.online).toBe(true);
+    await wait(1000);
+    // 1s later, final 'offline' event should resolve
+    await waitFor(() => {
+      expect(result.current.online).toBe(false);
     });
-    expect(result.current.online).toBe(false);
   });
   it('can have debounce delay set to another number', async () => {
     // Start online
@@ -115,8 +110,7 @@ describe('debouncing state changes', () => {
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
@@ -129,22 +123,22 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // Immediately, nothing should happen
+    });
 
-    expect(result.current.online).toBe(true); // 50ms later, final "offline" event should finally resolve
+    // Immediately, nothing should happen
+    expect(result.current.online).toBe(true);
 
-    await waitForNextUpdate({
-      timeout: 60
+    // 50ms later, final "offline" event should finally resolve
+    await waitFor(() => {
+      expect(result.current.online).toBe(false);
     });
-    expect(result.current.online).toBe(false);
   });
   it('can use a debounceDelay of 0 to skip debouncing', async () => {
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
@@ -156,14 +150,14 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // await wait(0) didn't work here
-
-    await waitForNextUpdate({
-      timeout: 0
-    }); // There should be no delay before status is offline
+    });
 
-    expect(result.current.online).toBe(false);
-    expect(result.current.offline).toBe(true);
+    // await wait(0) didn't work here
+    await waitFor(() => {
+      // There should be no delay before status is offline
+      expect(result.current.online).toBe(false);
+      expect(result.current.offline).toBe(true);
+    });
   });
   it('can have the debounce delay changed during its lifecycle', async () => {
     // Start with 150 ms debounce
@@ -172,7 +166,6 @@ describe('debouncing state changes', () => {
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
       result,
-      waitForNextUpdate,
       rerender
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
@@ -186,15 +179,16 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // Immediately, nothing should happen
+    });
 
-    expect(result.current.online).toBe(true); // 150ms later, final "offline" event should finally resolve
+    // Immediately, nothing should happen
+    expect(result.current.online).toBe(true);
 
-    await waitForNextUpdate({
-      timeout: 160
-    });
-    expect(result.current.online).toBe(false); // Change to 50 ms debounce
+    // 150ms later, final "offline" event should finally resolve
+    await wait(160);
+    expect(result.current.online).toBe(false);
 
+    // Change to 50 ms debounce
     rerender({
       debounceDelay: 50
     });
@@ -203,20 +197,19 @@ describe('debouncing state changes', () => {
       events.online(new Event('online'));
       events.offline(new Event('offline'));
       events.online(new Event('online'));
-    }); // Immediately, nothing should happen
+    });
 
-    expect(result.current.online).toBe(false); // 50ms later, final "online" event should finally resolve
+    // Immediately, nothing should happen
+    expect(result.current.online).toBe(false);
 
-    await waitForNextUpdate({
-      timeout: 60
-    });
+    // 50ms later, final "online" event should finally resolve
+    await wait(60);
     expect(result.current.online).toBe(true);
   });
   it('handles debounced state change when parent component rerenders during a debounce delay', async () => {
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
-
     const TestComponent = () => {
       const {
         online
@@ -227,10 +220,9 @@ describe('debouncing state changes', () => {
         "data-testid": "status"
       }, online ? 'on' : 'off');
     };
-
     const {
       rerender
-    } = render( /*#__PURE__*/React.createElement(TestComponent, null));
+    } = render(/*#__PURE__*/React.createElement(TestComponent, null));
     const {
       getByTestId
     } = screen;
@@ -240,20 +232,22 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // Immediately, nothing should happen
+    });
 
-    expect(getByTestId('status')).toHaveTextContent('on'); // Rerender parent component
+    // Immediately, nothing should happen
+    expect(getByTestId('status')).toHaveTextContent('on');
 
-    rerender( /*#__PURE__*/React.createElement(TestComponent, null)); // Final "offline" event should still resolve
+    // Rerender parent component
+    rerender(/*#__PURE__*/React.createElement(TestComponent, null));
 
+    // Final "offline" event should still resolve
     await waitFor(() => expect(getByTestId('status')).toHaveTextContent('off'));
   });
   it('handles debounced state change when debounce delay is changed during a delay', async () => {
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
-
-    const TestComponent = (_ref) => {
+    const TestComponent = _ref => {
       let {
         options
       } = _ref;
@@ -264,10 +258,9 @@ describe('debouncing state changes', () => {
         "data-testid": "status"
       }, online ? 'on' : 'off');
     };
-
     const {
       rerender
-    } = render( /*#__PURE__*/React.createElement(TestComponent, {
+    } = render(/*#__PURE__*/React.createElement(TestComponent, {
       options: {
         debounceDelay: 100
       }
@@ -281,23 +274,25 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // Immediately, nothing should happen
+    });
 
-    expect(getByTestId('status')).toHaveTextContent('on'); // Change debounce options
+    // Immediately, nothing should happen
+    expect(getByTestId('status')).toHaveTextContent('on');
 
-    rerender( /*#__PURE__*/React.createElement(TestComponent, {
+    // Change debounce options
+    rerender(/*#__PURE__*/React.createElement(TestComponent, {
       options: {
         debounceDelay: 50
       }
-    })); // Final "offline" event should still resolve
+    }));
 
+    // Final "offline" event should still resolve
     await waitFor(() => expect(getByTestId('status')).toHaveTextContent('off'));
   });
   it('debounces consistently across rerenders', async () => {
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
-
     const TestComponent = () => {
       const {
         online
@@ -308,10 +303,9 @@ describe('debouncing state changes', () => {
         "data-testid": "status"
       }, online ? 'on' : 'off');
     };
-
     const {
       rerender
-    } = render( /*#__PURE__*/React.createElement(TestComponent, null));
+    } = render(/*#__PURE__*/React.createElement(TestComponent, null));
     const {
       getByTestId
     } = screen;
@@ -321,22 +315,27 @@ describe('debouncing state changes', () => {
       events.offline(new Event('offline'));
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // wait a little bit - not long enough for debounce to resolve
+    });
 
+    // wait a little bit - not long enough for debounce to resolve
     await wait(50);
-    expect(getByTestId('status')).toHaveTextContent('on'); // Rerender parent component
+    expect(getByTestId('status')).toHaveTextContent('on');
 
-    rerender( /*#__PURE__*/React.createElement(TestComponent, null)); // Trigger more events
+    // Rerender parent component
+    rerender(/*#__PURE__*/React.createElement(TestComponent, null));
 
+    // Trigger more events
     await act(async () => {
       events.online(new Event('online'));
       events.offline(new Event('offline'));
-    }); // wait a little more - long enough that the first debounced callbacks
-    // _would_ have resolved if there weren't the second set of events
+    });
 
+    // wait a little more - long enough that the first debounced callbacks
+    // _would_ have resolved if there weren't the second set of events
     await wait(60);
-    expect(getByTestId('status')).toHaveTextContent('on'); // wait long enough for second set of callbacks to resolve
+    expect(getByTestId('status')).toHaveTextContent('on');
 
+    // wait long enough for second set of callbacks to resolve
     await waitFor(() => expect(getByTestId('status')).toHaveTextContent('off'));
   });
 });
@@ -345,43 +344,42 @@ describe('it updates the lastOnline value in local storage', () => {
   const testDateString = 'Fri, 27 Aug 2021 19:53:06 GMT';
   it('sets lastOnline in local storage when it goes offline', async () => {
     var _result$current$lastO;
-
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
       initialProps: {
         debounceDelay: 0
       }
-    }); // Correct initial state
+    });
 
+    // Correct initial state
     expect(localStorage.getItem(lastOnlineKey)).toBe(null);
     expect(result.current.lastOnline).toBe(null);
     act(() => {
       events.offline(new Event('offline'));
-    }); // Wait for debounce
-
-    await waitForNextUpdate({
-      timeout: 0
     });
+
+    // Wait for debounce
+    await wait(500);
     expect(result.current.online).toBe(false);
-    expect(result.current.offline).toBe(true); // Check localStorage for a stored date
+    expect(result.current.offline).toBe(true);
 
+    // Check localStorage for a stored date
     const parsedDate = new Date(localStorage.getItem(lastOnlineKey));
-    expect(parsedDate.toString()).not.toBe('Invalid Date'); // Check hook return value
-
+    expect(parsedDate.toString()).not.toBe('Invalid Date');
+    // Check hook return value
     expect(result.current.lastOnline).toBeInstanceOf(Date);
     expect((_result$current$lastO = result.current.lastOnline) === null || _result$current$lastO === void 0 ? void 0 : _result$current$lastO.toUTCString()).toBe(localStorage.getItem(lastOnlineKey));
-  }); // not necessary
+  });
 
+  // not necessary
   it.skip("sets lastOnline on mount if it's not set", () => {
     var _result$current$lastO2;
-
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(false);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
@@ -432,8 +430,7 @@ describe('it updates the lastOnline value in local storage', () => {
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
@@ -445,58 +442,52 @@ describe('it updates the lastOnline value in local storage', () => {
     expect(result.current.lastOnline).toEqual(new Date(testDateString));
     act(() => {
       events.offline(new Event('online'));
-    }); // Wait for debounce
-
-    await waitForNextUpdate({
-      timeout: 0
     });
+
+    // Wait for debounce
+    await wait(500);
     expect(result.current.online).toBe(true);
-    expect(result.current.offline).toBe(false); // expect(localStorage.getItem(lastOnlineKey)).toBe(null)
+    expect(result.current.offline).toBe(false);
 
+    // expect(localStorage.getItem(lastOnlineKey)).toBe(null)
     expect(result.current.lastOnline).toBe(null);
   });
   it('tracks correctly when going offline and online', async () => {
     var _result$current$lastO3, _result$current$lastO4;
-
     jest.spyOn(navigator, 'onLine', 'get').mockReturnValueOnce(true);
     const events = {};
     window.addEventListener = jest.fn((event, cb) => events[event] = cb);
     const {
-      result,
-      waitForNextUpdate
+      result
     } = renderHook(function () {
       return useOnlineStatus(...arguments);
     }, {
       initialProps: {
         debounceDelay: 0
       }
-    }); // Correct initial state
+    });
 
+    // Correct initial state
     expect(localStorage.getItem(lastOnlineKey)).toBe(null);
     expect(result.current.lastOnline).toBe(null);
     act(() => {
       events.offline(new Event('offline'));
     });
-    await waitForNextUpdate({
-      timeout: 0
-    });
+    await waitFor(() => undefined);
     const firstDate = new Date(localStorage.getItem(lastOnlineKey));
     const firstValue = (_result$current$lastO3 = result.current.lastOnline) === null || _result$current$lastO3 === void 0 ? void 0 : _result$current$lastO3.valueOf();
     act(() => {
       events.offline(new Event('online'));
     });
-    await waitForNextUpdate({
-      timeout: 0
-    });
-    expect(result.current.lastOnline).toBe(null); // todo: this is an error from UTC strings' imprecision
+    await wait(500);
+    expect(result.current.lastOnline).toBe(null);
 
-    await wait(1000);
+    // todo: this is an error from UTC strings' imprecision
+    await wait(500);
     act(() => {
       events.offline(new Event('offline'));
     });
-    await waitForNextUpdate({
-      timeout: 0
-    });
+    await wait(500);
     expect(new Date(localStorage.getItem(lastOnlineKey))).not.toEqual(firstDate);
     expect((_result$current$lastO4 = result.current.lastOnline) === null || _result$current$lastO4 === void 0 ? void 0 : _result$current$lastO4.valueOf()).not.toEqual(firstValue);
   });

package/build/es/lib/__tests__/offline-provider.test.js

@@ -3,32 +3,31 @@ import React from 'react';
 import { mockOfflineInterface } from '../../utils/test-mocks';
 import { useCacheableSection, CacheableSection } from '../cacheable-section';
 import { useCachedSections } from '../cacheable-section-state';
-import { OfflineProvider } from '../offline-provider'; // Suppress 'act' warning for these tests
+import { OfflineProvider } from '../offline-provider';
 
+// Suppress 'act' warning for these tests
 const originalError = console.error;
 beforeEach(() => {
   jest.spyOn(console, 'error').mockImplementation(function () {
     const pattern = /Warning: An update to .* inside a test was not wrapped in act/;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     if (typeof args[0] === 'string' && pattern.test(args[0])) {
       return;
     }
-
     return originalError.call(console, ...args);
   });
 });
 afterEach(() => {
-  jest.clearAllMocks() // syntax needed to appease typescript
+  jest.clearAllMocks()
+  // syntax needed to appease typescript
   ;
   console.error.mockRestore();
 });
 describe('Testing offline provider', () => {
   it('Should render without failing', () => {
-    render( /*#__PURE__*/React.createElement(OfflineProvider, {
+    render(/*#__PURE__*/React.createElement(OfflineProvider, {
       offlineInterface: mockOfflineInterface
     }, /*#__PURE__*/React.createElement("div", {
       "data-testid": "test-div"
@@ -36,7 +35,8 @@ describe('Testing offline provider', () => {
     expect(screen.getByTestId('test-div')).toBeInTheDocument();
   });
   it('Should sync cached sections with indexedDB', async () => {
-    const testOfflineInterface = { ...mockOfflineInterface,
+    const testOfflineInterface = {
+      ...mockOfflineInterface,
       getCachedSections: jest.fn().mockResolvedValue([{
         sectionId: '1',
         lastUpdated: 'date1'
@@ -45,7 +45,6 @@ describe('Testing offline provider', () => {
         lastUpdated: 'date2'
       }])
     };
-
     const CachedSections = () => {
       const {
         cachedSections
@@ -54,8 +53,7 @@ describe('Testing offline provider', () => {
         "data-testid": "sections"
       }, JSON.stringify(cachedSections));
     };
-
-    render( /*#__PURE__*/React.createElement(OfflineProvider, {
+    render(/*#__PURE__*/React.createElement(OfflineProvider, {
       offlineInterface: testOfflineInterface
     }, /*#__PURE__*/React.createElement(CachedSections, null)));
     const {
@@ -83,23 +81,23 @@ describe('Testing offline provider', () => {
         "data-testid": "test-div"
       }));
     };
-
-    render( /*#__PURE__*/React.createElement(OfflineProvider, {
+    render(/*#__PURE__*/React.createElement(OfflineProvider, {
       offlineInterface: mockOfflineInterface
     }, /*#__PURE__*/React.createElement(TestConsumer, null)));
     expect(screen.getByTestId('test-div')).toBeInTheDocument();
   });
   it('Should render without failing when no offlineInterface is provided', () => {
-    render( /*#__PURE__*/React.createElement(OfflineProvider, null, /*#__PURE__*/React.createElement("div", {
+    render(/*#__PURE__*/React.createElement(OfflineProvider, null, /*#__PURE__*/React.createElement("div", {
       "data-testid": "test-div"
     })));
     expect(screen.getByTestId('test-div')).toBeInTheDocument();
   });
   it('Should render without failing if PWA is not enabled', () => {
-    const testOfflineInterface = { ...mockOfflineInterface,
+    const testOfflineInterface = {
+      ...mockOfflineInterface,
       pwaEnabled: false
     };
-    render( /*#__PURE__*/React.createElement(OfflineProvider, {
+    render(/*#__PURE__*/React.createElement(OfflineProvider, {
       offlineInterface: testOfflineInterface
     }, /*#__PURE__*/React.createElement("div", {
       "data-testid": "test-div"