Stage setting timeout for the playwright

Question

Stage setting timeout for the playwright

const test = defaultTest.extend({
  audit: async ({ page }) => {
    await page.screenshot({ path: 'e2e/test.png' });
    console.info('audit done!');
  },
});

// ...more code

test.only('audit', async ({ page, mount, audit }) => {
  await audit(page);
  // ...test code
}));

Error:

Running 1 test using 1 worker

  ✘  1 [chromium] ›audit.playwright.tsx:48:6 › audit (10.0s)
audit done!


  1) [chromium] › audit.playwright.tsx:48:6 › audit ─────────────────────────────────────

    Test timeout of 10000ms exceeded while setting up "audit".

  1 failed
    [chromium] › audit.playwright.tsx:48:6 › audit

Simple query. I need a screenshot taken during the audit, followed by the test's continuation. A screenshot file is generated successfully, but the test then times out. Removing the fixture from the test allows the test to function as intended. What could be missing here?

javascript typescript playwright playwright-typescript

Answer 1

Answer №1

A fixture serves a purpose both before and after the test is executed, being non-invocable on its own. If you wish to capture a screenshot prior to running the test, you can implement the following approach:

import { test as defaultTest } from "@playwright/test";

const test = defaultTest.extend({
  audit: async ({ page }, use) => {
    await page.screenshot({ path: 'e2e/test.png' }); // Executed before the test begins
    console.info('audit done!');
    await use(page) // <--- Leveraging the fixture. This is where the test is executed
  },
});

// By including the fixture as an argument, it gets automatically applied:
test.only('audit', async ({ page, audit }) => {
  // ...test code
});

Answer 2

A fixture serves a purpose both before and after the test is executed, being non-invocable on its own. If you wish to capture a screenshot prior to running the test, you can implement the following approach:

import { test as defaultTest } from "@playwright/test";

const test = defaultTest.extend({
  audit: async ({ page }, use) => {
    await page.screenshot({ path: 'e2e/test.png' }); // Executed before the test begins
    console.info('audit done!');
    await use(page) // <--- Leveraging the fixture. This is where the test is executed
  },
});

// By including the fixture as an argument, it gets automatically applied:
test.only('audit', async ({ page, audit }) => {
  // ...test code
});

Stage setting timeout for the playwright

Answer №1

Similar questions

The 'Image' component does not have a propType defined for the native prop 'RCTImageView.overlayColor' with a native type of 'number'

Combining two RxJs observables to create selectable options for a material drop-down menu

Exploring an array using bluebird promises

Trigger Modal using PHP/JavaScript

Ensure that the token remains current with each axios operation

Using PHP to encode JSON and submit it via POST request

What is the best way to arrange an array by the attribute of related elements in another array using Javascript?

Utilizing MongoDb and Node.js for efficient data input

Trouble triggering hidden radio button in Angular 9 when clicked

Tips for modifying the function of an Electron application using an external JavaScript file

What are the steps to leverage npm installed packages in my .js files?

The React Vite application encountered an issue: There is no loader configured for ".html" files at ../server/node_modules/@mapbox/node-pre-gyp/lib/util/nw-pre-gyp/index.html

React - onchange event for input checkboxes does not trigger on the initial click

Extract the URL from an AJAX request within an IFRAME using a Chrome Extension

Can you clarify the meaning of "int" in this code snippet?

Issues arising post transitioning to 14.0.0 from 13.0.0 version of ngx-masonry library leading to failed tests

An algorithm designed to identify matching song lyrics based on a keyword or its fragments

The function validateLogin is not defined within the code, resulting in a javascript exception being

Tips for choosing the injected HTML's List Element (li) while ensuring it remains concealed

Using TypeScript with Vue allows you to customize the default export of Vue