快捷導(dǎo)航

一款強(qiáng)大的端到端測試工具Playwright介紹

更新時(shí)間：2023年01月29日 15:55:51 作者：KooFE

這篇文章主要為大家介紹了一款強(qiáng)大的端到端測試工具Playwright介紹，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

Playwright

Playwright 是微軟公司開源的一款 UI 自動(dòng)化測試工具，它的第一個(gè)版本 v0.10.0 發(fā)布于 2020 年 2 月初，目前的最新版本是 v1.18.0，版本的迭代速度還是很快的。

作為一款端到端的測試工具，在過去短短的兩年時(shí)間里，Playwright 已經(jīng)贏得了越來越多開發(fā)人員的青睞。Best of JS 網(wǎng)站對比了各個(gè)測試框架 2021 年在 GitHub 新增的 star 數(shù)量，Playwright 位于榜首位置，其受歡迎的程度可見一斑。本文將對 Playwright 的特點(diǎn)做一些的介紹。

跨瀏覽器

Playwright 支持了所有現(xiàn)代的瀏覽器內(nèi)核，包括 Chromium, WebKit 和 Firefox，因此幾大主流的瀏覽器 Chrome、Edge、Firefox、Opera 以及 Opera 都支持。如果要對頁面做兼容性方面的測試，Playwright 是一個(gè)很好的選擇，畢竟 Puppeteer 支持的瀏覽器比較少。

支持多編程語言

Playwright 提供了多種編程語言的 API，包括 TypeScript、JavaScript、Python、.NET 和 Java，除了前端之外的其他工程師，也可以選擇自己熟悉的語言開發(fā)功能。比如，測試工程師可能對 Python 更為熟悉。在語言的支持方面，Puppeteer 做得也不是很好，很多人在抱怨它的 Python API 很難用。

const { chromium, firefox, webkit } = require('playwright');
(async () =&gt; {
  const browser = await chromium.launch();  // Or 'firefox' or 'webkit'.
  const page = await browser.newPage();
  await page.goto('http://example.com');
  // other actions...
  await browser.close();
})();

保存登錄信息

在測試中，經(jīng)常會(huì)有頁面登陸的場景，在單元測試中為了提高效率避免多次登陸，Playwright 提供了保存登陸上下文信息的功能。只需要將已保存的登陸信息，重新加載到頁面中，即可恢復(fù)到用戶已登陸的狀態(tài)。

執(zhí)行環(huán)境的隔離

Playwright 新增 Context 的概念，它能夠在單個(gè)瀏覽器實(shí)例中提供相互隔離的執(zhí)行環(huán)境。特別是在同時(shí)測試多個(gè)頁面時(shí)，這個(gè)特性是非常有用的，很方便的實(shí)現(xiàn)網(wǎng)頁頻繁切換。每個(gè)頁面在各自的 Context 中執(zhí)行，頁面之間不會(huì)產(chǎn)生干擾，包括 Cookies 等信息都是隔離的。

const { chromium } = require('playwright');
// Create a Chromium browser instance
const browser = await chromium.launch();
// Create two isolated browser contexts
const userContext = await browser.newContext();
const adminContext = await browser.newContext();
// Create pages and interact with contexts independently

選擇器

Playwright 支持多種元素定位方式，比如 CSS 選擇器、XPath 選擇器等，而且使用起來比較友好。

// Clicks a &lt;button&gt; that has either a "Log in" or "Sign in" text.
await page.locator('button:has-text("Log in"), button:has-text("Sign in")').click();

自動(dòng)等待

Playwright 在與元素交互操作（如點(diǎn)擊操作）之前，會(huì)進(jìn)行一系列可操作性檢查，以確保這些行動(dòng)按預(yù)期運(yùn)行。它會(huì)自動(dòng)等待所有相關(guān)檢查通過，然后才執(zhí)行相關(guān)的操作。這樣可以避免元素因?yàn)闆]有渲染，而導(dǎo)致交互操作的失敗。在其他的一些測試框架中，需要開發(fā)人員自己手動(dòng)設(shè)置等待時(shí)間，而且手動(dòng)設(shè)置的時(shí)間往往也是不精確的。

測試框架

Playwright 作為一個(gè)測試框架，集成了斷言、API 測試、測試注解等功能。在測試領(lǐng)域，Playwright 對標(biāo)的應(yīng)該是 Selenium，并且在測試領(lǐng)域中會(huì)有更多的應(yīng)用場景。在開發(fā)體驗(yàn)和運(yùn)行效率方面，Playwright 可謂是后來居上，新技術(shù)的應(yīng)用使其遠(yuǎn)遠(yuǎn)優(yōu)于 Selenium。另外，在對移動(dòng)端的支持、以及腳本錄制等方面，Playwright 也是有很好的表現(xiàn)。

import { test, expect } from '@playwright/test';
test('basic test', async ({ page }) => {
  await page.goto('https://playwright.dev/');
  const title = page.locator('.navbar__inner .navbar__title');
  await expect(title).toHaveText('Playwright');
});

本文只對 Playwright 做了一些簡單的介紹，并未深入的展開，從當(dāng)前的使用的趨勢和熱度來看，還是有必要對它進(jìn)行一定的了解和關(guān)注，更多關(guān)于端到端測試工具Playwright的資料請關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: