Issue 1:
System info

Playwright Version: v1.33.0

Operating System: macOS 12.6.5

Browser: All

Other info: Node 16.13.0, React 18.2

Source code

I provided exact source code that allows reproducing the issue locally.

Config file

import { defineConfig, devices } from '@playwright/experimental-ct-react';

/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './',
/* The base directory, relative to the config file, for snapshot files created with toMatchSnapshot and toHaveScreenshot. */
snapshotDir: './__snapshots__',
/* Maximum time one test can run for. */
timeout: 10 * 1000,
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',

/* Port to use for Playwright component endpoint. */
ctPort: 3100,
},

/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
],
});

Test file (self-contained)

import { test, expect } from '@playwright/experimental-ct-react';
import App from './App';

test.use({ viewport: { width: 500, height: 500 } });

test('should work', async ({ mount }) => {
const component = await mount(<App />);
await expect(component).toContainText('Learn React');
});

Steps

Follow the How to get started steps to set up for component testing

Install react and react-dom manually (not included with template)

Add src/App.tsx file manually (not included with template)

npm run test-ct

Expected

Tests transpile successfully and execute.

Actual

All tests fail with the following error:

ReferenceError: React is not defined

5 |
6 | test('should work', async ({ mount }) => {
> 7 | const component = await mount(<App />);
| ^
8 | await expect(component).toContainText('Learn React');
9 | });

Issue 2:
System info

Playwright Version: [v1.32.3]

Operating System: [All]

Other info: GitLab pipeline

Source code

For importing the results from my GitLab pipeline I use the extended Junit reporter which was fine so far.

All tests do have an test_key annotation with an already existing Test-Issue in Xray.

Config according to docs

// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';

const xrayOptions = {
textContentAnnotations: ['test_description'],
outputFile: './xray-report.xml'
};

export default defineConfig({
reporter: [['junit', xrayOptions]]
});

Test file

test.describe.skip('ui tests @gui', () => {
test('Some test', async ({ page }) => {
test.info().annotations.push({ type: 'test_key', description: 'ABCD-166' })
// ..test code
})
})

Expected

When the group is being skipped, all the contained tests are transferred with status ToDo to an Xray execution and no new test issues are created. No creation because of the existing test_key annotation and already existing corresponding test issues in Xray is the expected flow

Actual

All the tests within an skipped test.describe() group unnecessarily generate new test issues in Xray and an execution with run status ToDo. The existing test issues are being ignored instead of using them for attaching and linking the execution results, in this case ToDo.