<p dir="auto">I might have found an issue with the junit reporting that especially appears when the report gets imported to xray.<br>
I actually create a screenshot manually with a filename and type and also via the automatic mode for the after hook.</p>
<p dir="auto">the result ist that actually one file gets imported as screenshots.png(the manual one) that can be opened within jira since at treats as an png file.</p>
<p dir="auto">The screenshots that get created automaticly  via the pw config just gets imported as screenshot without the file ending and can not be opened then. Also if I download them and set the file type i can not open them.</p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: [v1.32.2]</li>
<li>Operating System: [All, Windows 11, Ubuntu 20, macOS 13.2, etc.]</li>
<li>Browser: [All, Chromium, Firefox, WebKit]</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>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
// JUnit reporter config for Xray
const xrayOptions = {
  // Whether to add &lt;properties&gt; with all annotations; default is false
  embedAnnotationsAsProperties: true,

  // By default, annotation is reported as &lt;property name='' value=''&gt;.
  // These annotations are reported as &lt;property name=''&gt;value&lt;/property&gt;.
  textContentAnnotations: ['test_description'],

  // This will create a &quot;testrun_evidence&quot; property that contains all attachments. Each attachment is added as an inner &lt;item&gt; element.
  // Disables [[ATTACHMENT|path]] in the &lt;system-out&gt;.
  embedAttachmentsAsProperty: 'testrun_evidence',

  // Where to put the report.
  outputFile: './xray-report.xml',
};

use: {
    screenshot: {mode: 'only-on-failure', fullPage: true},
}"><pre class="notranslate"><span class="pl-c">// playwright.config.ts</span>
<span class="pl-c">// JUnit reporter config for Xray</span>
<span class="pl-k">const</span> <span class="pl-s1">xrayOptions</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span>
  <span class="pl-c">// Whether to add &lt;properties&gt; with all annotations; default is false</span>
  <span class="pl-c1">embedAnnotationsAsProperties</span>: <span class="pl-c1">true</span><span class="pl-kos">,</span>

  <span class="pl-c">// By default, annotation is reported as &lt;property name='' value=''&gt;.</span>
  <span class="pl-c">// These annotations are reported as &lt;property name=''&gt;value&lt;/property&gt;.</span>
  <span class="pl-c1">textContentAnnotations</span>: <span class="pl-kos">[</span><span class="pl-s">'test_description'</span><span class="pl-kos">]</span><span class="pl-kos">,</span>

  <span class="pl-c">// This will create a "testrun_evidence" property that contains all attachments. Each attachment is added as an inner &lt;item&gt; element.</span>
  <span class="pl-c">// Disables [[ATTACHMENT|path]] in the &lt;system-out&gt;.</span>
  <span class="pl-c1">embedAttachmentsAsProperty</span>: <span class="pl-s">'testrun_evidence'</span><span class="pl-kos">,</span>

  <span class="pl-c">// Where to put the report.</span>
  <span class="pl-c1">outputFile</span>: <span class="pl-s">'./xray-report.xml'</span><span class="pl-kos">,</span>
<span class="pl-kos">}</span><span class="pl-kos">;</span>

use: <span class="pl-kos">{</span>
    <span class="pl-c1">screenshot</span>: <span class="pl-kos">{</span><span class="pl-c1">mode</span>: <span class="pl-s">'only-on-failure'</span><span class="pl-kos">,</span> <span class="pl-c1">fullPage</span>: <span class="pl-c1">true</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="it('do stuff', async ({ page }) =&gt; {
  await overviewPage.goto();
  const path = testInfo.outputPath('tmp_screenshot.png');
  await page.screenshot({path});

  testInfo.attachments.push({name: 'screenshot.png', path, contentType: 'image/png'});
  await overviewPage.selectSomething.click();
});"><pre class="notranslate"><span class="pl-en">it</span><span class="pl-kos">(</span><span class="pl-s">'do stuff'</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">overviewPage</span><span class="pl-kos">.</span><span class="pl-en">goto</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-k">const</span> <span class="pl-s1">path</span> <span class="pl-c1">=</span> <span class="pl-s1">testInfo</span><span class="pl-kos">.</span><span class="pl-en">outputPath</span><span class="pl-kos">(</span><span class="pl-s">'tmp_screenshot.png'</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">screenshot</span><span class="pl-kos">(</span><span class="pl-kos">{</span>path<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

  <span class="pl-s1">testInfo</span><span class="pl-kos">.</span><span class="pl-c1">attachments</span><span class="pl-kos">.</span><span class="pl-en">push</span><span class="pl-kos">(</span><span class="pl-kos">{</span><span class="pl-c1">name</span>: <span class="pl-s">'screenshot.png'</span><span class="pl-kos">,</span> path<span class="pl-kos">,</span> <span class="pl-c1">contentType</span>: <span class="pl-s">'image/png'</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">overviewPage</span><span class="pl-kos">.</span><span class="pl-c1">selectSomething</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></pre></div>
<p dir="auto"><strong>Steps</strong></p>
<ul dir="auto">
<li>[Run the test]</li>
<li>[...]</li>
</ul>
<p dir="auto"><strong>Expected</strong></p>
<p dir="auto">screenshots should be saved as "screenshot.png" since this is the default filetype for screenshots</p>
<p dir="auto"><strong>Actual</strong></p>
<p dir="auto">Only screenshots that are saved with the correct file ending will be converted as an png by xray<br>
automatic screenshots get saved as "screenshot" and then can not be opened (broken file)<br>
(see attached screenshot)<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/8173194/234615615-582ff70d-0ce6-41fb-91ec-ccc8a7d5ba95.png"><img src="https://user-images.githubusercontent.com/8173194/234615615-582ff70d-0ce6-41fb-91ec-ccc8a7d5ba95.png" alt="Bildschirm­foto 2023-04-26 um 16 53 08" style="max-width: 100%;"></a></p>
<h3 dir="auto">System info</h3>
<ul dir="auto">
<li>Playwright Version: v1.31.2</li>
<li>Operating System:  Windows 10</li>
</ul>
<p dir="auto">I configured my test system as described here; <a href="https://docs.getxray.app/display/XRAYCLOUD/Testing+web+applications+using+Playwright" rel="nofollow">https://docs.getxray.app/display/XRAYCLOUD/Testing+web+applications+using+Playwright</a></p>
<p dir="auto">I noticed that in the xray xml-report the data types are not provided (e.g. ".png", ".webm"). So I have to edit the xml content beforehand to be able to open the evidence in the browser.<br>
In the default junit reports on the other hand the data types are apparently provided.</p>