[BUG] Screenshot is not presented inside the Attachments tab

[AlexKomanov]

System info

• Playwright Version: [v1.34]
• Operating System: [Windows 10]
• Browser: [Chromium]
• Other info:

Source code

• [x] I provided exact source code that allows reproducing the issue locally.

Config file

// playwright.config.ts
import { chromium, devices, PlaywrightTestConfig } from "@playwright/test";

const config: PlaywrightTestConfig = {
    projects: [
        {
            name: 'Google Chrome',
            use:
            {
                ...devices['Desktop Chrome']
                , channel: 'chrome'
            },

        },
        {
            name: 'Microsoft Edge',
            use: {
                ...devices['Desktop Edge'],
                channel: 'msedge'
            },
        },
    ],
    timeout: 240000,
    globalTimeout: 18000000,
    testDir: "./tests",
    reporter: [
        ["list"],
        ["junit", { outputFile: "reports/test-results.xml" }],
        ["json", { outputFile: "reports/test-results.json" }],
        ["html", { open: "never" }],
    ],
    use: {
        browserName: "chromium",
        actionTimeout: 30000,
        trace: "off",
        screenshot: "on",
        viewport: { width: 1400, height: 900 },
        video: {
            mode: "on",
            size: {
                //Like in our project
                width: 1400,
                height: 900,
            },
        },
        contextOptions: {
            ignoreHTTPSErrors: true,
        },
        // Browser options
        launchOptions: {
            channel: "chrome",
            slowMo: 200,
            args: [
                "--no-sandbox",
                "--ignore-certificate-errors",
                "--ignore-certificate-errors-skip-list",
            ],
        },
    },
};

export default config;

Test file (self-contained)

import { test, expect } from '@playwright/test';

test.describe("Error Handling Describe", () => {
  test.beforeEach(async ({ page }) => {
    await page.setViewportSize({ width: 1400, height: 1000 });
  })

  test('Successful Test', async ({ page }) => {

    await test.step('Navigate to the application', async () => {
      await page.goto('https://www.saucedemo.com/');
      const slowExpect = expect.configure({timeout: 20000})
      await slowExpect(page).toHaveURL('https://www.saucedemo.com/')
      await slowExpect(page.locator('.login_wrapper-inner')).toBeVisible();
    });

    await test.step('Enter credentials', async () => {
      await page.locator('[data-test="username"]').type('standard_user', {delay: 10});
      await page.locator('[data-test="password"]').type('secret_sauce', {delay: 10});
      await page.locator('[data-test="login-button"]').click();
    })

//[class="btn btn_primary btn_small btn_inventory"][name="add-to-cart-sauce-labs-backpack"]
    await page.locator('[class="btn btn_primary btn_small btn_inventory"]').and(page.locator('[name="add-to-cart-sauce-labs-backpack"]')).click();
    await page.locator('[data-test="add-to-cart-sauce-labs-fleece-jacket"]').click();
    await page.locator('[data-test="add-to-cart-sauce-labs-onesie"]').click();
    await page.locator('#shopping_cart_container a').click();
    await page.locator('[data-test="checkout"]').click();
    await page.locator('[data-test="firstName"]').click();
    await page.locator('[data-test="firstName"]').fill('alex');
    await page.locator('[data-test="lastName"]').click();
    await page.locator('[data-test="lastName"]').fill('komanov');
    await page.locator('[data-test="postalCode"]').click();
    await page.locator('[data-test="postalCode"]').fill('20100');
    await page.locator('[data-test="continue"]').click();
    await page.locator('[data-test="finish"]').click();
    await page.locator('[data-test="back-to-products"]').click();
    await page.getByRole('button', { name: 'Open Menu' }).click();
    await page.getByRole('link', { name: 'Reset App State' }).click();
    await page.getByRole('link', { name: 'Logout' }).click();
    await expect(page).toHaveURL('https://www.saucedemo.com/')
    await expect(page).toHaveScreenshot();
    
  });



})

});

Steps

• Define the screenshot parameter to be "on" inside the configuration file.
• Run the test via UI Mode

Expected

The screenshot should appear inside the new Attachments tab

Actual

The screenshot is not presented, but the video attachment is presented as well.