fix(ct): solid render array as child (#27849)

closes:
https://github.com/microsoft/playwright/issues/27587#issuecomment-1762133376

related: https://github.com/microsoft/playwright/pull/27692

CC @dgozman

Co-authored-by: sand4rt <mbr@mbrs-MacBook-Air.local>
This commit is contained in:
Sander 2023-10-28 20:22:10 +02:00 committed by GitHub
parent 96787d2626
commit 1a34b6d211
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 16 deletions

View file

@ -73,28 +73,27 @@ async function __pwResolveComponent(component) {
await Promise.all(component.children.map(child => __pwResolveComponent(child)));
}
/**
* @param {JsxComponentChild} child
*/
function __pwCreateChild(child) {
return typeof child === 'string' ? child : __pwCreateComponent(child);
if (Array.isArray(child))
return child.map(grandChild => __pwCreateChild(grandChild));
if (isComponent(child))
return __pwCreateComponent(child);
return child;
}
/**
* @param {JsxComponent} component
*/
function __pwCreateComponent(component) {
if (typeof component !== 'object' || Array.isArray(component))
return component;
const componentFunc = __pwRegistry.get(component.type);
const children = component.children.reduce((/** @type {any[]} */ children, current) => {
const child = __pwCreateChild(current);
if (Array.isArray(child))
return child.map(grandChild => __pwCreateChild(grandChild));
if (typeof child !== 'string' || !!child.trim())
children.push(child);
return children;
}, []);
const children = component.children.map(child => __pwCreateChild(child)).filter(child => {
if (typeof child === 'string')
return !!child.trim();
return true;
});
if (!componentFunc)
return __pwH(component.type, component.props, children);

View file

@ -49,9 +49,9 @@ test('render string as child', async ({ mount }) => {
});
test('render array as child', async ({ mount }) => {
const component = await mount(<DefaultChildren>{[<h4>{[4]}</h4>,<p>2</p>]}</DefaultChildren>);
const component = await mount(<DefaultChildren>{[<h4>{[4]}</h4>,[[<p>[2,3]</p>]]]}</DefaultChildren>);
await expect(component.getByRole('heading', { level: 4 })).toHaveText('4');
await expect(component.getByRole('paragraph')).toHaveText('2');
await expect(component.getByRole('paragraph')).toHaveText('[2,3]');
});
test('render number as child', async ({ mount }) => {