Home / Function/ insertNodesAndExecuteScripts() — react Function Reference

insertNodesAndExecuteScripts() — react Function Reference

Architecture documentation for the insertNodesAndExecuteScripts() function in FizzTestUtils.js from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  1ef1d603_31d5_1714_d957_3868b001227f["insertNodesAndExecuteScripts()"]
  7c063c03_f497_41b6_7547_aff9bc8a9af7["FizzTestUtils.js"]
  1ef1d603_31d5_1714_d957_3868b001227f -->|defined in| 7c063c03_f497_41b6_7547_aff9bc8a9af7
  5343ca21_0631_7721_3a23_011487e7c59e["executeScript()"]
  1ef1d603_31d5_1714_d957_3868b001227f -->|calls| 5343ca21_0631_7721_3a23_011487e7c59e
  style 1ef1d603_31d5_1714_d957_3868b001227f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-dom/src/test-utils/FizzTestUtils.js lines 11–79

async function insertNodesAndExecuteScripts(
  source: Document | Element,
  target: Node,
  CSPnonce: string | null,
) {
  const ownerDocument = target.ownerDocument || target;

  // We need to remove the script content for any scripts that would not run based on CSP
  // We restore the script content after moving the nodes into the target
  const badNonceScriptNodes: Map<Element, string> = new Map();
  if (CSPnonce) {
    const scripts = source.querySelectorAll('script');
    for (let i = 0; i < scripts.length; i++) {
      const script = scripts[i];
      if (
        !script.hasAttribute('src') &&
        script.getAttribute('nonce') !== CSPnonce
      ) {
        badNonceScriptNodes.set(script, script.textContent);
        script.textContent = '';
      }
    }
  }
  let lastChild = null;
  while (source.firstChild) {
    const node = source.firstChild;
    if (lastChild === node) {
      throw new Error('Infinite loop.');
    }
    lastChild = node;

    if (node.nodeType === 1) {
      const element: Element = (node: any);
      if (
        // $FlowFixMe[prop-missing]
        element.dataset != null &&
        (element.dataset.rxi != null ||
          element.dataset.rri != null ||
          element.dataset.rci != null ||
          element.dataset.rsi != null)
      ) {
        // Fizz external runtime instructions are expected to be in the body.
        // When we have renderIntoContainer and renderDocument this will be
        // more enforceable. At the moment you can misconfigure your stream and end up
        // with instructions that are deep in the document
        (ownerDocument.body: any).appendChild(element);
      } else {
        target.appendChild(element);

        if (element.nodeName === 'SCRIPT') {
          await executeScript(element);
        } else {
          const scripts = element.querySelectorAll('script');
          for (let i = 0; i < scripts.length; i++) {
            const script = scripts[i];
            await executeScript(script);
          }
        }
      }
    } else {
      target.appendChild(node);
    }
  }

  // restore the textContent now that we have finished attempting to execute scripts
  badNonceScriptNodes.forEach((scriptContent, script) => {
    script.textContent = scriptContent;
  });
}

Domain

Subdomains

Frequently Asked Questions

What does insertNodesAndExecuteScripts() do?
insertNodesAndExecuteScripts() is a function in the react codebase, defined in packages/react-dom/src/test-utils/FizzTestUtils.js.
Where is insertNodesAndExecuteScripts() defined?
insertNodesAndExecuteScripts() is defined in packages/react-dom/src/test-utils/FizzTestUtils.js at line 11.
What does insertNodesAndExecuteScripts() call?
insertNodesAndExecuteScripts() calls 1 function(s): executeScript.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free