@hubspot/ui-extensions 0.11.2 → 0.11.4

package/dist/experimental/testing/internal/query.d.ts

@@ -1,6 +1,6 @@
-import type { HubSpotReactComponent, UnknownComponentProps } from '../../../__synced__/types/shared.synced';
-import type { ElementMatcher, RenderedElementNode } from '../types';
-import type { RenderedParentNodeInternal } from './types-internal';
+import type { HubSpotReactComponent, UnknownComponentProps } from '../../../shared/types/shared.ts';
+import type { ElementMatcher, RenderedElementNode } from '../types.ts';
+import type { RenderedDocumentInternal, RenderedParentNodeInternal } from './types-internal.ts';
 /**
  * Finds the first descendant element node that matches the given component.
  *
@@ -9,7 +9,7 @@ import type { RenderedParentNodeInternal } from './types-internal';
  * @param matcher An optional matcher to filter the elements.
  * @returns The first element node that matches the given component or `null` if no match is found.
  */
-export declare const maybeFind: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps> | null;
+export declare const maybeFind: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps> | null;
 /**
  * Finds the first descendant element node that matches the given component.
  *
@@ -18,7 +18,7 @@ export declare const maybeFind: <TProps extends UnknownComponentProps>(parentNod
  * @param matcher An optional matcher to filter the elements.
  * @returns The first element node that matches the given component.
  */
-export declare const find: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps>;
+export declare const find: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps>;
 /**
  * Finds all descendant element nodes that match the given component.
  *
@@ -27,7 +27,7 @@ export declare const find: <TProps extends UnknownComponentProps>(parentNode: Re
  * @param matcher An optional matcher to filter the elements.
  * @returns An array of element nodes that match the given component.
  */
-export declare const findAll: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps>[];
+export declare const findAll: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps>[];
 /**
  * Finds the first direct child element node that matches the given component.
  *
@@ -36,7 +36,7 @@ export declare const findAll: <TProps extends UnknownComponentProps>(parentNode:
  * @param matcher An optional matcher to filter the elements.
  * @returns The first child element node that matches the given component.
  */
-export declare const findChild: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps>;
+export declare const findChild: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps>;
 /**
  * Finds the first direct child element node that matches the given component.
  *
@@ -45,7 +45,7 @@ export declare const findChild: <TProps extends UnknownComponentProps>(parentNod
  * @param matcher An optional matcher to filter the elements.
  * @returns The first child element node that matches the given component.
  */
-export declare const maybeFindChild: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps> | null;
+export declare const maybeFindChild: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps> | null;
 /**
  * Finds all direct child element nodes that match the given component.
  *
@@ -54,4 +54,14 @@ export declare const maybeFindChild: <TProps extends UnknownComponentProps>(pare
  * @param matcher An optional matcher to filter the elements.
  * @returns An array of child element nodes that match the given component.
  */
-export declare const findAllChildren: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps> | undefined) => RenderedElementNode<TProps>[];
+export declare const findAllChildren: <TProps extends UnknownComponentProps>(parentNode: RenderedParentNodeInternal, targetComponent: HubSpotReactComponent<TProps>, matcher?: ElementMatcher<TProps>) => RenderedElementNode<TProps>[];
+/**
+ * Finds the first descendant element node that matches the given component and test ID.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param testId The test ID to find.
+ * @returns The first element node that matches the given component and test ID.
+ */
+export declare const maybeFindByTestId: <TProps extends UnknownComponentProps>(document: RenderedDocumentInternal, targetComponent: HubSpotReactComponent<TProps>, testId: string) => RenderedElementNode<TProps> | null;
+export declare const findByTestId: <TProps extends UnknownComponentProps>(document: RenderedDocumentInternal, targetComponent: HubSpotReactComponent<TProps>, testId: string) => RenderedElementNode<TProps>;

package/dist/experimental/testing/internal/query.js

@@ -1,7 +1,8 @@
-import { __hubSpotComponentRegistry } from '../../../__synced__/remoteComponents.synced';
-import { isRenderedElementNode, isRenderedFragmentNode } from '../type-utils';
-import { ComponentNotFoundError, FindInvalidComponentError, InvalidComponentsError, } from './errors';
-import { checkElementMatches } from './match';
+import { __hubSpotComponentRegistry } from "../../../shared/remoteComponents.js";
+import { isRenderedElementNode } from "../type-utils.js";
+import { ComponentMismatchedByTestIdError, ComponentNotFoundByTestIdError, ComponentNotFoundError, FindInvalidComponentError, InvalidComponentsError, } from "./errors.js";
+import { checkElementMatches } from "./match.js";
+import { asRenderedParentNode } from "./type-utils-internal.js";
 const addMatchToFindResult = (findResult, match, options) => {
     if (options.findFirstOnly) {
         findResult.match = match;
@@ -19,32 +20,32 @@ const addMatchToFindResult = (findResult, match, options) => {
  * @param findResult The find result to mutate.
  */
 const findInternalHelper = (parentNode, options, findResult) => {
-    const { children } = parentNode;
+    const { childNodes } = parentNode;
     const { targetComponent, matcher, findFirstOnly, findDirectChildrenOnly } = options;
     const targetComponentName = __hubSpotComponentRegistry.getComponentName(targetComponent);
-    for (const child of children) {
-        if (!isRenderedElementNode(child)) {
+    for (const childNode of childNodes) {
+        if (!isRenderedElementNode(childNode)) {
             // Skip over non-element child nodes (just text nodes)
             continue;
         }
-        if (child.name === targetComponentName &&
-            checkElementMatches(child, matcher)) {
+        if (childNode.name === targetComponentName &&
+            checkElementMatches(childNode, matcher)) {
             // We found a match, so add it to the find result
-            addMatchToFindResult(findResult, child, options);
+            addMatchToFindResult(findResult, childNode, options);
             if (findFirstOnly) {
                 return;
             }
         }
-        // We only search in nested children and fragment props if we're not only looking for children
+        // We only search in nested child nodes and fragment props if we're not only looking for children
         if (!findDirectChildrenOnly) {
             // Search for the component in the fragment props
-            const { props } = child;
-            const fragmentProps = __hubSpotComponentRegistry.getComponentFragmentPropNames(child.name);
+            const { props } = childNode;
+            const fragmentProps = __hubSpotComponentRegistry.getComponentFragmentPropNames(childNode.name);
             for (const fragmentPropName of fragmentProps) {
                 const maybeFragment = props[fragmentPropName];
                 // NOTE: As part of the conversion process of converting remote nodes to rendered nodes, we
                 //       create a RenderedFragmentNode for each fragment prop and put that into the props object.
-                if (isRenderedFragmentNode(maybeFragment)) {
+                if (maybeFragment) {
                     findInternalHelper(maybeFragment, options, findResult);
                     if (findFirstOnly && findResult.match) {
                         return;
@@ -52,7 +53,7 @@ const findInternalHelper = (parentNode, options, findResult) => {
                 }
             }
             // Search for the component in the child
-            findInternalHelper(child, options, findResult);
+            findInternalHelper(childNode, options, findResult);
             if (findFirstOnly && findResult.match) {
                 return;
             }
@@ -60,6 +61,22 @@ const findInternalHelper = (parentNode, options, findResult) => {
     }
     return;
 };
+const validateComponent = (targetComponent, findMethodName) => {
+    const targetComponentName = __hubSpotComponentRegistry.getComponentName(targetComponent);
+    if (!targetComponentName) {
+        throw new FindInvalidComponentError({
+            findMethodName,
+        });
+    }
+    return {
+        targetComponentName,
+    };
+};
+const validateRenderedDocument = (document) => {
+    if (document.hasInvalidComponentNames()) {
+        throw new InvalidComponentsError(document.rootNode);
+    }
+};
 /**
  * Internal utility that centralizes finding elements in the rendered tree (including error handling).
  *
@@ -70,28 +87,19 @@ const findInternalHelper = (parentNode, options, findResult) => {
 const findInternal = (parentNode, options) => {
     const { document } = parentNode;
     const { targetComponent, findMethodName, shouldThrowErrorIfNotFound } = options;
-    const targetComponentName = __hubSpotComponentRegistry.getComponentName(targetComponent);
-    if (!targetComponentName) {
-        throw new FindInvalidComponentError({
-            findMethodName,
-        });
-    }
-    // We always validate the document before running the find operation since the document may
-    // have been updated asynchronously in the background.
-    if (document.hasInvalidComponentNames()) {
-        throw new InvalidComponentsError(document.rootNode);
-    }
+    const { targetComponentName } = validateComponent(targetComponent, findMethodName);
+    validateRenderedDocument(document);
     // Initialize the find result that will be mutated in place
     const findResult = {
         match: null,
         allMatches: [],
     };
     // Run the internal find helper to recursively search the rendered tree
-    findInternalHelper(parentNode, options, findResult);
+    findInternalHelper(asRenderedParentNode(parentNode), options, findResult);
     if (findResult.match === null && shouldThrowErrorIfNotFound) {
         throw new ComponentNotFoundError({
             findMethodName: options.findMethodName,
-            parentNode,
+            parentNode: asRenderedParentNode(parentNode),
             componentName: targetComponentName,
         });
     }
@@ -211,3 +219,58 @@ export const findAllChildren = (parentNode, targetComponent, matcher) => {
     });
     return allMatches;
 };
+const findByTestIdHelper = (options) => {
+    const { document, targetComponent, testId, findMethodName, shouldThrowErrorIfNotFound, } = options;
+    const { targetComponentName } = validateComponent(targetComponent, findMethodName);
+    validateRenderedDocument(document);
+    const matchingElement = document.testIdToElementMap.get(testId);
+    if (!matchingElement) {
+        if (shouldThrowErrorIfNotFound) {
+            throw new ComponentNotFoundByTestIdError({
+                findMethodName,
+                componentName: targetComponentName,
+                testId,
+                rootNode: document.rootNode,
+            });
+        }
+        return null;
+    }
+    if (!matchingElement.isMatch(targetComponent)) {
+        throw new ComponentMismatchedByTestIdError({
+            findMethodName,
+            actualComponentName: matchingElement.name,
+            expectedComponentName: targetComponentName,
+            testId,
+            rootNode: document.rootNode,
+        });
+    }
+    return matchingElement;
+};
+/**
+ * Finds the first descendant element node that matches the given component and test ID.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param testId The test ID to find.
+ * @returns The first element node that matches the given component and test ID.
+ */
+export const maybeFindByTestId = (document, targetComponent, testId) => {
+    const maybeMatchingElement = findByTestIdHelper({
+        document,
+        targetComponent,
+        testId,
+        findMethodName: 'maybeFindByTestId',
+        shouldThrowErrorIfNotFound: false,
+    });
+    return maybeMatchingElement;
+};
+export const findByTestId = (document, targetComponent, testId) => {
+    const matchingElement = findByTestIdHelper({
+        document,
+        targetComponent,
+        testId,
+        findMethodName: 'findByTestId',
+        shouldThrowErrorIfNotFound: true,
+    });
+    return matchingElement;
+};

package/dist/experimental/testing/internal/root.d.ts

@@ -1,4 +1,4 @@
-import type { RenderedDocumentInternal, RenderedRootNodeInternal } from './types-internal';
+import type { RenderedDocumentInternal, RenderedRootNodeInternal } from './types-internal.ts';
 /**
  * Creates a rendered root node.
  *

package/dist/experimental/testing/internal/root.js

@@ -1,8 +1,9 @@
-import { RenderedNodeType } from '../types';
-import { EMPTY_CHILDREN } from './constants';
-import { debugLog } from './debug';
-import { printNode } from './print';
-import { find, findAll, findAllChildren, findChild, maybeFind, maybeFindChild, } from './query';
+import { RenderedNodeType } from "../types.js";
+import { EMPTY_RENDERED_CHILD_NODES } from "./constants.js";
+import { debugLog } from "./debug.js";
+import { printNode } from "./print.js";
+import { find, findAll, findAllChildren, findChild, maybeFind, maybeFindChild, } from "./query.js";
+import { asRenderedNode } from "./type-utils-internal.js";
 /**
  * Creates a rendered root node.
  *
@@ -13,10 +14,10 @@ export const createRootNode = (document) => {
     const rootNode = {
         nodeType: RenderedNodeType.Root,
         text: null,
-        children: EMPTY_CHILDREN,
+        childNodes: EMPTY_RENDERED_CHILD_NODES,
         document,
         debugLog: (label) => {
-            debugLog(rootNode, label);
+            debugLog(asRenderedNode(rootNode), label);
         },
         find: (targetComponent, matcher) => {
             return find(rootNode, targetComponent, matcher);
@@ -37,7 +38,10 @@ export const createRootNode = (document) => {
             return maybeFindChild(rootNode, targetComponent, matcher);
         },
         toString: () => {
-            return printNode(rootNode);
+            return printNode(asRenderedNode(rootNode));
+        },
+        isMatch(__component, __matcher) {
+            return false;
         },
     };
     return rootNode;

package/dist/experimental/testing/internal/text.d.ts

@@ -1,9 +1,10 @@
 import { type RemoteRoot, type RemoteText } from '@remote-ui/core';
-import { type RenderedTextNode } from '../types';
+import { RenderedTextNode } from '../types.ts';
+import { RenderedDocumentInternal } from './types-internal.ts';
 /**
  * Creates a rendered text node.
  *
  * @param remoteText The remote text node or string to create a text node from.
  * @returns A rendered text node.
  */
-export declare const createTextNode: (remoteText: RemoteText<RemoteRoot> | string) => RenderedTextNode;
+export declare const createTextNode: (document: RenderedDocumentInternal, remoteText: RemoteText<RemoteRoot> | string) => RenderedTextNode;

package/dist/experimental/testing/internal/text.js

@@ -1,16 +1,25 @@
-import { RenderedNodeType } from '../types';
+import { RenderedNodeType } from "../types.js";
+import { debugLog } from "./debug.js";
+import { asRenderedNode, asRenderedTextNode } from "./type-utils-internal.js";
 /**
  * Creates a rendered text node.
  *
  * @param remoteText The remote text node or string to create a text node from.
  * @returns A rendered text node.
  */
-export const createTextNode = (remoteText) => {
+export const createTextNode = (document, remoteText) => {
     const text = typeof remoteText === 'string' ? remoteText : remoteText.text;
     const textNode = {
+        document,
         nodeType: RenderedNodeType.Text,
         text,
         toString: () => text,
+        debugLog: (label) => {
+            debugLog(asRenderedNode(textNode), label);
+        },
+        isMatch(__component, __matcher) {
+            return false;
+        },
     };
-    return textNode;
+    return asRenderedTextNode(textNode);
 };

package/dist/experimental/testing/internal/type-utils-internal.d.ts

@@ -0,0 +1,44 @@
+import { RenderedElementNode, RenderedFragmentNode, RenderedNode, RenderedParentNode, RenderedRootNode, RenderedTextNode } from '../types.ts';
+import { RenderedElementNodeInternal, RenderedFragmentNodeInternal, RenderedNodeInternal, RenderedRootNodeInternal, RenderedParentNodeInternal, RenderedTextNodeInternal } from './types-internal.ts';
+/**
+ * Converts an internal rendered node to a public rendered node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedNode: (node: RenderedNodeInternal) => RenderedNode;
+/**
+ * Converts an internal rendered element node to a public rendered element node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedElementNode: (node: RenderedElementNodeInternal) => RenderedElementNode;
+/**
+ * Converts an internal rendered fragment node to a public rendered fragment node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedFragmentNode: (node: RenderedFragmentNodeInternal) => RenderedFragmentNode;
+/**
+ * Converts an internal rendered text node to a public rendered text node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedTextNode: (node: RenderedTextNodeInternal) => RenderedTextNode;
+/**
+ * Converts an internal rendered root node to a public rendered root node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedRootNode: (node: RenderedRootNodeInternal) => RenderedRootNode;
+/**
+ * Converts an internal rendered parent node to a public rendered parent node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export declare const asRenderedParentNode: (node: RenderedParentNodeInternal) => RenderedParentNode;

package/dist/experimental/testing/internal/type-utils-internal.js

@@ -0,0 +1,54 @@
+/**
+ * Converts an internal rendered node to a public rendered node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedNode = (node) => {
+    return node;
+};
+/**
+ * Converts an internal rendered element node to a public rendered element node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedElementNode = (node) => {
+    return node;
+};
+/**
+ * Converts an internal rendered fragment node to a public rendered fragment node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedFragmentNode = (node) => {
+    return node;
+};
+/**
+ * Converts an internal rendered text node to a public rendered text node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedTextNode = (node) => {
+    return node;
+};
+/**
+ * Converts an internal rendered root node to a public rendered root node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedRootNode = (node) => {
+    return node;
+};
+/**
+ * Converts an internal rendered parent node to a public rendered parent node using a type assertion.
+ *
+ * @param node The node to convert.
+ * @returns The converted node.
+ */
+export const asRenderedParentNode = (node) => {
+    return node;
+};

package/dist/experimental/testing/internal/types-internal.d.ts

@@ -1,5 +1,8 @@
 import type { RemoteComponent, RemoteFragment, RemoteRoot, RemoteText } from '@remote-ui/core';
-import type { RenderedElementNode, RenderedFragmentNode, RenderedNode, RenderedParentNode, RenderedRootNode, RenderedTextNode } from '../types';
+import { ExtensionPointApi, ExtensionPointLocation } from '../../../shared/types/extension-points.ts';
+import { HubSpotReactComponent, UnknownComponentProps } from '../../../shared/types/shared.ts';
+import { useAssociations, useCrmProperties } from '../../../crm/index.ts';
+import type { ElementMatcher, RenderedElementNode, RenderedFragmentNode, RenderedNode, RenderedParentNode, RenderedRootNode, RenderedTextNode } from '../types.ts';
 export type RemoteChildNode = RemoteComponent<any, RemoteRoot> | RemoteText<RemoteRoot>;
 export type RemoteParentNode = RemoteRoot | RemoteComponent<any, RemoteRoot> | RemoteFragment;
 /**
@@ -31,17 +34,32 @@ export interface RenderedDocumentInternal {
      * @param run The function to execute.
      */
     batchUpdate: (run: () => void) => void;
+    /**
+     * A lookup map of test IDs to elements.
+     */
+    testIdToElementMap: Map<string, RenderedElementNode<UnknownComponentProps>>;
 }
 /**
  * Adds the `document` property to the rendered node. We do not include this in the public types because it is not
  * part of the public API, but we need it for internal use.
  */
-type MakeRenderedNodeInternal<TRenderedNode extends RenderedNode> = TRenderedNode & {
+type MakeRenderedNodeInternal<TRenderedNode extends RenderedNode> = Omit<TRenderedNode, 'isMatch'> & {
     document: RenderedDocumentInternal;
+    isMatch(component: HubSpotReactComponent, matcher?: ElementMatcher<UnknownComponentProps>): boolean;
 };
 export type RenderedElementNodeInternal = MakeRenderedNodeInternal<RenderedElementNode>;
 export type RenderedTextNodeInternal = MakeRenderedNodeInternal<RenderedTextNode>;
 export type RenderedRootNodeInternal = MakeRenderedNodeInternal<RenderedRootNode>;
 export type RenderedFragmentNodeInternal = MakeRenderedNodeInternal<RenderedFragmentNode>;
 export type RenderedParentNodeInternal = MakeRenderedNodeInternal<RenderedParentNode>;
+export type RenderedNodeInternal = RenderedElementNodeInternal | RenderedTextNodeInternal | RenderedRootNodeInternal | RenderedFragmentNodeInternal;
+/**
+ * An object containing the mocks for the various functions that can be mocked.
+ */
+export interface RendererMockHooksInternal {
+    useCrmProperties: typeof useCrmProperties;
+    useAssociations: typeof useAssociations;
+}
+export type RendererMocksInternal<TExtensionPointLocationName extends ExtensionPointLocation = ExtensionPointLocation> = RendererMockHooksInternal & ExtensionPointApi<TExtensionPointLocationName>;
+export type AnyFunction = (...args: any[]) => any;
 export {};

package/dist/experimental/testing/render.d.ts

@@ -1,9 +1,35 @@
-import { type ReactNode } from 'react';
-import { type RenderResult } from './types';
+import { ExtensionPointLocation } from '../../shared/types/extension-points.ts';
+import { Renderer } from './types.ts';
 /**
- * Renders a UI extension component using React so that assertions can be made against the rendered output.
+ * Creates a renderer object with methods for rendering and testing UI extension components.
+ * Mocks for supported React hooks and the Extension Point API are automatically provided based on the extension point location.
  *
- * @param node The React node to render.
- * @returns A render result object that can be used to query the rendered DOM.
+ * Example usage:
+ *
+ * ```tsx
+ * import { createRenderer } from '@hubspot/ui-extensions/testing';
+ * import { Alert, Button, ButtonRow } from '@hubspot/ui-extensions';
+ *
+ * const { render, find } = createRenderer('crm.record.tab');
+ * render(
+ *   <>
+ *   <ButtonRow>
+ *     <Button variant="secondary">Button 1</Button>
+ *     <Button variant="primary">Button 2</Button>
+ *   </ButtonRow>
+ *   <Alert title="My Alert" />
+ * </>
+ * );
+ *
+ * // Find any button
+ * const button = find(Button);
+ *
+ * // Assertions
+ * expect(button.props.variant).toEqual('primary');
+ * expect(button.text).toEqual('Button 2');
+ * ```
+ *
+ * @param extensionPointLocation The extension point location.
+ * @returns A renderer object with methods for rendering and testing UI extension components.
  */
-export declare const render: (node: ReactNode) => RenderResult;
+export declare const createRenderer: <TExtensionPointLocation extends ExtensionPointLocation>(extensionPointLocation: TExtensionPointLocation) => Renderer<TExtensionPointLocation>;