storeStressTestConcurrent-test.js — react Source File

Source Code

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

describe('StoreStressConcurrent', () => {
  let React;
  let ReactDOMClient;
  let act;
  let actAsync;
  let bridge;
  let store;
  let print;

  jest.setTimeout(15000);

  beforeEach(() => {
    global.IS_REACT_ACT_ENVIRONMENT = true;

    bridge = global.bridge;
    store = global.store;
    store.collapseNodesByDefault = false;

    React = require('react');
    ReactDOMClient = require('react-dom/client');
    act = require('./utils').act;
    // TODO: Figure out recommendation for concurrent mode tests, then replace
    // this helper with the real thing.
    actAsync = require('./utils').actAsync;

    print = require('./__serializers__/storeSerializer').printStore;
  });

  // This is a stress test for the tree mount/update/unmount traversal.
  // It renders different trees that should produce the same output.
  // @reactVersion >= 18.0
  it('should handle a stress test with different tree operations (Concurrent Mode)', async () => {
    let setShowX;
    const A = () => 'a';
    const B = () => 'b';
    const C = () => {
      // We'll be manually flipping this component back and forth in the test.
      // We only do this for a single node in order to verify that DevTools
      // can handle a subtree switching alternates while other subtrees are memoized.
      const [showX, _setShowX] = React.useState(false);
      setShowX = _setShowX;
      return showX ? <X /> : 'c';
    };
    const D = () => 'd';
    const E = () => 'e';
    const X = () => 'x';
    const a = <A key="a" />;
    const b = <B key="b" />;
    const c = <C key="c" />;
    const d = <D key="d" />;
    const e = <E key="e" />;
// ... (1308 more lines)