test getStartingData in pages/index

Author: levity

tests/helpers/render.js

@@ -9,25 +9,37 @@ import theme from '../../utils/theme';
 
 export default async function render(
   children,
-  { initialState, getMaker } = {}
+  {
+    initialState,
+    getMaker,
+
+    // use this callback to get updates every time the store state changes
+    storeCallback
+  } = {}
 ) {
-  let storeCallback;
+  let wrappedStoreCallback;
   const storePromise = new Promise(resolve => {
-    storeCallback = (state, dispatch) => resolve([state, dispatch]);
+    wrappedStoreCallback = (state, dispatch) => {
+      if (storeCallback) storeCallback(state, dispatch);
+      resolve([state, dispatch]);
+    };
   });
 
   const renderResults = renderBase(
     <ThemeProvider theme={theme}>
       <MakerProvider network="test">
         <MakerAccess callback={getMaker}>
           <StoreProvider initialState={initialState}>
-            <StoreAccess callback={storeCallback}>{children}</StoreAccess>
+            <StoreAccess callback={wrappedStoreCallback}>
+              {children}
+            </StoreAccess>
           </StoreProvider>
         </MakerAccess>
       </MakerProvider>
     </ThemeProvider>
   );
 
+  // these values are only valid for the first render
   const [state, dispatch] = await storePromise;
   return { ...renderResults, state, dispatch };
 }

tests/pages/index.spec.js

@@ -1,7 +1,16 @@
 import Index from '../../pages';
 import render from '../helpers/render';
+import assert from 'assert';
+import { wait } from '@testing-library/react';
 
-test('basic rendering', async () => {
-  const { getByText } = await render(<Index />);
+test('render and get starting data', async () => {
+  let state;
+  const { getByText } = await render(<Index />, {
+    storeCallback: s => {
+      state = s;
+    }
+  });
   getByText(/Migrate and Upgrade/);
+  await wait(() => assert(state.saiAvailable));
+  getByText(/Sai available for CDP migration/);
 });