Docs - Added for findNode methods

This commit is contained in:
2019-09-09 17:41:58 +05:30
parent b09af700c9
commit 21231fcb11
+45
View File
@@ -1,6 +1,21 @@
import { FiberNode } from "./mocked-types"; import { FiberNode } from "./mocked-types";
import { isNodeNotHtmlLike } from "./utils"; import { isNodeNotHtmlLike } from "./utils";
/**
* Find node by component name, till first match.
*
* Matches against class and function name, doesn't match html-like nodes.
* Returns null if no match is found.
*
* @note Highest chance of collision, least data access needed.
* Different components with same name will collide.
* Needs access to component name.
*
* @example
* // returns FiberNode for first usage of 'AccordionMenu'
* findNodeByComponentName(startNode, "AccordionMenu");
*
*/
function findNodeByComponentName( function findNodeByComponentName(
node: FiberNode | null, node: FiberNode | null,
expectedName: string expectedName: string
@@ -29,6 +44,22 @@ function findNodeByComponentName(
return null; return null;
} }
/**
* Find node by component (i.e. class or function by reference), till first match.
*
* Matches against class and function by reference.
* Returns null if no match is found.
*
* @note Medium chance of collision, medium data access needed.
* This is safer than findNodeByComponentName, as different components with the same name won't collide.
* But, two instances of the same component will still collide.
* Needs access to component class or function.
*
* @example
* // returns FiberNode for first usage of AccordionMenu
* findNodeByComponent(startNode, AccordionMenu);
*
*/
function findNodeByComponent( function findNodeByComponent(
node: FiberNode | null, node: FiberNode | null,
expectedClassOrFunction: React.ComponentType expectedClassOrFunction: React.ComponentType
@@ -60,6 +91,20 @@ function findNodeByComponent(
return null; return null;
} }
/**
* Find node by component instance ref, till first match.
*
* Matches against class instances by reference.
* Returns null if no match is found.
*
* @note Least chance of collision, maximum data access needed.
* Needs access to component instance (through React ref usually).
*
* @example
* // menuRef=createRef(); <AccordionMenu ref={menuRef}>
* findNodeByComponentRef(startNode, menuRef.current);
*
*/
function findNodeByComponentRef( function findNodeByComponentRef(
node: FiberNode | null, node: FiberNode | null,
expectedClassInstance: React.Component expectedClassInstance: React.Component