{"patch":"diff --git a\/src\/__tests__\/__snapshots__\/storeStressTestConcurrent-test.js.snap b\/src\/__tests__\/__snapshots__\/storeStressTestConcurrent-test.js.snap\nnew file mode 100644\nindex 0000000000..22f2fdf406\n--- \/dev\/null\n+++ b\/src\/__tests__\/__snapshots__\/storeStressTestConcurrent-test.js.snap\n@@ -0,0 +1,239 @@\n+\/\/ Jest Snapshot v1, https:\/\/goo.gl\/fbAQLP\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 1`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 2`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 3`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 4`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 5`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 6`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 7`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 8`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 9`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 10`] = `\n+[root]\n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 11`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test for Suspense (Concurrent Mode) 12`] = `\n+[root]\n+ ▾ \n+ \n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test with different tree operations (Concurrent Mode): 1: abcde 1`] = `\n+[root]\n+ ▾ \n+ \n+ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle a stress test with different tree operations (Concurrent Mode): 2: abxde 1`] = `\n+[root]\n+ ▾ \n+ \n+ \n+ ▾ \n+ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 1`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 2`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 3`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 4`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 5`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 6`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 7`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 8`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 9`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 10`] = `\n+[root]\n+ ▾ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 11`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 12`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 13`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 14`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 15`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\n+\n+exports[`StoreStressConcurrent should handle stress test with reordering (Concurrent Mode) 16`] = `\n+[root]\n+ ▾ \n+ \n+ \n+`;\ndiff --git a\/src\/__tests__\/storeStressTestConcurrent-test.js b\/src\/__tests__\/storeStressTestConcurrent-test.js\nnew file mode 100644\nindex 0000000000..6bfd867337\n--- \/dev\/null\n+++ b\/src\/__tests__\/storeStressTestConcurrent-test.js\n@@ -0,0 +1,671 @@\n+\/\/ @flow\n+\n+describe('StoreStressConcurrent', () => {\n+ let React;\n+ let ReactDOM;\n+ let TestUtils;\n+ let bridge;\n+ let store;\n+ let print;\n+\n+ const act = (callback: Function) => {\n+ TestUtils.act(() => {\n+ callback();\n+ });\n+ jest.advanceTimersByTime(1000); \/\/ Flush rendering and Suspense\n+ jest.runAllTimers(); \/\/ Flush Bridge operations\n+ };\n+\n+ beforeEach(() => {\n+ bridge = global.bridge;\n+ store = global.store;\n+ store.collapseNodesByDefault = false;\n+\n+ React = require('react');\n+ ReactDOM = require('react-dom');\n+ TestUtils = require('react-dom\/test-utils');\n+\n+ print = require('.\/storeSerializer').print;\n+ });\n+\n+ \/\/ This is a stress test for the tree mount\/update\/unmount traversal.\n+ \/\/ It renders different trees that should produce the same output.\n+ it('should handle a stress test with different tree operations (Concurrent Mode)', () => {\n+ let setShowX;\n+ const A = () => 'a';\n+ const B = () => 'b';\n+ const C = () => {\n+ \/\/ We'll be manually flipping this component back and forth in the test.\n+ \/\/ We only do this for a single node in order to verify that DevTools\n+ \/\/ can handle a subtree switching alternates while other subtrees are memoized.\n+ let [showX, _setShowX] = React.useState(false);\n+ setShowX = _setShowX;\n+ return showX ? : 'c';\n+ };\n+ const D = () => 'd';\n+ const E = () => 'e';\n+ const X = () => 'x';\n+ const a = ;\n+ const b = ;\n+ const c = ;\n+ const d = ;\n+ const e = ;\n+\n+ function Parent({ children }) {\n+ return children;\n+ }\n+\n+ \/\/ 1. Render a normal version of [a, b, c, d, e].\n+ let container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ let root = ReactDOM.unstable_createRoot(container);\n+ act(() => root.render({[a, b, c, d, e]}<\/Parent>));\n+ expect(store).toMatchSnapshot('1: abcde');\n+ expect(container.textContent).toMatch('abcde');\n+ const snapshotForABCDE = print(store);\n+\n+ \/\/ 2. Render a version where renders an child instead of 'c'.\n+ \/\/ This is how we'll test an update to a single component.\n+ act(() => {\n+ setShowX(true);\n+ });\n+ expect(store).toMatchSnapshot('2: abxde');\n+ expect(container.textContent).toMatch('abxde');\n+ const snapshotForABXDE = print(store);\n+\n+ \/\/ 3. Verify flipping it back produces the original result.\n+ act(() => {\n+ setShowX(false);\n+ });\n+ expect(container.textContent).toMatch('abcde');\n+ expect(print(store)).toBe(snapshotForABCDE);\n+\n+ \/\/ 4. Clean up.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+\n+ \/\/ Now comes the interesting part.\n+ \/\/ All of these cases are equivalent to [a, b, c, d, e] in output.\n+ \/\/ We'll verify that DevTools produces the same snapshots for them.\n+ \/\/ These cases are picked so that rendering them sequentially in the same\n+ \/\/ container results in a combination of mounts, updates, unmounts, and reorders.\n+ \/\/ prettier-ignore\n+ let cases = [\n+ [a, b, c, d, e],\n+ [[a], b, c, d, e],\n+ [[a, b], c, d, e],\n+ [[a, b], c, [d, e]],\n+ [[a, b], c, [d, '', e]],\n+ [[a], b, c, d, [e]],\n+ [a, b, [[c]], d, e],\n+ [[a, ''], [b], [c], [d], [e]],\n+ [a, b, [c, [d, ['', e]]]],\n+ [a, b, c, d, e],\n+ [
{a}<\/div>, b, c, d, e],\n+ [
{a}{b}<\/div>, c, d, e],\n+ [
{a}{b}<\/div>, c,
{d}{e}<\/div>],\n+ [
{a}{b}<\/div>, c,
{d}{e}<\/div>],\n+ [
{a}{b}<\/div>, c,
{d}{e}<\/div>],\n+ [
{a}{b}<\/div>, c,
{d}{e}<\/div>],\n+ [{a}<\/span>, b, c, d, [e]],\n+ [a, b, {c}<\/span><\/span>, d, e],\n+ [
{a}<\/div>, [b], {c}<\/span>, [d],
{e}<\/div>],\n+ [a, b, [c,
{d}{e}<\/span><\/div>], ''],\n+ [a, [[]], b, c, [d, [[]], e]],\n+ [[[a, b, c, d], e]],\n+ [a, b, c, d, e]\n+ ];\n+\n+ \/\/ 5. Test fresh mount for each case.\n+ for (let i = 0; i < cases.length; i++) {\n+ \/\/ Ensure fresh mount.\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+\n+ \/\/ Verify mounting 'abcde'.\n+ act(() => root.render({cases[i]}<\/Parent>));\n+ expect(container.textContent).toMatch('abcde');\n+ expect(print(store)).toEqual(snapshotForABCDE);\n+\n+ \/\/ Verify switching to 'abxde'.\n+ act(() => {\n+ setShowX(true);\n+ });\n+ expect(container.textContent).toMatch('abxde');\n+ expect(print(store)).toBe(snapshotForABXDE);\n+\n+ \/\/ Verify switching back to 'abcde'.\n+ act(() => {\n+ setShowX(false);\n+ });\n+ expect(container.textContent).toMatch('abcde');\n+ expect(print(store)).toBe(snapshotForABCDE);\n+\n+ \/\/ Clean up.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+\n+ \/\/ 6. Verify *updates* by reusing the container between iterations.\n+ \/\/ There'll be no unmounting until the very end.\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ for (let i = 0; i < cases.length; i++) {\n+ \/\/ Verify mounting 'abcde'.\n+ act(() => root.render({cases[i]}<\/Parent>));\n+ expect(container.textContent).toMatch('abcde');\n+ expect(print(store)).toEqual(snapshotForABCDE);\n+\n+ \/\/ Verify switching to 'abxde'.\n+ act(() => {\n+ setShowX(true);\n+ });\n+ expect(container.textContent).toMatch('abxde');\n+ expect(print(store)).toBe(snapshotForABXDE);\n+\n+ \/\/ Verify switching back to 'abcde'.\n+ act(() => {\n+ setShowX(false);\n+ });\n+ expect(container.textContent).toMatch('abcde');\n+ expect(print(store)).toBe(snapshotForABCDE);\n+ \/\/ Don't unmount. Reuse the container between iterations.\n+ }\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ });\n+\n+ it('should handle stress test with reordering (Concurrent Mode)', () => {\n+ const A = () => 'a';\n+ const B = () => 'b';\n+ const C = () => 'c';\n+ const D = () => 'd';\n+ const E = () => 'e';\n+ const a = ;\n+ const b = ;\n+ const c = ;\n+ const d = ;\n+ const e = ;\n+\n+ \/\/ prettier-ignore\n+ let steps = [\n+ a,\n+ b,\n+ c,\n+ d,\n+ e,\n+ [a],\n+ [b],\n+ [c],\n+ [d],\n+ [e],\n+ [a, b],\n+ [b, a],\n+ [b, c],\n+ [c, b],\n+ [a, c],\n+ [c, a],\n+ ];\n+\n+ const Root = ({ children }) => {\n+ return children;\n+ };\n+\n+ \/\/ 1. Capture the expected render result.\n+ let snapshots = [];\n+ let container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ let root = ReactDOM.unstable_createRoot(container);\n+ for (let i = 0; i < steps.length; i++) {\n+ act(() => root.render({steps[i]}<\/Root>));\n+ \/\/ We snapshot each step once so it doesn't regress.\n+ expect(store).toMatchSnapshot();\n+ snapshots.push(print(store));\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+\n+ \/\/ 2. Verify that we can update from every step to every other step and back.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ let container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ let root = ReactDOM.unstable_createRoot(container);\n+ act(() => root.render({steps[i]}<\/Root>));\n+ expect(print(store)).toMatch(snapshots[i]);\n+ act(() => root.render({steps[j]}<\/Root>));\n+ expect(print(store)).toMatch(snapshots[j]);\n+ act(() => root.render({steps[i]}<\/Root>));\n+ expect(print(store)).toMatch(snapshots[i]);\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+\n+ \/\/ 3. Same test as above, but this time we wrap children in a host component.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ let container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ let root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+
{steps[i]}<\/div>\n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toMatch(snapshots[i]);\n+ act(() =>\n+ root.render(\n+ \n+
{steps[j]}<\/div>\n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toMatch(snapshots[j]);\n+ act(() =>\n+ root.render(\n+ \n+
{steps[i]}<\/div>\n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toMatch(snapshots[i]);\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+ });\n+\n+ it('should handle a stress test for Suspense (Concurrent Mode)', async () => {\n+ const A = () => 'a';\n+ const B = () => 'b';\n+ const C = () => 'c';\n+ const X = () => 'x';\n+ const Y = () => 'y';\n+ const Z = () => 'z';\n+ const a = ;\n+ const b = ;\n+ const c = ;\n+ const z = ;\n+\n+ \/\/ prettier-ignore\n+ const steps = [\n+ a,\n+ [a],\n+ [a, b, c],\n+ [c, b, a],\n+ [c, null, a],\n+ {c}{a}<\/React.Fragment>,\n+
{c}{a}<\/div>,\n+
{a}<\/span>{b}<\/div>,\n+ [[a]],\n+ null,\n+ b,\n+ a\n+ ];\n+\n+ const Never = () => {\n+ throw new Promise(() => {});\n+ };\n+\n+ const Root = ({ children }) => {\n+ return children;\n+ };\n+\n+ \/\/ 1. For each step, check Suspense can render them as initial primary content.\n+ \/\/ This is the only step where we use Jest snapshots.\n+ let snapshots = [];\n+ let container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ let root = ReactDOM.unstable_createRoot(container);\n+ for (let i = 0; i < steps.length; i++) {\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ We snapshot each step once so it doesn't regress.\n+ expect(store).toMatchSnapshot();\n+ snapshots.push(print(store));\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+\n+ \/\/ 2. Verify check Suspense can render same steps as initial fallback content.\n+ for (let i = 0; i < steps.length; i++) {\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+\n+ \/\/ 3. Verify we can update from each step to each step in primary mode.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ \/\/ Always start with a fresh container and steps[i].\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Re-render with steps[j].\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[j]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ Verify the successful transition to steps[j].\n+ expect(print(store)).toEqual(snapshots[j]);\n+ \/\/ Check that we can transition back again.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Clean up after every iteration.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+\n+ \/\/ 4. Verify we can update from each step to each step in fallback mode.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ \/\/ Always start with a fresh container and steps[i].\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Re-render with steps[j].\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ Verify the successful transition to steps[j].\n+ expect(print(store)).toEqual(snapshots[j]);\n+ \/\/ Check that we can transition back again.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Clean up after every iteration.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+\n+ \/\/ 5. Verify we can update from each step to each step when moving primary -> fallback.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ \/\/ Always start with a fresh container and steps[i].\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Re-render with steps[j].\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ Verify the successful transition to steps[j].\n+ expect(print(store)).toEqual(snapshots[j]);\n+ \/\/ Check that we can transition back again.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Clean up after every iteration.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+\n+ \/\/ 6. Verify we can update from each step to each step when moving fallback -> primary.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ \/\/ Always start with a fresh container and steps[i].\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Re-render with steps[j].\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[j]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ Verify the successful transition to steps[j].\n+ expect(print(store)).toEqual(snapshots[j]);\n+ \/\/ Check that we can transition back again.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[i]);\n+ \/\/ Clean up after every iteration.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+\n+ \/\/ 7. Verify we can update from each step to each step when toggling Suspense.\n+ for (let i = 0; i < steps.length; i++) {\n+ for (let j = 0; j < steps.length; j++) {\n+ \/\/ Always start with a fresh container and steps[i].\n+ container = document.createElement('div');\n+ \/\/ $FlowFixMe\n+ root = ReactDOM.unstable_createRoot(container);\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+\n+ \/\/ We get ID from the index in the tree above:\n+ \/\/ Root, X, Suspense, ...\n+ \/\/ ^ (index is 2)\n+ const suspenseID = store.getElementIDAtIndex(2);\n+\n+ \/\/ Force fallback.\n+ expect(print(store)).toEqual(snapshots[i]);\n+ act(() => {\n+ const suspenseID = store.getElementIDAtIndex(2);\n+ bridge.send('overrideSuspense', {\n+ id: suspenseID,\n+ rendererID: store.getRendererIDForElement(suspenseID),\n+ forceFallback: true,\n+ });\n+ });\n+ expect(print(store)).toEqual(snapshots[j]);\n+\n+ \/\/ Stop forcing fallback.\n+ act(() => {\n+ bridge.send('overrideSuspense', {\n+ id: suspenseID,\n+ rendererID: store.getRendererIDForElement(suspenseID),\n+ forceFallback: false,\n+ });\n+ });\n+ expect(print(store)).toEqual(snapshots[i]);\n+\n+ \/\/ Trigger actual fallback.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ \n+ \n+ \n+ \n+ <\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ expect(print(store)).toEqual(snapshots[j]);\n+\n+ \/\/ Force fallback while we're in fallback mode.\n+ act(() => {\n+ bridge.send('overrideSuspense', {\n+ id: suspenseID,\n+ rendererID: store.getRendererIDForElement(suspenseID),\n+ forceFallback: true,\n+ });\n+ });\n+ \/\/ Keep seeing fallback content.\n+ expect(print(store)).toEqual(snapshots[j]);\n+\n+ \/\/ Switch to primary mode.\n+ act(() =>\n+ root.render(\n+ \n+ \n+ {steps[i]}<\/React.Suspense>\n+ \n+ <\/Root>\n+ )\n+ );\n+ \/\/ Fallback is still forced though.\n+ expect(print(store)).toEqual(snapshots[j]);\n+\n+ \/\/ Stop forcing fallback. This reverts to primary content.\n+ act(() => {\n+ bridge.send('overrideSuspense', {\n+ id: suspenseID,\n+ rendererID: store.getRendererIDForElement(suspenseID),\n+ forceFallback: false,\n+ });\n+ });\n+ \/\/ Now we see primary content.\n+ expect(print(store)).toEqual(snapshots[i]);\n+\n+ \/\/ Clean up after every iteration.\n+ act(() => root.unmount());\n+ expect(print(store)).toBe('');\n+ }\n+ }\n+ });\n+});\n","commit":{"authoredAt":"2019-04-18T16:10:44+01:00","authorName":"Dan Abramov","authorEmail":"dan.abramov@gmail.com","shortRevision":"24309fde06","subject":"Add failing Concurrent Mode stress tests","revision":"24309fde06f0603f968532d4e41ec421e3434861"},"files":[{"path":"src\/__tests__\/__snapshots__\/storeStressTestConcurrent-test.js.snap","status":"A"},{"path":"src\/__tests__\/storeStressTestConcurrent-test.js","status":"A"}],"body":"","parents":["0f44e9fb9854a3abf4a3e835fa9577edb9d3f67d"]}

dillon1000/react

Files changed