useTestSequence() — react Function Reference

Architecture documentation for the useTestSequence() function in index.js from the react codebase.

Function javascript BabelCompiler Validation called by 1

Entity Profile

BabelCompiler→ Validation→ useTestSequence() — react Function Reference

Dependency Diagram

graph TD
  7d51fcbe_16f5_9ae5_5715_b6fb65651a69["useTestSequence()"]
  a48cc242_4b50_fd09_0e8c_65edf69b7004["index.js"]
  7d51fcbe_16f5_9ae5_5715_b6fb65651a69 -->|defined in| a48cc242_4b50_fd09_0e8c_65edf69b7004
  c7ffc988_67fa_348a_9bbf_8e228a49a4ce["SuspenseTreeOperations()"]
  c7ffc988_67fa_348a_9bbf_8e228a49a4ce -->|calls| 7d51fcbe_16f5_9ae5_5715_b6fb65651a69
  style 7d51fcbe_16f5_9ae5_5715_b6fb65651a69 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shell/src/app/SuspenseTree/index.js lines 215–239

function useTestSequence(label: string, T1: any => any, T2: any => any) {
  const [step, setStep] = useState(0);
  const next: $FlowFixMe = (
    <button onClick={() => setStep(s => (s + 1) % allSteps.length)}>
      next {label} content
    </button>
  );
  const allSteps: $FlowFixMe = [
    <Fragment>{next}</Fragment>,
    <Fragment>
      {next} <T1 prop={step}>mount</T1>
    </Fragment>,
    <Fragment>
      {next} <T1 prop={step}>update</T1>
    </Fragment>,
    <Fragment>
      {next} <T2 prop={step}>several</T2> <T1 prop={step}>different</T1>{' '}
      <T2 prop={step}>children</T2>
    </Fragment>,
    <Fragment>
      {next} <T2 prop={step}>goodbye</T2>
    </Fragment>,
  ];
  return [step, allSteps[step]];
}