<h3 dir="auto">Your question</h3>
<p dir="auto">I used this <a href="https://playwright.dev/java/docs/test-snapshots" rel="nofollow">https://playwright.dev/java/docs/test-snapshots</a> function<br>
Can I somehow change the directory for saving screenshots?</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: v1.36.1</li>
<li>Operating System: linux</li>
<li>Browser: [All]</li>
<li>Other info:</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"> I provided exact source code that allows reproducing the issue locally.</li>
</ul>




<p dir="auto"><strong>Link to the GitHub repository with the repro</strong></p>
<p dir="auto">or</p>
<p dir="auto"><strong>Config file</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// playwright.config.ts
// @ts-check
const { defineConfig, devices } = require('@playwright/test');

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

/**
 * @see https://playwright.dev/docs/test-configuration
 */
module.exports = defineConfig({
  testDir: './tests',
  /* 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: {
    /* Base URL to use in actions like `await page.goto('/')`. */
    // baseURL: 'http://127.0.0.1:3000',

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

    //video: 'on'
  },

  /* 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: { ...devices['Desktop Edge'], channel: 'msedge' },
    // },
    // {
    //   name: 'Google Chrome',
    //   use: { ..devices['Desktop Chrome'], channel: 'chrome' },
    // },
  ],

  /* Run your local dev server before starting the tests */
  // webServer: {
  //   command: 'npm run start',
  //   url: 'http://127.0.0.1:3000',
  //   reuseExistingServer: !process.env.CI,
  // },
});

"><pre class="notranslate"><span class="pl-c">// playwright.config.ts</span>
<span class="pl-c">// <span class="pl-k">@ts</span>-check</span>
<span class="pl-k">const</span> <span class="pl-kos">{</span> defineConfig<span class="pl-kos">,</span> devices <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'@playwright/test'</span><span class="pl-kos">)</span><span class="pl-kos">;</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-c">// require('dotenv').config();</span>

<span class="pl-c">/**</span>
<span class="pl-c"> * <span class="pl-k">@see</span> https://playwright.dev/docs/test-configuration</span>
<span class="pl-c"> */</span>
<span class="pl-smi">module</span><span class="pl-kos">.</span><span class="pl-c1">exports</span> <span class="pl-c1">=</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">'./tests'</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">/* Base URL to use in actions like `await page.goto('/')`. */</span>
    <span class="pl-c">// baseURL: 'http://127.0.0.1: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-c">/* screenshots on failure */</span>
    <span class="pl-c1">screenshot</span>: <span class="pl-s">'only-on-failure'</span><span class="pl-kos">,</span>

    <span class="pl-c">//video: 'on'</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: { ...devices['Desktop Edge'], 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: { ..devices['Desktop Chrome'], channel: 'chrome' },</span>
    <span class="pl-c">// },</span>
  <span class="pl-kos">]</span><span class="pl-kos">,</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">//   url: 'http://127.0.0.1:3000',</span>
  <span class="pl-c">//   reuseExistingServer: !process.env.CI,</span>
  <span class="pl-c">// },</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
</pre></div>
<p dir="auto"><strong>Test file (self-contained)</strong></p>
<p dir="auto">test_1.spec.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// @ts-check
const { test, expect } = require('@playwright/test');

/** @type {import('@playwright/test').Page} */
let page;

test.beforeAll(async ({ browser }) =&gt; {
  page = await browser.newPage();
  await page.goto(&quot;https://bing.com&quot;);
});

test.afterAll(async () =&gt; {
  //await page.close();
});




test('Async test 1', async () =&gt; {
    await page.goto('https://playwright.dev/community/welcome');
    let heading = page.getByRole('heading', { name: 'Welcome' });
    await expect(heading).toBeVisible();

  });

test('Async test 2', async () =&gt; {
    await page.goto('https://playwright.dev/docs/api/class-playwright');
    let heading = page.getByRole('heading', { name: 'Playwright Library' });
    await expect(heading).toBeVisible();
});

test('Steps are executed synchronously', async () =&gt; {
    await test.step('Step 1', async () =&gt; {
        await page.goto('https://playwright.dev/');
    });

    await test.step('Step 2', async () =&gt; {
        await page.getByText('Get Started').click();
    });

    await test.step('Step 3', async () =&gt; {
        let heading = page.getByRole('heading', { name: 'Installation' });
        await expect(heading).toBeVisible();
    });

});


test('Async test 3', async ({playwright}) =&gt; {


      let html = `&lt;html&gt;
      &lt;head&gt;
      &lt;title&gt;tets&lt;/title&gt;
      &lt;script&gt;
      function loop() {
        document.getElementById('one').innerText = 'start';
        for(let i=0;i&lt;500000;i++) {
          setTimeout(() =&gt; {
              document.getElementById('one').innerText = i +' '+ Date.now() +' '+ crypto.randomUUID();
          }, 50);



        }
      }
      &lt;/script&gt;
      &lt;/head&gt;
      &lt;body onload=&quot;loop()&quot;&gt;
      &lt;h1 id='one'&gt;pass&lt;/h1&gt;

      &lt;/body&gt;
      &lt;/html&gt;`;
      await page.setContent(html);
      let heading = page.getByRole('heading');
      await expect(heading).toHaveText('fail');




    //await test.step('', async () =&gt; {
    //});

  });"><pre class="notranslate"><span class="pl-c">// <span class="pl-k">@ts</span>-check</span>
<span class="pl-k">const</span> <span class="pl-kos">{</span> test<span class="pl-kos">,</span> expect <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'@playwright/test'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-c">/** <span class="pl-k">@type</span> {import('@playwright/test').Page} */</span>
<span class="pl-k">let</span> <span class="pl-s1">page</span><span class="pl-kos">;</span>

<span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">beforeAll</span><span class="pl-kos">(</span><span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span> browser <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-s1">page</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">browser</span><span class="pl-kos">.</span><span class="pl-en">newPage</span><span class="pl-kos">(</span><span class="pl-kos">)</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://bing.com"</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-s1">test</span><span class="pl-kos">.</span><span class="pl-en">afterAll</span><span class="pl-kos">(</span><span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-c">//await page.close();</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>




<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 1'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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/community/welcome'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Welcome'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 2'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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/docs/api/class-playwright'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Playwright Library'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Steps are executed synchronously'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 1'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

    <span class="pl-k">await</span> <span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 2'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">getByText</span><span class="pl-kos">(</span><span class="pl-s">'Get Started'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">click</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-k">await</span> <span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 3'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Installation'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
        <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>


<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 3'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span>playwright<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">let</span> <span class="pl-s1">html</span> <span class="pl-c1">=</span> <span class="pl-s">`&lt;html&gt;</span>
<span class="pl-s">      &lt;head&gt;</span>
<span class="pl-s">      &lt;title&gt;tets&lt;/title&gt;</span>
<span class="pl-s">      &lt;script&gt;</span>
<span class="pl-s">      function loop() {</span>
<span class="pl-s">        document.getElementById('one').innerText = 'start';</span>
<span class="pl-s">        for(let i=0;i&lt;500000;i++) {</span>
<span class="pl-s">          setTimeout(() =&gt; {</span>
<span class="pl-s">              document.getElementById('one').innerText = i +' '+ Date.now() +' '+ crypto.randomUUID();</span>
<span class="pl-s">          }, 50);</span>
<span class="pl-s"></span>
<span class="pl-s"></span>
<span class="pl-s"></span>
<span class="pl-s">        }</span>
<span class="pl-s">      }</span>
<span class="pl-s">      &lt;/script&gt;</span>
<span class="pl-s">      &lt;/head&gt;</span>
<span class="pl-s">      &lt;body onload="loop()"&gt;</span>
<span class="pl-s">      &lt;h1 id='one'&gt;pass&lt;/h1&gt;</span>
<span class="pl-s"></span>
<span class="pl-s">      &lt;/body&gt;</span>
<span class="pl-s">      &lt;/html&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">setContent</span><span class="pl-kos">(</span><span class="pl-s1">html</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toHaveText</span><span class="pl-kos">(</span><span class="pl-s">'fail'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>




    <span class="pl-c">//await test.step('', async () =&gt; {</span>
    <span class="pl-c">//});</span>

  <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">test_2.spec.js</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="// @ts-check
const { test, expect } = require('@playwright/test');

/** @type {import('@playwright/test').Page} */
let page;

test.beforeAll(async ({ browser }) =&gt; {

  page = await browser.newPage();
  await page.goto(&quot;https://example.com&quot;);

});

test.afterAll(async () =&gt; {
  //await page.close();
});




test('Async test 1', async () =&gt; {
    await page.goto('https://example.com/community/welcome');
    let heading = page.getByRole('heading', { name: 'Welcome' });
    await expect(heading).toBeVisible();

  });

test('Async test 2', async () =&gt; {
    await page.goto('https://example.com/docs/api/class-playwright');
    let heading = page.getByRole('heading', { name: 'Playwright Library' });
    await expect(heading).toBeVisible();
});

test('Steps are executed synchronously', async () =&gt; {
    await test.step('Step 1', async () =&gt; {
        await page.goto('https://example.com/');
    });

    await test.step('Step 2', async () =&gt; {
        await page.getByText('Get Started').click();
    });

    await test.step('Step 3', async () =&gt; {
        let heading = page.getByRole('heading', { name: 'Installation' });
        await expect(heading).toBeVisible();
    });

});


test('Async test 3', async ({playwright}) =&gt; {

      let html = `&lt;html&gt;
      &lt;head&gt;
      &lt;title&gt;tets&lt;/title&gt;
      &lt;script&gt;
      function loop() {
        document.getElementById('one').innerText = 'start';
        for(let i=0;i&lt;500000;i++) {
          setTimeout(() =&gt; {
              document.getElementById('one').innerText = i +' '+ Date.now() +' '+ crypto.randomUUID();
          }, 50);



        }
      }
      &lt;/script&gt;
      &lt;/head&gt;
      &lt;body onload=&quot;loop()&quot;&gt;
      &lt;h1 id='one'&gt;pass&lt;/h1&gt;

      &lt;/body&gt;
      &lt;/html&gt;`;
      await page.setContent(html);
      let heading = page.getByRole('heading');
      await expect(heading).toHaveText('fail');




    //await test.step('', async () =&gt; {
    //});

  });"><pre class="notranslate"><span class="pl-c">// <span class="pl-k">@ts</span>-check</span>
<span class="pl-k">const</span> <span class="pl-kos">{</span> test<span class="pl-kos">,</span> expect <span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'@playwright/test'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-c">/** <span class="pl-k">@type</span> {import('@playwright/test').Page} */</span>
<span class="pl-k">let</span> <span class="pl-s1">page</span><span class="pl-kos">;</span>

<span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">beforeAll</span><span class="pl-kos">(</span><span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span> browser <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>

  <span class="pl-s1">page</span> <span class="pl-c1">=</span> <span class="pl-k">await</span> <span class="pl-s1">browser</span><span class="pl-kos">.</span><span class="pl-en">newPage</span><span class="pl-kos">(</span><span class="pl-kos">)</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://example.com"</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-s1">test</span><span class="pl-kos">.</span><span class="pl-en">afterAll</span><span class="pl-kos">(</span><span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-c">//await page.close();</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>




<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 1'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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://example.com/community/welcome'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Welcome'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 2'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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://example.com/docs/api/class-playwright'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Playwright Library'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Steps are executed synchronously'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 1'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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://example.com/'</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-k">await</span> <span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 2'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">getByText</span><span class="pl-kos">(</span><span class="pl-s">'Get Started'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">click</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-k">await</span> <span class="pl-s1">test</span><span class="pl-kos">.</span><span class="pl-en">step</span><span class="pl-kos">(</span><span class="pl-s">'Step 3'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <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">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">name</span>: <span class="pl-s">'Installation'</span> <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
        <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toBeVisible</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-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>


<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">'Async test 3'</span><span class="pl-kos">,</span> <span class="pl-k">async</span> <span class="pl-kos">(</span><span class="pl-kos">{</span>playwright<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">let</span> <span class="pl-s1">html</span> <span class="pl-c1">=</span> <span class="pl-s">`&lt;html&gt;</span>
<span class="pl-s">      &lt;head&gt;</span>
<span class="pl-s">      &lt;title&gt;tets&lt;/title&gt;</span>
<span class="pl-s">      &lt;script&gt;</span>
<span class="pl-s">      function loop() {</span>
<span class="pl-s">        document.getElementById('one').innerText = 'start';</span>
<span class="pl-s">        for(let i=0;i&lt;500000;i++) {</span>
<span class="pl-s">          setTimeout(() =&gt; {</span>
<span class="pl-s">              document.getElementById('one').innerText = i +' '+ Date.now() +' '+ crypto.randomUUID();</span>
<span class="pl-s">          }, 50);</span>
<span class="pl-s"></span>
<span class="pl-s"></span>
<span class="pl-s"></span>
<span class="pl-s">        }</span>
<span class="pl-s">      }</span>
<span class="pl-s">      &lt;/script&gt;</span>
<span class="pl-s">      &lt;/head&gt;</span>
<span class="pl-s">      &lt;body onload="loop()"&gt;</span>
<span class="pl-s">      &lt;h1 id='one'&gt;pass&lt;/h1&gt;</span>
<span class="pl-s"></span>
<span class="pl-s">      &lt;/body&gt;</span>
<span class="pl-s">      &lt;/html&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">setContent</span><span class="pl-kos">(</span><span class="pl-s1">html</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-k">let</span> <span class="pl-s1">heading</span> <span class="pl-c1">=</span> <span class="pl-s1">page</span><span class="pl-kos">.</span><span class="pl-en">getByRole</span><span class="pl-kos">(</span><span class="pl-s">'heading'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
      <span class="pl-k">await</span> <span class="pl-en">expect</span><span class="pl-kos">(</span><span class="pl-s1">heading</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">toHaveText</span><span class="pl-kos">(</span><span class="pl-s">'fail'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>




    <span class="pl-c">//await test.step('', async () =&gt; {</span>
    <span class="pl-c">//});</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>Run the tests</li>
<li>Review test_2.spec.js failures</li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">With the exception of "Async test 3" Only screenshots with example domain should be attached.</p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">Usecase consists of config set to grab screenshots on failure and two test files of which one is failing all the tests. Even if tests are fully isolated , some of the screenshots show playwright.dev site instead of example.com</p>
<p dir="auto"><a href="https://playwright.dev/docs/browser-contexts" rel="nofollow">https://playwright.dev/docs/browser-contexts</a> reads:<br>
Isolation<br>
Tests written with Playwright execute in isolated clean-slate environments called browser contexts. This isolation model improves reproducibility and prevents cascading test failures.</p>
<p dir="auto">What is Test Isolation?<br>
Test Isolation is when each test is completely isolated from another test.</p>