How to reset device setting in a single test in Playwright

Question

I'm trying to reset the device setting (use) for a single test.

Here is the project definition (playwright.config file):

projects: [
    {
      name: "chromium",
      use: { ...devices["Desktop Chrome"] },
    }

And this is the test:

test.use({ ...devices[""] }); // Trying to set devices to nothing
test("set maximize", async ({}) => {
  const browser = await chromium.launch({
    args: ["--start-maximized"],
  });
  const context = await browser.newContext({ viewport: null });
  const page = await context.newPage();
  await page.goto("https://playwright.dev/");
});

I want this test to be executed the same as if I was commenting this devices line

projects: [
    {
      name: "chromium",
      // use: { ...devices["Desktop Chrome"] },
    },

The problem is that commenting this line would effect all the tests of this project, and I want the same effect but for a single test.

Answer 1

To work this, you will want to create a new project that groups that test in it, and then set the config you like.

So your projects will now look like:

projects: [
{
  name: "chromium",
  use: { ...devices["Desktop Chrome"] },
},
{
  name: "SomeNiceNameHere",
  testMatch: /.*test.spec.ts/,
}

with the relevant testMatch and a nice name. This will be the easiest way, as you may wish to extend your suite down the line with more similarly configured tests, so this project structure allows for that.

A second way is to do what you are trying in your example which should work, although I haven't directly tested it, but from reading the docs this is possible. If you import devices into your test via playwright or through a fixture, you can simply override the config setup for your test or test block. Something like:

import { devices } from "@playwright/test";

//Replace this with the browsers you wish to use
test.use({ ...devices["Desktop Firefox"] });

test("test name", async ({page}) => {

});