在剧作家测试中添加cookie

Question

无论我做什么，我都会收到错误（X.cookies 不是函数或 X.addCookies 不是函数）。我尝试使用上下文，page.context。 browserContext 等，它总是以相同的方式结束（好吧，page.context 以及 browserContext 未定义，所以错误是不同的）。

背景：

• 剧作家版本：1.4.2
• 操作系统：Ubuntu 20.4
• Node.js 版本：10.15.1
• 浏览器：Chromium

代码：

beforeEach(async function fn() {
this.timeout(20000);
browser = await chromium.launch({ headless: false });

const context = await browser.newContext();
page = await context.newPage();

await page
  .goto("http://localhost:4200/#/login", {
    waitUntil: "networkidle0",
  })
  .catch(() => {});

});

并且在测试中：

      // await context.addCookies([
  //   { name: "csrftoken", value: cookieToken, path: "/" },
  //   { name: "sessionid", value: cookieSession, path: "/" },
  // ]);
  // await context.cookies();

Answer 1

了解上下文后，您应该能够将其用作以下示例：

await context.addCookies([{name:"csrftoken", value: "mytokenvalue123", url: "your.application.url"}]);

Answer 2

设置 cookie 非常简单。您可以利用浏览器固定装置。

test("Go Test An Application", async ({ page, browser }) => {

    // Using the browser fixture, you can get access to the BrowserContext
    const browserContext = await browser.newContext();

    // Add cookies to the browserContext
    const cookieVals = await setCookieVals();
    browserContext.addCookies(cookieVals)

    // First we will go to the Applicaiton URL
    const appURL = "https://stackoverflow.com/"
    page.goto(`${appURL}`);

    await page.waitForTimeout(3000);

});

export async function setCookieVals() {

    const cookies = [
        {name:"cookie1", value:"349", path:"/", domain:"stackoverflow"},
        {name:"cookie2", value:"1", path:"/", domain:"stackoverflow"},
        {name:"cookie3", value:"4000", path:"/", domain:"stackoverflow"},
    ]

    return cookies;
}

Answer 3

我必须直接使用上下文而不是浏览器上下文，否则某些数据将无法正确加载（特别是在 SvelteKit 应用程序中）：

test('index page has expected content when logged in', async ({ page, context }) => {
    await context.addCookies([
        { name: 'sessionid', value: 'random', path: '/', domain: 'localhost' }
    ]);

    await page.goto('/');
    expect(await page.textContent('h1')).toBe('My title');
    console.log(await context.cookies());
});

Answer 4

为了使用

playwright

设置 cookie，您需要添加

path

和

domain

或

url

。比照。 addCookies docs

中注释的代码

**browserContext.addCookies(cookies)**

cookies <Array<Object>>
name <string>
value <string>
url <string> either url or domain / path are required. Optional. // ***** NOTE *****
domain <string> either url or domain / path are required Optional. // ***** NOTE *****
path <string> either url or domain / path are required Optional. // ***** NOTE *****
expires <number> Unix time in seconds. Optional.
httpOnly <boolean> Optional.
secure <boolean> Optional.
sameSite <"Strict"|"Lax"|"None"> Optional.

returns: <Promise<void>>

这与域是可选的标准行为不同。

Answer 5

我们可以使用当前工作页面上下文来添加cookie。

 const browserContext = page.context();

    // Add cookies to the browserContext
    browserContext.addCookies([
      {
        name: 'next-auth.session-token',
        value: 'FAKE_TOKEN',
        domain: 'localhost',
        path: '/',
        expires: -1,
        httpOnly: true,
        secure: false,
        sameSite: 'Lax',
      },
    ]);

Answer 6

const 上下文仅在 beforeEach 方法内设置，并且在您的测试中不可用。

将其定义为全局变量