Skip to content

[BUG] React component tests not rendering children prop #29023

Closed

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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions