Tree Traversal and Search API

/**
 * Traverses a rendered tree and finds all VNodes matching a predicate
 * @param renderedTree - The rendered component tree (from renderIntoContainer or render)
 * @param predicate - Function that returns true for matching VNodes
 * @returns Array of VNodes where predicate returns true
 */
function findAllInRenderedTree(renderedTree: any, predicate: (vNode: VNode) => boolean): VNode[] | any

import { findAllInRenderedTree, renderIntoContainer } from 'inferno-test-utils';
import { Component } from 'inferno';

class MyComponent extends Component {
  render() {
    return (
      <div className="container">
        <span>Hello</span>
        <p>World</p>
      </div>
    );
  }
}

const renderedTree = renderIntoContainer(<MyComponent />);

// Find all DOM elements with a specific tag
const spans = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.type === 'span'
);

// Find all elements with specific props
const elementsWithClass = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.props && vnode.props.className === 'container'
);

// Find all components of a specific type
const myComponents = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.type === MyComponent
);

/**
 * Traverses a VNode tree and finds all VNodes matching a predicate
 * @param vNodeTree - The VNode tree to traverse
 * @param predicate - Function that returns true for matching VNodes
 * @returns Array of VNodes where predicate returns true
 */
function findAllInVNodeTree(vNodeTree: VNode, predicate: (vNode: VNode) => boolean): any

import { findAllInVNodeTree } from 'inferno-test-utils';
import { createElement } from 'inferno-create-element';

const vNodeTree = (
  <div className="outer">
    <MyComponent className="inner" />
    <span>Text content</span>
  </div>
);

// Find all VNodes with className prop
const withClassName = findAllInVNodeTree(vNodeTree, (vnode) => 
  vnode.props && vnode.props.className
);

// Find all text elements
const textElements = findAllInVNodeTree(vNodeTree, (vnode) => 
  vnode.type === 'span'
);

/**
 * Finds all DOM elements with specified class names in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param classNames - Space-separated class names string or array of class names
 * @returns Array of DOM elements matching the class criteria
 */
function scryRenderedDOMElementsWithClass(renderedTree: any, classNames: string | string[]): Element[]

import { scryRenderedDOMElementsWithClass, renderIntoContainer } from 'inferno-test-utils';

const vNodeTree = (
  <div className="outer">
    <div className="inner one">First</div>
    <div className="inner two">Second</div>
    <span className="inner">Third</span>
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find all elements with 'inner' class
const innerElements = scryRenderedDOMElementsWithClass(renderedTree, 'inner');
console.log(innerElements.length); // 3

// Find elements with multiple classes (space-separated string)
const innerOneElements = scryRenderedDOMElementsWithClass(renderedTree, 'inner one');
console.log(innerOneElements.length); // 1

// Find elements with multiple classes (array)
const innerTwoElements = scryRenderedDOMElementsWithClass(renderedTree, ['inner', 'two']);
console.log(innerTwoElements.length); // 1

// No matches returns empty array
const nonexistent = scryRenderedDOMElementsWithClass(renderedTree, 'nonexistent');
console.log(nonexistent.length); // 0

/**
 * Finds all DOM elements with specified tag name in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param tagName - HTML tag name to search for
 * @returns Array of DOM elements with the specified tag name
 */
function scryRenderedDOMElementsWithTag(renderedTree: any, tagName: string): Element[]

import { scryRenderedDOMElementsWithTag, renderIntoContainer } from 'inferno-test-utils';

const vNodeTree = (
  <div>
    <h1>Heading</h1>
    <p>Paragraph One</p>
    <p>Paragraph Two</p>
    <p>Paragraph Three</p>
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find all paragraph elements
const paragraphs = scryRenderedDOMElementsWithTag(renderedTree, 'p');
console.log(paragraphs.length); // 3

// Find all heading elements
const headings = scryRenderedDOMElementsWithTag(renderedTree, 'h1');
console.log(headings.length); // 1

// No matches returns empty array
const spans = scryRenderedDOMElementsWithTag(renderedTree, 'span');
console.log(spans.length); // 0

/**
 * Finds all rendered VNodes of specified type in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param type - Component type, function, or string to search for
 * @returns Array of VNodes matching the specified type
 */
function scryRenderedVNodesWithType(renderedTree: any, type: unknown): VNode[]

import { scryRenderedVNodesWithType, renderIntoContainer } from 'inferno-test-utils';
import { Component } from 'inferno';

class MyComponent extends Component {
  render() { return <div>My Component</div>; }
}

function MyFunctionalComponent() {
  return <div>Functional Component</div>;
}

const vNodeTree = (
  <div>
    <h1>Heading</h1>
    <MyComponent />
    <MyComponent />
    <MyFunctionalComponent />
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find all instances of MyComponent
const myComponents = scryRenderedVNodesWithType(renderedTree, MyComponent);
console.log(myComponents.length); // 2

// Find all h1 elements
const headings = scryRenderedVNodesWithType(renderedTree, 'h1');
console.log(headings.length); // 1

// Find functional components
const functionalComponents = scryRenderedVNodesWithType(renderedTree, MyFunctionalComponent);
console.log(functionalComponents.length); // 1

/**
 * Finds all VNodes of specified type in a VNode tree
 * @param vNodeTree - The VNode tree to search
 * @param type - Component type, function, or string to search for
 * @returns Array of VNodes matching the specified type
 */
function scryVNodesWithType(vNodeTree: VNode, type: unknown): VNode[]

import { scryVNodesWithType } from 'inferno-test-utils';

const vNodeTree = (
  <div>
    <h1>Heading</h1>
    <MyComponent />
    <MyComponent />
  </div>
);

// Find all instances of MyComponent in the VNode tree
const myComponents = scryVNodesWithType(vNodeTree, MyComponent);
console.log(myComponents.length); // 2

// Find all h1 elements
const headings = scryVNodesWithType(vNodeTree, 'h1');
console.log(headings.length); // 1

/**
 * Finds a single DOM element with specified class names in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param classNames - Space-separated class names string or array of class names
 * @returns Single DOM element matching the class criteria
 * @throws Error if zero or multiple matches found
 */
function findRenderedDOMElementWithClass(renderedTree: any, classNames: string | string[]): Element

import { findRenderedDOMElementWithClass, renderIntoContainer } from 'inferno-test-utils';

const vNodeTree = (
  <div className="outer">
    <div className="unique-class">Unique element</div>
    <div className="inner">First inner</div>
    <div className="inner">Second inner</div>
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find single element - success
const uniqueElement = findRenderedDOMElementWithClass(renderedTree, 'unique-class');
console.log(uniqueElement.textContent); // "Unique element"

// Find single element - throws error due to multiple matches
try {
  const innerElement = findRenderedDOMElementWithClass(renderedTree, 'inner');
} catch (error) {
  console.log(error.message); // "Did not find exactly one match (found 2) for class: inner"
}

// Find single element - throws error due to no matches
try {
  const nonexistent = findRenderedDOMElementWithClass(renderedTree, 'nonexistent');
} catch (error) {
  console.log(error.message); // "Did not find exactly one match (found 0) for class: nonexistent"
}

/**
 * Finds a single DOM element with specified tag name in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param tagName - HTML tag name to search for
 * @returns Single DOM element with the specified tag name
 * @throws Error if zero or multiple matches found
 */
function findRenderedDOMElementWithTag(renderedTree: any, tagName: string): Element

import { findRenderedDOMElementWithTag, renderIntoContainer } from 'inferno-test-utils';

const vNodeTree = (
  <div>
    <h1>Unique heading</h1>
    <p>First paragraph</p>
    <p>Second paragraph</p>
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find single h1 - success
const heading = findRenderedDOMElementWithTag(renderedTree, 'h1');
console.log(heading.textContent); // "Unique heading"

// Find single p - throws error due to multiple matches
try {
  const paragraph = findRenderedDOMElementWithTag(renderedTree, 'p');
} catch (error) {
  console.log(error.message); // "Did not find exactly one match (found 2) for tag: p"
}

/**
 * Finds a single rendered VNode of specified type in a rendered tree
 * @param renderedTree - The rendered component tree
 * @param type - Component type, function, or string to search for
 * @returns Single VNode matching the specified type
 * @throws Error if zero or multiple matches found
 */
function findRenderedVNodeWithType(renderedTree: any, type: unknown): VNode

import { findRenderedVNodeWithType, renderIntoContainer } from 'inferno-test-utils';
import { Component } from 'inferno';

class UniqueComponent extends Component {
  render() { return <div>Unique</div>; }
}

class CommonComponent extends Component {
  render() { return <div>Common</div>; }
}

const vNodeTree = (
  <div>
    <UniqueComponent />
    <CommonComponent />
    <CommonComponent />
  </div>
);

const renderedTree = renderIntoContainer(vNodeTree);

// Find single unique component - success
const uniqueComponent = findRenderedVNodeWithType(renderedTree, UniqueComponent);
console.log(uniqueComponent.type === UniqueComponent); // true

// Find common component - throws error due to multiple matches
try {
  const commonComponent = findRenderedVNodeWithType(renderedTree, CommonComponent);
} catch (error) {
  console.log(error.message); // "Did not find exactly one match (found 2) for component: CommonComponent"
}

/**
 * Finds a single VNode of specified type in a VNode tree
 * @param vNodeTree - The VNode tree to search
 * @param type - Component type, function, or string to search for
 * @returns Single VNode matching the specified type
 * @throws Error if zero or multiple matches found
 */
function findVNodeWithType(vNodeTree: VNode, type: unknown): VNode

import { findVNodeWithType } from 'inferno-test-utils';

const vNodeTree = (
  <div>
    <h1>Unique heading</h1>
    <UniqueComponent />
    <CommonComponent />
    <CommonComponent />
  </div>
);

// Find single h1 - success
const heading = findVNodeWithType(vNodeTree, 'h1');
console.log(heading.type); // 'h1'

// Find unique component - success
const uniqueComponent = findVNodeWithType(vNodeTree, UniqueComponent);
console.log(uniqueComponent.type === UniqueComponent); // true

// Find common component - throws error due to multiple matches
try {
  const commonComponent = findVNodeWithType(vNodeTree, CommonComponent);
} catch (error) {
  console.log(error.message); // "Did not find exactly one match (found 2) for VNode: CommonComponent"
}

import { findAllInRenderedTree, renderIntoContainer } from 'inferno-test-utils';

const renderedTree = renderIntoContainer(<MyComplexApp />);

// Find elements with specific props
const elementsWithId = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.props && vnode.props.id
);

// Find elements with specific attributes
const buttonsWithDisabled = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.type === 'button' && vnode.props && vnode.props.disabled
);

// Find components with specific state (for class components)
const componentsWithState = findAllInRenderedTree(renderedTree, (vnode) => 
  vnode.children && vnode.children.state && vnode.children.state.isLoading
);

import { 
  scryRenderedDOMElementsWithClass,
  scryRenderedDOMElementsWithTag,
  renderIntoContainer 
} from 'inferno-test-utils';

const renderedTree = renderIntoContainer(<MyApp />);

// Get all buttons, then filter by class
const allButtons = scryRenderedDOMElementsWithTag(renderedTree, 'button');
const primaryButtons = scryRenderedDOMElementsWithClass(renderedTree, 'btn-primary');
const primaryButtonElements = allButtons.filter(btn => 
  primaryButtons.includes(btn)
);

import { findRenderedDOMElementWithClass } from 'inferno-test-utils';

function findElementSafely(renderedTree, className) {
  try {
    return findRenderedDOMElementWithClass(renderedTree, className);
  } catch (error) {
    if (error.message.includes('Did not find exactly one match')) {
      console.warn(`Multiple or no elements found with class: ${className}`);
      return null;
    }
    throw error;
  }
}