@playwright/experimental-ct-react 1.41.0 → 1.41.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playwright/experimental-ct-react",
-  "version": "1.41.0",
+  "version": "1.41.1",
   "description": "Playwright Component Testing for React",
   "repository": {
     "type": "git",
@@ -29,7 +29,7 @@
     }
   },
   "dependencies": {
-    "@playwright/experimental-ct-core": "1.41.0",
+    "@playwright/experimental-ct-core": "1.41.1",
     "@vitejs/plugin-react": "^4.0.0"
   },
   "bin": {

package/registerSource.mjs

@@ -17,130 +17,38 @@
 // @ts-check
 // This file is injected into the registry as text, no dependencies are allowed.
 
-import * as __pwReact from 'react';
+import __pwReact from 'react';
 import { createRoot as __pwCreateRoot } from 'react-dom/client';
-
-/** @typedef {import('../playwright-ct-core/types/component').JsxComponentChild} JsxComponentChild */
 /** @typedef {import('../playwright-ct-core/types/component').JsxComponent} JsxComponent */
-/** @typedef {import('react').FunctionComponent} FrameworkComponent */
 
-/** @type {Map<string, () => Promise<FrameworkComponent>>} */
-const __pwLoaderRegistry = new Map();
-/** @type {Map<string, FrameworkComponent>} */
-const __pwRegistry = new Map();
 /** @type {Map<Element, import('react-dom/client').Root>} */
 const __pwRootRegistry = new Map();
 
-/**
- * @param {Record<string, () => Promise<FrameworkComponent>>} components
- */
-export function pwRegister(components) {
-  for (const [name, value] of Object.entries(components))
-    __pwLoaderRegistry.set(name, value);
-}
-
 /**
  * @param {any} component
  * @returns {component is JsxComponent}
  */
-function isComponent(component) {
-  return component.__pw_component_marker === true && component.kind === 'jsx';
+function isJsxComponent(component) {
+  return typeof component === 'object' && component && component.__pw_type === 'jsx';
 }
 
 /**
- * @param {JsxComponent | JsxComponentChild} component
+ * @param {any} value
  */
-async function __pwResolveComponent(component) {
-  if (!isComponent(component))
-    return;
-
-  let componentFactory = __pwLoaderRegistry.get(component.type);
-  if (!componentFactory) {
-    // Lookup by shorthand.
-    for (const [name, value] of __pwLoaderRegistry) {
-      if (component.type.endsWith(`_${name}`)) {
-        componentFactory = value;
-        break;
-      }
+function __pwRender(value) {
+  return window.__pwTransformObject(value, v => {
+    if (isJsxComponent(v)) {
+      const component = v;
+      const props = component.props ? __pwRender(component.props) : {};
+      return { result: __pwReact.createElement(/** @type { any } */ (component.type), { ...props, children: undefined }, props.children) };
     }
-  }
-
-  if (!componentFactory && component.type[0].toUpperCase() === component.type[0])
-    throw new Error(`Unregistered component: ${component.type}. Following components are registered: ${[...__pwRegistry.keys()]}`);
-
-  if (componentFactory)
-    __pwRegistry.set(component.type, await componentFactory());
-
-  if (component.children?.length)
-    await Promise.all(component.children.map(child => __pwResolveComponent(child)));
-
-  if (component.props)
-    await __resolveProps(component.props);
-}
-
-/**
-  * @param {Record<string, any>} props
-  */
-async function __resolveProps(props) {
-  for (const prop of Object.values(props)) {
-    if (Array.isArray(prop))
-      await Promise.all(prop.map(child => __pwResolveComponent(child)));
-    else if (isComponent(prop))
-      await __pwResolveComponent(prop);
-    else if (typeof prop === 'object' && prop !== null)
-      await __resolveProps(prop);
-  }
-}
-
-/**
- * @param {JsxComponentChild} child
- */
-function __renderChild(child) {
-  if (Array.isArray(child))
-    return child.map(grandChild => __renderChild(grandChild));
-  if (isComponent(child))
-    return __pwRender(child);
-  return child;
-}
-
-/**
-  * @param {Record<string, any>} props
-  */
-function __renderProps(props) {
-  const newProps = {};
-  for (const [key, prop] of Object.entries(props)) {
-    if (Array.isArray(prop))
-      newProps[key] = prop.map(child => __renderChild(child));
-    else if (isComponent(prop))
-      newProps[key] = __renderChild(prop);
-    else if (typeof prop === 'object' && prop !== null)
-      newProps[key] = __renderProps(prop);
-    else
-      newProps[key] = prop;
-  }
-  return newProps;
-}
-
-/**
- * @param {JsxComponent} component
- */
-function __pwRender(component) {
-  const componentFunc = __pwRegistry.get(component.type);
-  const props = __renderProps(component.props || {});
-  const children = component.children?.map(child => __renderChild(child)).filter(child => {
-    if (typeof child === 'string')
-      return !!child.trim();
-    return true;
   });
-  const reactChildren = Array.isArray(children) && children.length === 1 ? children[0] : children;
-  return __pwReact.createElement(componentFunc || component.type, props, reactChildren);
 }
 
 window.playwrightMount = async (component, rootElement, hooksConfig) => {
-  if (component.kind !== 'jsx')
+  if (!isJsxComponent(component))
     throw new Error('Object mount notation is not supported');
 
-  await __pwResolveComponent(component);
   let App = () => __pwRender(component);
   for (const hook of window.__pw_hooks_before_mount || []) {
     const wrapper = await hook({ App, hooksConfig });
@@ -171,10 +79,9 @@ window.playwrightUnmount = async rootElement => {
 };
 
 window.playwrightUpdate = async (rootElement, component) => {
-  if (component.kind !== 'jsx')
+  if (!isJsxComponent(component))
     throw new Error('Object mount notation is not supported');
 
-  await __pwResolveComponent(component);
   const root = __pwRootRegistry.get(rootElement);
   if (root === undefined)
     throw new Error('Component was not mounted');