From 16a7119bf296028a1e68ab57286d9ee2ee64823e Mon Sep 17 00:00:00 2001
From: Brian Vaughn <bvaughn@fb.com>
Date: Thu, 11 Apr 2019 11:22:15 -0700
Subject: [PATCH] Added a simple Suspense test

---
 .../__snapshots__/store-test.js.snap          | 25 +++++++++
 src/__tests__/store-test.js                   | 56 +++++++++++++++++++
 2 files changed, 81 insertions(+)

diff --git a/src/__tests__/__snapshots__/store-test.js.snap b/src/__tests__/__snapshots__/store-test.js.snap
index 6a8b88da71..91c69b85d2 100644
--- a/src/__tests__/__snapshots__/store-test.js.snap
+++ b/src/__tests__/__snapshots__/store-test.js.snap
@@ -1,5 +1,30 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Store should display Suspense nodes properly in various states: loading 1`] = `
+[root]
+  ▾ <Wrapper>
+      <Component key="Outside">
+    ▾ <Suspense>
+        <Loading>
+`;
+
+exports[`Store should display Suspense nodes properly in various states: resolved 1`] = `
+[root]
+  ▾ <Wrapper>
+      <Component key="Outside">
+    ▾ <Suspense>
+        <Component key="Inside">
+`;
+
+exports[`Store should filter DOM nodes from the store tree: mount 1`] = `
+[root]
+  ▾ <Grandparent>
+    ▾ <Parent>
+        <Child>
+    ▾ <Parent>
+        <Child>
+`;
+
 exports[`Store should support mount and update operations for multiple roots: mount 1`] = `
 [root]
   ▾ <Parent key="A">
diff --git a/src/__tests__/store-test.js b/src/__tests__/store-test.js
index 6d21a5bbd5..ed71129dcf 100644
--- a/src/__tests__/store-test.js
+++ b/src/__tests__/store-test.js
@@ -71,4 +71,60 @@ describe('Store', () => {
     act(() => ReactDOM.unmountComponentAtNode(containerA));
     expect(store).toMatchSnapshot('unmount A');
   });
+
+  it('should filter DOM nodes from the store tree', () => {
+    const Grandparent = () => (
+      <div>
+        <div>
+          <Parent />
+        </div>
+        <Parent />
+      </div>
+    );
+    const Parent = () => (
+      <div>
+        <Child />
+      </div>
+    );
+    const Child = () => <div>Hi!</div>;
+
+    act(() =>
+      ReactDOM.render(<Grandparent count={4} />, document.createElement('div'))
+    );
+    expect(store).toMatchSnapshot('mount');
+  });
+
+  // TODO We should write more complex Suspense tests than just this
+  it('should display Suspense nodes properly in various states', async done => {
+    const Loading = () => <div>Loading...</div>;
+    const SuspendingComponent = () => {
+      throw new Promise(() => {});
+    };
+    const Component = () => {
+      return <div>Hello</div>;
+    };
+    const Wrapper = ({ shouldSuspense }) => (
+      <React.Fragment>
+        <Component key="Outside" />
+        <React.Suspense fallback={<Loading />}>
+          {shouldSuspense ? (
+            <SuspendingComponent />
+          ) : (
+            <Component key="Inside" />
+          )}
+        </React.Suspense>
+      </React.Fragment>
+    );
+
+    const container = document.createElement('div');
+    act(() => ReactDOM.render(<Wrapper shouldSuspense={true} />, container));
+    expect(store).toMatchSnapshot('loading');
+
+    act(async () => {
+      ReactDOM.render(<Wrapper shouldSuspense={false} />, container);
+    });
+    expect(store).toMatchSnapshot('resolved');
+
+    done();
+  });
 });