<p dir="auto">When I add screenshots to a test, the test report displays the name twice. While, functionally, this isn't an issue, the detail oriented part of me is annoyed by this :)</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="const screenshot = await page.screenshot({ fullPage: true });
await test.info().attach(name, { body: screenshot, contentType: 'image/png' });"><pre class="notranslate"><code class="notranslate">const screenshot = await page.screenshot({ fullPage: true });
await test.info().attach(name, { body: screenshot, contentType: 'image/png' });
</code></pre></div>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/5252941/184136602-621e77ef-ecbd-44de-89cf-d60409e4da15.png"><img src="https://user-images.githubusercontent.com/5252941/184136602-621e77ef-ecbd-44de-89cf-d60409e4da15.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">I have tried specifying the path when taking a screenshot, and that does not produce the duplicate file name in the report, however, I want to use the default behavior in Playwright for taking screenshots, as it cleans up the screenshot directory every time the tests are run.</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: 1.32.2</li>
<li>Operating System: maxOs 13.2.1</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" checked=""> I provided exact source code that allows reproducing the issue locally</li>
</ul>




<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="import { defineConfig, devices } from &quot;@playwright/test&quot;;

export default defineConfig({
  testDir: &quot;./tests&quot;,
  projects: [
    {
      name: &quot;chromium&quot;,
      use: { ...devices[&quot;Desktop Chrome&quot;] },
    },
  ],
});"><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-kos">;</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">"./tests"</span><span class="pl-kos">,</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-kos">,</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>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import { test } from &quot;@playwright/test&quot;;
import { PassThrough } from &quot;stream&quot;;

test(&quot;pipe to stdout&quot;, async ({ page }) =&gt; {
  const writable = new PassThrough();
  writable.pipe(process.stdout);
  writable.write(&quot;hello&quot;);
});"><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-k">from</span> <span class="pl-s">"@playwright/test"</span><span class="pl-kos">;</span>
<span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-v">PassThrough</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">"stream"</span><span class="pl-kos">;</span>

<span class="pl-en">test</span><span class="pl-kos">(</span><span class="pl-s">"pipe to stdout"</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">const</span> <span class="pl-s1">writable</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">PassThrough</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-s1">writable</span><span class="pl-kos">.</span><span class="pl-en">pipe</span><span class="pl-kos">(</span><span class="pl-s1">process</span><span class="pl-kos">.</span><span class="pl-c1">stdout</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-s1">writable</span><span class="pl-kos">.</span><span class="pl-en">write</span><span class="pl-kos">(</span><span class="pl-s">"hello"</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><code class="notranslate">yarn playwright test --ui</code></li>
<li>Run the test in the UI</li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">No error in the console</p>
<p dir="auto"><strong>Actual</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Error: ReferenceError: Buffer is not defined
    at Be._onStdIO (http://localhost:62118/trace/watch.575ca3b3.js:1:4187)
    at Be.dispatch (http://localhost:62118/trace/watch.575ca3b3.js:1:2309)
    at window.dispatch (http://localhost:62118/trace/watch.575ca3b3.js:3:296)
    at eval (eval at evaluate (:195:30), &lt;anonymous&gt;:2:10)
    at UtilityScript.evaluate (&lt;anonymous&gt;:197:17)
    at UtilityScript.&lt;anonymous&gt; (&lt;anonymous&gt;:1:44)"><pre class="notranslate"><code class="notranslate">Error: ReferenceError: Buffer is not defined
    at Be._onStdIO (http://localhost:62118/trace/watch.575ca3b3.js:1:4187)
    at Be.dispatch (http://localhost:62118/trace/watch.575ca3b3.js:1:2309)
    at window.dispatch (http://localhost:62118/trace/watch.575ca3b3.js:3:296)
    at eval (eval at evaluate (:195:30), &lt;anonymous&gt;:2:10)
    at UtilityScript.evaluate (&lt;anonymous&gt;:197:17)
    at UtilityScript.&lt;anonymous&gt; (&lt;anonymous&gt;:1:44)
</code></pre></div>
<p dir="auto">Additionally, no output to be seen anywhere from tests</p>