<p dir="auto">Playwright transpiles test files with Babel. However, by default, Babel reads browserslist config although Playwright actually doesn't need it. This introduces conflicts when the root project uses browserslist.</p>
<p dir="auto">For example, when the package.json contains:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  &quot;browserslist&quot;: [
    &quot;chrome 113&quot;
  ],"><pre class="notranslate"><code class="notranslate">  "browserslist": [
    "chrome 113"
  ],
</code></pre></div>
<p dir="auto">Running <code class="notranslate">npx playwright test</code> with Playwright 1.32 will get <code class="notranslate">Error: Unknown version 113 of chrome</code>. To fix the issue, we have to upgrade Playwright to 1.33. This behavior forces us to always upgrade Playwright if we want to specify some latest browser versions in browserslist config even if our root project depends on the latest version of browserslist.</p>
<p dir="auto">To fix this issue, the following change works for me:</p>
<div class="highlight highlight-source-diff notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="diff --git a/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts b/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts
index 0f4ab2979..2a9b24624 100644
--- a/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts
+++ b/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts
@@ -76,6 +76,7 @@ function babelTransformOptions(isTypeScript: boolean, isModule: boolean, plugins
   }

   return {
+    browserslistConfigFile: false,
     babelrc: false,
     configFile: false,
     assumptions: {"><pre class="notranslate"><span class="pl-c1">diff --git a/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts b/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts</span>
index 0f4ab2979..2a9b24624 100644
<span class="pl-md">--- a/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts</span>
<span class="pl-mi1">+++ b/packages/playwright-test/bundles/babel/src/babelBundleImpl.ts</span>
<span class="pl-mdr">@@ -76,6 +76,7 @@</span> function babelTransformOptions(isTypeScript: boolean, isModule: boolean, plugins
   }

   return {
<span class="pl-mi1"><span class="pl-mi1">+</span>    browserslistConfigFile: false,</span>
     babelrc: false,
     configFile: false,
     assumptions: {</pre></div>




<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: 1.33.0</li>
<li>Operating System: macOS 13</li>
<li>Browser: All</li>
</ul>
<h3 dir="auto">Source code</h3>
<p dir="auto">package.json:</p>
<div class="highlight highlight-source-json notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
  &quot;name&quot;: &quot;playwright-babel-demo&quot;,
  &quot;browserslist&quot;: [
    &quot;chrome 119&quot;
  ],
  &quot;devDependencies&quot;: {
    &quot;@playwright/test&quot;: &quot;^1.33.0&quot;
  }
}"><pre class="notranslate">{
  <span class="pl-ent">"name"</span>: <span class="pl-s"><span class="pl-pds">"</span>playwright-babel-demo<span class="pl-pds">"</span></span>,
  <span class="pl-ent">"browserslist"</span>: [
    <span class="pl-s"><span class="pl-pds">"</span>chrome 119<span class="pl-pds">"</span></span>
  ],
  <span class="pl-ent">"devDependencies"</span>: {
    <span class="pl-ent">"@playwright/test"</span>: <span class="pl-s"><span class="pl-pds">"</span>^1.33.0<span class="pl-pds">"</span></span>
  }
}</pre></div>
<p dir="auto">tests/test.spec.ts</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import { test, expect } from '@playwright/test';

test('has title', async ({ page }) =&gt; {
  await page.goto('https://playwright.dev/');

  // Expect a title &quot;to contain&quot; a substring.
  await expect(page).toHaveTitle(/Playwright/);
});"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">test</span><span class="pl-kos">,</span> <span class="pl-s1">expect</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'@playwright/test'</span><span class="pl-kos">;</span>

<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'has title'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span> page <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-k">await</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">goto</span><span class="pl-kos">(</span><span class="pl-s">'https://playwright.dev/'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

  <span class="pl-c">// Expect a title "to contain" a substring.</span>
  <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">page</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toHaveTitle</span><span class="pl-kos">(</span><span class="pl-pds"><span class="pl-c1">/</span>Playwright<span class="pl-c1">/</span></span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto"><strong>Steps</strong></p>
<ul dir="auto">
<li>Create the two files as listed above.</li>
<li>Run <code class="notranslate">npx playwright test</code>.</li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">The tests run successfully.</p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">It shows an error:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="$ npx playwright test


Error: Unknown version 119 of chrome



Error: No tests found"><pre class="notranslate"><code class="notranslate">$ npx playwright test


Error: Unknown version 119 of chrome



Error: No tests found
</code></pre></div>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: 1.31.2</li>
</ul>
<h3 dir="auto">Source code</h3>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I provided exact source code that allows reproducing the issue locally.</li>
</ul>




<p dir="auto"><a href="https://github.com/esau-morais/next-movies/blob/main/.github/workflows/playwright.yml">Repo</a></p>
<div class="highlight highlight-source-yaml notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="name: Playwright Tests
on:
  push:
    branches:
      - main

jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: pnpm/action-setup@v2
      with:
        version: 6.32.9
    - uses: actions/setup-node@v3
      with:
        node-version: '18'
        cache: 'pnpm'
    - name: Install dependencies
      run: pnpm install --frozen-lockfile
    - name: Install Playwright Browsers
      run: pnpm exec playwright install --with-deps
    - name: Run Playwright tests
      env:
        NEXT_PUBLIC_API_BASE_URL: ${{ secrets.NEXT_PUBLIC_API_BASE_URL }}
        API_KEY: ${{ secrets.API_KEY }}
      run: pnpm exec playwright test
    - uses: actions/upload-artifact@v3
      if: always()
      with:
        name: playwright-report
        path: playwright-report/
        retention-days: 30"><pre class="notranslate"><span class="pl-ent">name</span>: <span class="pl-s">Playwright Tests</span>
<span class="pl-ent">on</span>:
  <span class="pl-ent">push</span>:
    <span class="pl-ent">branches</span>:
      - <span class="pl-s">main</span>

<span class="pl-ent">jobs</span>:
  <span class="pl-ent">test</span>:
    <span class="pl-ent">timeout-minutes</span>: <span class="pl-c1">60</span>
    <span class="pl-ent">runs-on</span>: <span class="pl-s">ubuntu-latest</span>
    <span class="pl-ent">steps</span>:
    - <span class="pl-ent">uses</span>: <span class="pl-s">actions/checkout@v3</span>
    - <span class="pl-ent">uses</span>: <span class="pl-s">pnpm/action-setup@v2</span>
      <span class="pl-ent">with</span>:
        <span class="pl-ent">version</span>: <span class="pl-s">6.32.9</span>
    - <span class="pl-ent">uses</span>: <span class="pl-s">actions/setup-node@v3</span>
      <span class="pl-ent">with</span>:
        <span class="pl-ent">node-version</span>: <span class="pl-s"><span class="pl-pds">'</span>18<span class="pl-pds">'</span></span>
        <span class="pl-ent">cache</span>: <span class="pl-s"><span class="pl-pds">'</span>pnpm<span class="pl-pds">'</span></span>
    - <span class="pl-ent">name</span>: <span class="pl-s">Install dependencies</span>
      <span class="pl-ent">run</span>: <span class="pl-s">pnpm install --frozen-lockfile</span>
    - <span class="pl-ent">name</span>: <span class="pl-s">Install Playwright Browsers</span>
      <span class="pl-ent">run</span>: <span class="pl-s">pnpm exec playwright install --with-deps</span>
    - <span class="pl-ent">name</span>: <span class="pl-s">Run Playwright tests</span>
      <span class="pl-ent">env</span>:
        <span class="pl-ent">NEXT_PUBLIC_API_BASE_URL</span>: <span class="pl-s">${{ secrets.NEXT_PUBLIC_API_BASE_URL }}</span>
        <span class="pl-ent">API_KEY</span>: <span class="pl-s">${{ secrets.API_KEY }}</span>
      <span class="pl-ent">run</span>: <span class="pl-s">pnpm exec playwright test</span>
    - <span class="pl-ent">uses</span>: <span class="pl-s">actions/upload-artifact@v3</span>
      <span class="pl-ent">if</span>: <span class="pl-s">always()</span>
      <span class="pl-ent">with</span>:
        <span class="pl-ent">name</span>: <span class="pl-s">playwright-report</span>
        <span class="pl-ent">path</span>: <span class="pl-s">playwright-report/</span>
        <span class="pl-ent">retention-days</span>: <span class="pl-c1">30</span></pre></div>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import { defineConfig, devices } from '@playwright/test'
import dotenv from 'dotenv'
import path from 'path'

/**
 * Read environment variables from file.
 * https://github.com/motdotla/dotenv
 */
require('dotenv').config()

// Alternatively, read from &quot;../my.env&quot; file.
dotenv.config({ path: path.resolve(__dirname, '.env.local') })

/**
 * See https://playwright.dev/docs/test-configuration.
 */
export default defineConfig({
  testDir: './src/tests/e2e/',
  /* Maximum time one test can run for. */
  timeout: 30 * 1000,
  expect: {
    /**
     * Maximum time expect() should wait for the condition to be met.
     * For example in `await expect(locator).toHaveText();`
     */
    timeout: 5000,
  },
  /* 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: {
    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
    actionTimeout: 0,
    /* Base URL to use in actions like `await page.goto('/')`. */
    // baseURL: 'http://localhost:3000',

    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
    trace: 'on-first-retry',
  },

  /* 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 against mobile viewports. */
    // {
    //   name: 'Mobile Chrome',
    //   use: { ...devices['Pixel 5'] },
    // },
    // {
    //   name: 'Mobile Safari',
    //   use: { ...devices['iPhone 12'] },
    // },

    /* Test against branded browsers. */
    // {
    //   name: 'Microsoft Edge',
    //   use: { channel: 'msedge' },
    // },
    // {
    //   name: 'Google Chrome',
    //   use: { channel: 'chrome' },
    // },
  ],

  /* Folder for test artifacts such as screenshots, videos, traces, etc. */
  // outputDir: 'test-results/',

  /* Run your local dev server before starting the tests */
  // webServer: {
  //   command: 'npm run start',
  //   port: 3000,
  // },
})"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">defineConfig</span><span class="pl-kos">,</span> <span class="pl-s1">devices</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'@playwright/test'</span>
<span class="pl-k">import</span> <span class="pl-s1">dotenv</span> <span class="pl-k">from</span> <span class="pl-s">'dotenv'</span>
<span class="pl-k">import</span> <span class="pl-s1">path</span> <span class="pl-k">from</span> <span class="pl-s">'path'</span>

<span class="pl-c">/**</span>
<span class="pl-c"> * Read environment variables from file.</span>
<span class="pl-c"> * https://github.com/motdotla/dotenv</span>
<span class="pl-c"> */</span>
<span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'dotenv'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">config</span><span class="pl-kos">(</span><span class="pl-kos">)</span>

<span class="pl-c">// Alternatively, read from "../my.env" file.</span>
<span class="pl-s1">dotenv</span><span class="pl-kos">.</span><span class="pl-en">config</span><span class="pl-kos">(</span><span class="pl-kos">{</span> <span class="pl-c1">path</span>: <span class="pl-s1">path</span><span class="pl-kos">.</span><span class="pl-en">resolve</span><span class="pl-kos">(</span><span class="pl-s1">__dirname</span><span class="pl-kos">,</span> <span class="pl-s">'.env.local'</span><span class="pl-kos">)</span> <span class="pl-kos">}</span><span class="pl-kos">)</span>

<span class="pl-c">/**</span>
<span class="pl-c"> * See https://playwright.dev/docs/test-configuration.</span>
<span class="pl-c"> */</span>
<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-en">defineConfig</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
  <span class="pl-c1">testDir</span>: <span class="pl-s">'./src/tests/e2e/'</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Maximum time one test can run for. */</span>
  <span class="pl-c1">timeout</span>: <span class="pl-c1">30</span> <span class="pl-c1">*</span> <span class="pl-c1">1000</span><span class="pl-kos">,</span>
  <span class="pl-c1">expect</span>: <span class="pl-kos">{</span>
    <span class="pl-c">/**</span>
<span class="pl-c">     * Maximum time expect() should wait for the condition to be met.</span>
<span class="pl-c">     * For example in `await expect(locator).toHaveText();`</span>
<span class="pl-c">     */</span>
    <span class="pl-c1">timeout</span>: <span class="pl-c1">5000</span><span class="pl-kos">,</span>
  <span class="pl-kos">}</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Run tests in files in parallel */</span>
  <span class="pl-c1">fullyParallel</span>: <span class="pl-c1">true</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Fail the build on CI if you accidentally left test.only in the source code. */</span>
  <span class="pl-c1">forbidOnly</span>: <span class="pl-c1">!</span><span class="pl-c1">!</span><span class="pl-s1">process</span><span class="pl-kos">.</span><span class="pl-c1">env</span><span class="pl-kos">.</span><span class="pl-c1">CI</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Retry on CI only */</span>
  <span class="pl-c1">retries</span>: <span class="pl-s1">process</span><span class="pl-kos">.</span><span class="pl-c1">env</span><span class="pl-kos">.</span><span class="pl-c1">CI</span> ? <span class="pl-c1">2</span> : <span class="pl-c1">0</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Opt out of parallel tests on CI. */</span>
  <span class="pl-c1">workers</span>: <span class="pl-s1">process</span><span class="pl-kos">.</span><span class="pl-c1">env</span><span class="pl-kos">.</span><span class="pl-c1">CI</span> ? <span class="pl-c1">1</span> : <span class="pl-c1">undefined</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Reporter to use. See https://playwright.dev/docs/test-reporters */</span>
  <span class="pl-c1">reporter</span>: <span class="pl-s">'html'</span><span class="pl-kos">,</span>
  <span class="pl-c">/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */</span>
  <span class="pl-c1">use</span>: <span class="pl-kos">{</span>
    <span class="pl-c">/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */</span>
    <span class="pl-c1">actionTimeout</span>: <span class="pl-c1">0</span><span class="pl-kos">,</span>
    <span class="pl-c">/* Base URL to use in actions like `await page.goto('/')`. */</span>
    <span class="pl-c">// baseURL: 'http://localhost:3000',</span>

    <span class="pl-c">/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */</span>
    <span class="pl-c1">trace</span>: <span class="pl-s">'on-first-retry'</span><span class="pl-kos">,</span>
  <span class="pl-kos">}</span><span class="pl-kos">,</span>

  <span class="pl-c">/* Configure projects for major browsers */</span>
  <span class="pl-c1">projects</span>: <span class="pl-kos">[</span>
    <span class="pl-kos">{</span>
      <span class="pl-c1">name</span>: <span class="pl-s">'chromium'</span><span class="pl-kos">,</span>
      <span class="pl-c1">use</span>: <span class="pl-kos">{</span> ...<span class="pl-s1">devices</span><span class="pl-kos">[</span><span class="pl-s">'Desktop Chrome'</span><span class="pl-kos">]</span> <span class="pl-kos">}</span><span class="pl-kos">,</span>
    <span class="pl-kos">}</span><span class="pl-kos">,</span>

    <span class="pl-kos">{</span>
      <span class="pl-c1">name</span>: <span class="pl-s">'firefox'</span><span class="pl-kos">,</span>
      <span class="pl-c1">use</span>: <span class="pl-kos">{</span> ...<span class="pl-s1">devices</span><span class="pl-kos">[</span><span class="pl-s">'Desktop Firefox'</span><span class="pl-kos">]</span> <span class="pl-kos">}</span><span class="pl-kos">,</span>
    <span class="pl-kos">}</span><span class="pl-kos">,</span>

    <span class="pl-kos">{</span>
      <span class="pl-c1">name</span>: <span class="pl-s">'webkit'</span><span class="pl-kos">,</span>
      <span class="pl-c1">use</span>: <span class="pl-kos">{</span> ...<span class="pl-s1">devices</span><span class="pl-kos">[</span><span class="pl-s">'Desktop Safari'</span><span class="pl-kos">]</span> <span class="pl-kos">}</span><span class="pl-kos">,</span>
    <span class="pl-kos">}</span><span class="pl-kos">,</span>

    <span class="pl-c">/* Test against mobile viewports. */</span>
    <span class="pl-c">// {</span>
    <span class="pl-c">//   name: 'Mobile Chrome',</span>
    <span class="pl-c">//   use: { ...devices['Pixel 5'] },</span>
    <span class="pl-c">// },</span>
    <span class="pl-c">// {</span>
    <span class="pl-c">//   name: 'Mobile Safari',</span>
    <span class="pl-c">//   use: { ...devices['iPhone 12'] },</span>
    <span class="pl-c">// },</span>

    <span class="pl-c">/* Test against branded browsers. */</span>
    <span class="pl-c">// {</span>
    <span class="pl-c">//   name: 'Microsoft Edge',</span>
    <span class="pl-c">//   use: { channel: 'msedge' },</span>
    <span class="pl-c">// },</span>
    <span class="pl-c">// {</span>
    <span class="pl-c">//   name: 'Google Chrome',</span>
    <span class="pl-c">//   use: { channel: 'chrome' },</span>
    <span class="pl-c">// },</span>
  <span class="pl-kos">]</span><span class="pl-kos">,</span>

  <span class="pl-c">/* Folder for test artifacts such as screenshots, videos, traces, etc. */</span>
  <span class="pl-c">// outputDir: 'test-results/',</span>

  <span class="pl-c">/* Run your local dev server before starting the tests */</span>
  <span class="pl-c">// webServer: {</span>
  <span class="pl-c">//   command: 'npm run start',</span>
  <span class="pl-c">//   port: 3000,</span>
  <span class="pl-c">// },</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span></pre></div>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">Test should pass</p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">Passing tests locally</p>