From 3e91010e4a3b65221e9dd7fdc1b1f05fdaa3f424 Mon Sep 17 00:00:00 2001
From: IDrissAitHafid <idrissaithafid@gmail.com>
Date: Fri, 9 Oct 2020 03:45:26 +0100
Subject: [PATCH 1/2] handled a missing suspense fiber when suspense is
 filtered on the profiler

---
 packages/react-devtools-shared/src/backend/renderer.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/backend/renderer.js b/packages/react-devtools-shared/src/backend/renderer.js
index 2b382e24a59e8..c10d71bbfec2e 100644
--- a/packages/react-devtools-shared/src/backend/renderer.js
+++ b/packages/react-devtools-shared/src/backend/renderer.js
@@ -1572,7 +1572,7 @@ export function attach(
       if (nextPrimaryChildSet !== null) {
         mountFiberRecursively(
           nextPrimaryChildSet,
-          nextFiber,
+          shouldIncludeInTree ? nextFiber : parentFiber,
           true,
           traceNearestHostComponentUpdate,
         );

From 35c74818b62fe2f5b31c74ae1d7d7587a5ebe7cc Mon Sep 17 00:00:00 2001
From: Brian Vaughn <bvaughn@fb.com>
Date: Tue, 13 Oct 2020 13:28:12 -0400
Subject: [PATCH 2/2] Add failing test for filtered Suspense node

---
 .../storeComponentFilters-test.js.snap        | 13 ++++++++
 .../__tests__/storeComponentFilters-test.js   | 30 +++++++++++++++++++
 2 files changed, 43 insertions(+)

diff --git a/packages/react-devtools-shared/src/__tests__/__snapshots__/storeComponentFilters-test.js.snap b/packages/react-devtools-shared/src/__tests__/__snapshots__/storeComponentFilters-test.js.snap
index 884b6cbcec85d..cfe68aa69ecbc 100644
--- a/packages/react-devtools-shared/src/__tests__/__snapshots__/storeComponentFilters-test.js.snap
+++ b/packages/react-devtools-shared/src/__tests__/__snapshots__/storeComponentFilters-test.js.snap
@@ -84,6 +84,19 @@ exports[`Store component filters should ignore invalid ElementTypeRoot filter: 2
       <div>
 `;
 
+exports[`Store component filters should not break when Suspense nodes are filtered from the tree: 1: suspended 1`] = `
+[root]
+  ▾ <Wrapper>
+    ▾ <Loading>
+        <div>
+`;
+
+exports[`Store component filters should not break when Suspense nodes are filtered from the tree: 2: resolved 1`] = `
+[root]
+  ▾ <Wrapper>
+      <Component>
+`;
+
 exports[`Store component filters should support filtering by element type: 1: mount 1`] = `
 [root]
   ▾ <Root>
diff --git a/packages/react-devtools-shared/src/__tests__/storeComponentFilters-test.js b/packages/react-devtools-shared/src/__tests__/storeComponentFilters-test.js
index 1a5be03f09aad..bfbf3e98210a9 100644
--- a/packages/react-devtools-shared/src/__tests__/storeComponentFilters-test.js
+++ b/packages/react-devtools-shared/src/__tests__/storeComponentFilters-test.js
@@ -227,4 +227,34 @@ describe('Store component filters', () => {
         ]),
     );
   });
+
+  it('should not break when Suspense nodes are filtered from the tree', () => {
+    const promise = new Promise(() => {});
+
+    const Loading = () => <div>Loading...</div>;
+
+    const Component = ({shouldSuspend}) => {
+      if (shouldSuspend) {
+        throw promise;
+      }
+      return null;
+    };
+
+    const Wrapper = ({shouldSuspend}) => (
+      <React.Suspense fallback={<Loading />}>
+        <Component shouldSuspend={shouldSuspend} />
+      </React.Suspense>
+    );
+
+    store.componentFilters = [
+      utils.createElementTypeFilter(Types.ElementTypeSuspense),
+    ];
+
+    const container = document.createElement('div');
+    act(() => ReactDOM.render(<Wrapper shouldSuspend={true} />, container));
+    expect(store).toMatchSnapshot('1: suspended');
+
+    act(() => ReactDOM.render(<Wrapper shouldSuspend={false} />, container));
+    expect(store).toMatchSnapshot('2: resolved');
+  });
 });