[BUG] React component tests not rendering children prop #29023
Description
System info
- Playwright Version: v1.4.0, v1.40.1, v1.41.0
- Operating System: All
- Browser: Chromium
- Other info: -
Source code
import { test } from '@playwright/experimental-ct-react';
test('renders children from props object', async ({ mount, page }) => { // this fails since v1.40.0
const props = { children: 'test' };
await mount(<button {...props} />);
await expect(page.getByText('test')).toBeInViewport();
});
test('renders children from jsx', async ({ mount, page }) => { // this works
await mount(<button>test</button>);
await expect(page.getByText('test')).toBeInViewport();
});Steps
- Run the test
Expected
Up to v1.39.0:
Running 2 tests using 2 workers
✓ 1 [chromium] › test.tsx:10:5 › renders children from jsx (395ms)
✓ 2 [chromium] › test.tsx:3:5 › renders children from props object (396ms)
2 passed
Actual
Running 2 tests using 2 workers
✓ 1 [chromium] › test.tsx:10:5 › renders children from jsx (393ms)
✘ 2 [chromium] › test.tsx:3:5 › renders children from props object (5.0s)
1) [chromium] › test.tsx:3:5 › renders children from props object
Test timeout of 5000ms exceeded.
Error: expect(locator).toBeInViewport()
Locator: getByText('test')
Expected: in viewport
Received: outside viewport