Issue 1:
System info

Playwright Version: [v1.31.0]

Operating System: [All]

Browser: [All, Chromium, Firefox, WebKit]

Other info:

I am doing visual regression test with @web/test-runner and playwright library, after the playwright upgrade to 1.31.0 from 1.22.0 then screenshots started breaking due to fonts rendering change and screenshot width and height change, most of the issues are in firefox and webkit

Issue 2:
Context:

Playwright Version: @playwright/test, @playwright/experimental-ct-react, playwright 1.27.1

Operating System: PopOS 20.04 LTS

Node.js version: 19.0.0

Browser: All

Extra:

Describe the bug

My tests were just working fine until a few days ago. I have no idea what I changed to make it behave this way. I have tried removing node_modules and ./playwright/.cache/ and re-installing, but the same errors occur. I have no idea why the tests are running twice and there is no info online about the error I'm seeing.

Failed tests:

Code Snippet

One of the tests that both fails and succeeds:

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

import FolderSelector from './FolderSelector'

test.describe('has correct styles', async () => {
test('has full width', async ({ mount }) => {
const component = await mount(<FolderSelector />)

const button = component.locator('button')

await expect(component).toHaveClass(/w-full/)
await expect(button).toHaveClass(/w-full/)
})

test('has correct icon', async ({ mount }) => {
const component = await mount(<FolderSelector />)

const button = component.locator('button>svg')

await expect(button).toHaveScreenshot()
})
})

test('has correct text', async ({ mount }) => {
const component = await mount(<FolderSelector />)

const button = component.locator('button')

await expect(button).toContainText('Select Data Folder')
})

test('has file input', async ({ mount }) => {
const component = await mount(<FolderSelector />)

const input = component.locator('input')

await expect(input).toHaveAttribute('type', 'file')
})

The passing tests look completely normal:

Here's the error from the respective failing test:

playwright-ct.config.js - almost completely unchanged from default:

import type { PlaywrightTestConfig } from '@playwright/experimental-ct-react'
import { devices } from '@playwright/experimental-ct-react'

/**
* See https://playwright.dev/docs/test-configuration.
*/
const config: PlaywrightTestConfig = {
testDir: './',
/* The base directory, relative to the config file, for snapshot files created with toMatchSnapshot and toHaveScreenshot. */
snapshotDir: './__snapshots__',
/* Folders and files to ignore. */
testIgnore: ['e2e/**'],
/* Maximum time one test can run for. */
timeout: (process.env.CI ? 30 : 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,

ctViteConfig: {
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true,
},
},
},
resolve: {
alias: [{ find: /^~/, replacement: '' }],
},
},
},

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

export default config

The e2e tests on my main Electron process are working just fine and only run once like normal. I have absolutely no idea why the component tests started running twice and failing.

Thanks for any help.