Merge pull request #58 from getditto/pv/async-setup

feat: add support for async setup functions

Author: pvditto

src/DittoProvider.spec.tsx

@@ -241,4 +241,56 @@ describe('Ditto Provider Tests', () => {
     expect(setup).to.have.been.calledOnce
     expect(init).to.have.been.calledOnce
   })
+
+  it('should work with an async setup function', async () => {
+    const config = testIdentity()
+    const renderFn = sinon.stub()
+    renderFn.withArgs(sinon.match({ loading: false })).returns('loaded')
+
+    root.render(
+      <DittoProvider
+        setup={async () => {
+          const ditto = new Ditto(config.identity, config.path)
+          await new Promise((resolve) => setTimeout(resolve, 10))
+          return ditto
+        }}
+      >
+        {renderFn}
+      </DittoProvider>,
+    )
+
+    await waitFor(() => container.textContent === 'loaded')
+    expect(renderFn).to.have.been.calledTwice
+  })
+
+  it(`should provide an error when the setup function doesn't return a ditto instance`, async () => {
+    const setup = sinon.stub().returns(null)
+
+    root.render(
+      <DittoProvider setup={setup}>
+        {({ loading, error }) => !loading && error?.message}
+      </DittoProvider>,
+    )
+
+    await waitFor(
+      () =>
+        container.textContent ===
+        'expected a Ditto instance to be returned by the setup function, but got null',
+    )
+  })
+
+  it('should provide an error when the setup function doesn’t return an array of ditto instances', async () => {
+    const setup = sinon.stub().returns([null])
+    root.render(
+      <DittoProvider setup={setup}>
+        {({ loading, error }) => !loading && error?.message}
+      </DittoProvider>,
+    )
+
+    await waitFor(
+      () =>
+        container.textContent ===
+        'expected an array of Ditto instances to be returned by the setup function, but at least one element is not a Ditto instance (got null)',
+    )
+  })
 })

src/DittoProvider.tsx

@@ -20,7 +20,7 @@ export interface DittoProviderProps {
    *
    * Returns a single Ditto instance or an array of instances.
    */
-  setup: () => Ditto | Ditto[]
+  setup: () => Ditto | Ditto[] | Promise<Ditto | Ditto[]>
   render?: RenderFunction
   children?: RenderFunction
 }
@@ -65,16 +65,30 @@ export const DittoProvider: React.FunctionComponent<DittoProviderProps> = (
       hasMountEffectStarted.current = true
       try {
         await init(props.initOptions)
-        const setupReturnValue: Ditto | Ditto[] = props.setup()
+        const setupReturnValue: Ditto | Ditto[] = await props.setup()
         if (Array.isArray(setupReturnValue)) {
           const dittoHash: DittoHash = {}
           const dittos: Ditto[] = setupReturnValue
           for (const ditto of dittos) {
+            if (!(ditto instanceof Ditto)) {
+              throw new Error(
+                // Type is `never` because correct use never reaches this point
+                // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
+                `expected an array of Ditto instances to be returned by the setup function, but at least one element is not a Ditto instance (got ${ditto})`,
+              )
+            }
             dittoHash[ditto.persistenceDirectory] = ditto
           }
           setDittoHash(dittoHash)
         } else {
           const ditto = setupReturnValue
+          if (!(ditto instanceof Ditto)) {
+            throw new Error(
+              // Type is `never` because correct use never reaches this point
+              // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
+              `expected a Ditto instance to be returned by the setup function, but got ${ditto}`,
+            )
+          }
           const dittoHash: DittoHash = {}
           dittoHash[ditto.persistenceDirectory] = ditto
           setDittoHash(dittoHash)