跳到主要內容

驗證

簡介

Playwright 在稱為瀏覽器內容的隔離環境中執行測試。這種隔離模型提高了可重現性,並防止了級聯的測試失敗。測試可以載入現有的已驗證狀態。這消除了在每次測試中進行驗證的需要,並加快了測試執行速度。

核心概念

無論您選擇哪種驗證策略,您都可能會將已驗證的瀏覽器狀態儲存在檔案系統上。

我們建議建立 playwright/.auth 目錄,並將其新增至您的 .gitignore。您的驗證例程將產生已驗證的瀏覽器狀態,並將其儲存到此 playwright/.auth 目錄中的檔案。稍後,測試將重複使用此狀態並以已驗證的身分開始。

mkdir -p playwright/.auth
echo $'\nplaywright/.auth' >> .gitignore

在每次測試前登入

Playwright API 可以自動化與登入表單的互動

以下範例登入 GitHub。一旦執行這些步驟,瀏覽器內容將會通過驗證。

var page = await context.NewPageAsync();
await page.GotoAsync("https://github.com/login");
// Interact with login form
await page.GetByLabel("Username or email address").FillAsync("username");
await page.GetByLabel("Password").FillAsync("password");
await page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
// Continue with the test

為每個測試重新登入可能會減慢測試執行速度。為了緩解這種情況,請改為重複使用現有的驗證狀態。

重複使用已登入狀態

Playwright 提供了一種在測試中重複使用已登入狀態的方法。這樣您只需登入一次,然後就可以跳過所有測試的登入步驟。

Web 應用程式使用基於 Cookie 或基於令牌的身份驗證,其中已驗證的狀態儲存為 Cookie 或在 本地儲存 中。Playwright 提供了 BrowserContext.StorageStateAsync() 方法,可用於從已驗證的內容中檢索儲存狀態,然後建立具有預先填充狀態的新內容。

Cookie 和本地儲存狀態可以在不同的瀏覽器中使用。它們取決於您的應用程式的驗證模型:某些應用程式可能同時需要 Cookie 和本地儲存。

以下程式碼片段從已驗證的內容中檢索狀態,並使用該狀態建立新的內容。

// Save storage state into the file.
// Tests are executed in <TestProject>\bin\Debug\netX.0\ therefore relative path is used to reference playwright/.auth created in project root
await context.StorageStateAsync(new()
{
Path = "../../../playwright/.auth/state.json"
});

// Create a new context with the saved storage state.
var context = await browser.NewContextAsync(new()
{
StorageStatePath = "../../../playwright/.auth/state.json"
});

進階情境

Session Storage

重複使用已驗證的狀態涵蓋了基於 Cookie本地儲存 的驗證。極少數情況下,Session Storage 用於儲存與已登入狀態相關聯的資訊。Session Storage 專用於特定網域,並且不會跨頁面載入而持久保存。Playwright 沒有提供用於持久保存 Session Storage 的 API,但可以使用以下程式碼片段來儲存/載入 Session Storage。

// Get session storage and store as env variable
var sessionStorage = await page.EvaluateAsync<string>("() => JSON.stringify(sessionStorage)");
Environment.SetEnvironmentVariable("SESSION_STORAGE", sessionStorage);

// Set session storage in a new context
var loadedSessionStorage = Environment.GetEnvironmentVariable("SESSION_STORAGE");
await context.AddInitScriptAsync(@"(storage => {
if (window.location.hostname === 'example.com') {
const entries = JSON.parse(storage);
for (const [key, value] of Object.entries(entries)) {
window.sessionStorage.setItem(key, value);
}
}
})('" + loadedSessionStorage + "')");