getLegacyRenderImplementation() — react Function Reference

Architecture documentation for the getLegacyRenderImplementation() function in utils.js from the react codebase.

Function javascript BabelCompiler Validation

Entity Profile

BabelCompiler→ Validation→ getLegacyRenderImplementation() — react Function Reference

Dependency Diagram

graph TD
  026f470e_4718_4a16_f9eb_8e2406332f5a["getLegacyRenderImplementation()"]
  7ea1760e_9c01_71c9_3ba5_32a9a10a0ce4["utils.js"]
  026f470e_4718_4a16_f9eb_8e2406332f5a -->|defined in| 7ea1760e_9c01_71c9_3ba5_32a9a10a0ce4
  style 026f470e_4718_4a16_f9eb_8e2406332f5a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shared/src/__tests__/utils.js lines 133–184

export function getLegacyRenderImplementation(): RenderImplementation {
  let ReactDOM;
  let container;
  const containersToRemove = [];

  beforeEach(() => {
    ReactDOM = require('react-dom');

    createContainer();
  });

  afterEach(() => {
    containersToRemove.forEach(c => document.body.removeChild(c));
    containersToRemove.splice(0, containersToRemove.length);

    ReactDOM = null;
    container = null;
  });

  function render(elements) {
    withErrorsOrWarningsIgnored(
      ['ReactDOM.render has not been supported since React 18'],
      () => {
        ReactDOM.render(elements, container);
      },
    );

    return unmount;
  }

  function unmount() {
    ReactDOM.unmountComponentAtNode(container);
  }

  function createContainer() {
    container = document.createElement('div');
    document.body.appendChild(container);

    containersToRemove.push(container);
  }

  function getContainer() {
    return container;
  }

  return {
    render,
    unmount,
    createContainer,
    getContainer,
  };
}