Adds a test to ensure an async component is only resolved once.

Author: ctrlplusb

src/__tests__/__snapshots__/integration.test.js.snap

@@ -1,6 +1,16 @@
-exports[`integration works 1`] = `"<div><div><div><span>In Render.</span></div><div><span>In Boundary but outside an AsyncComponent, server render me!</span></div></div></div>"`;
+exports[`integration tests render server and client 1`] = `"<div><div><div><span>In Render.</span></div><div><span>In Boundary but outside an AsyncComponent, server render me!</span></div></div></div>"`;
 
-exports[`integration works 2`] = `
+exports[`integration tests render server and client 2`] = `
+Object {
+  "resolved": Object {
+    "1": true,
+    "2": true,
+    "4": true,
+  },
+}
+`;
+
+exports[`integration tests render server and client 3`] = `
 <AsyncComponentProvider
   execContext={
     Object {
@@ -41,7 +51,7 @@ exports[`integration works 2`] = `
 </AsyncComponentProvider>
 `;
 
-exports[`integration works 3`] = `
+exports[`integration tests render server and client 4`] = `
 <AsyncComponentProvider
   execContext={
     Object {

src/__tests__/integration.test.js

@@ -3,6 +3,7 @@
 import React from 'react'
 import { renderToStaticMarkup } from 'react-dom/server'
 import { mount } from 'enzyme'
+
 import { createAsyncComponent, withAsyncComponents } from '../'
 import { STATE_IDENTIFIER } from '../constants'
 
@@ -58,7 +59,7 @@ const app = (
   </AsyncBob>
 )
 
-describe('integration', () => {
+describe('integration tests', () => {
   afterEach(() => {
     delete global.window[STATE_IDENTIFIER]
   })
@@ -73,6 +74,7 @@ describe('integration', () => {
       .then(({ appWithAsyncComponents, state, STATE_IDENTIFIER: STATE_ID }) => {
         const serverString = renderToStaticMarkup(appWithAsyncComponents)
         expect(serverString).toMatchSnapshot()
+        expect(state).toMatchSnapshot()
         // Restore the window and attach the state to the "window" for the client
         global.window = windowTemp
         global.window[STATE_ID] = state
@@ -97,4 +99,22 @@ describe('integration', () => {
           ),
       )
   })
+
+  it('a component only gets resolved once', () => {
+    let resolveCount = 0
+
+    const Foo = createAsyncComponent({
+      resolve: () => {
+        resolveCount += 1
+        return () => <div>foo</div>
+      },
+    })
+
+    withAsyncComponents(<Foo />).then(({ appWithAsyncComponents }) => {
+      mount(appWithAsyncComponents)
+      expect(resolveCount).toEqual(1)
+      mount(appWithAsyncComponents)
+      expect(resolveCount).toEqual(1)
+    })
+  })
 })