Playwright-Installation

Playwright ist eine Node.js-Bibliothek, daher müssen wir Node.js lokal installieren. Wenn Sie es bereits installiert haben, können Sie diesen Schritt überspringen.

1. Node.js installieren

Playwright empfiehlt offiziell Node.js.

  • Öffnen Siedie offizielle Node.js-Website
  • Herunterladen und installierenLTS (Long-Term-Support-Version)
  • Überprüfen Sie, ob die Installation erfolgreich war:

    node -v
    npm -v

    Solange Sie die Versionsnummer sehen können.

Weitere Installationsoptionen finden Sie unter:https://www.example.com/nodejs/nodejs-install-setup.html

2. Erstellen Sie ein neues Projektverzeichnis

Wenn Node.js erfolgreich installiert ist, können wir mit der Installation und Verwendung von Playwright beginnen.

In der Befehlszeile ausführen:

mkdir example-playwright-demo
cd example-playwright-demo

3. Playwright initialisieren und installieren

Ausführen:

npm init playwright@latest

Während der Installation werden Sie aufgefordert:

  • Wählen Sie eine Sprache:JavaScriptoderTypeScriptWählen Sie diejenige, mit der Sie vertraut sind
  • Ob Testbeispiele installiert werden sollen: Empfohlen wird die Auswahl vonJa(erleichtert das Lernen)
  • Ob Browser heruntergeladen werden sollen: Wählen SieJa(Playwright lädt die drei großen Engines herunter: Chromium, Firefox, WebKit)

Nach der Installation sieht Ihr Projektverzeichnis in etwa so aus:

playwright-demo/
├─ tests/                # 示例测试用例
├─ playwright.config.js  # 配置文件
├─ package.json
└─ node_modules/

4. Mit yarn initialisieren

yarn create playwright

5. Mit pnpm initialisieren

pnpm create playwright

Die Initialisierungsergebnisse der drei Paketmanager sind exakt identisch; wählen Sie einfach den aus, mit dem Sie vertraut sind.


Manuelle Installation

Wenn Sie bereits ein Projekt haben und Playwright manuell hinzufügen möchten, können Sie dies in zwei Schritten tun.

Schritt 1: Installieren Sie das npm-Paket

# 安装 Playwright Test 作为开发依赖
npm i -D @playwright/test

# 如果只需要浏览器自动化库(不用测试运行器)
npm i playwright

Schritt 2: Browser installieren

# 安装所有浏览器(Chromium、Firefox、WebKit)
npx playwright install

# 或者只安装特定浏览器
npx playwright install chromium
npx playwright install firefox
npx playwright install webkit

Browser-Binärdateien werden standardmäßig in das Cache-Verzeichnis des Betriebssystems heruntergeladen (z. B. bei macOS~/Library/Caches/ms-playwright/), und sie belegen keinen Speicherplatz in Ihrem Projekt.


Hinweise zur Browser-Installation

Playwright installiert Test-Builds von Browsern,Test-Buildsnicht die Browser, die Sie täglich verwenden:

Name in PlaywrightEntsprechender BrowserBeschreibung
ChromiumDie Open-Source-Grundlage von Google ChromeDie Kern-Engine von Chrome; das Verhalten ist nahezu identisch
FirefoxMozilla FirefoxOffizieller Firefox-Testbuild
WebKitApples Safari-EngineDie zugrunde liegende Rendering-Engine von Safari

Diese Test-Builds unterscheiden sich geringfügig von den Browsern, die Nutzer täglich verwenden, verhalten sich jedoch in der überwiegenden Mehrheit der Testszenarien konsistent.


Installation überprüfen

Führen Sie nach Abschluss der Installation den folgenden Befehl aus, um den Erfolg zu überprüfen:

# 查看已安装的 Playwright 版本和浏览器
npx playwright --version

Die erwartete Ausgabe sieht ungefähr wie folgt aus:

Version 1.52.0

Führen Sie die Beispieltests aus, um zu überprüfen, ob alles funktioniert:

npx playwright test

Wenn Sie die Ausgabe des Testlaufs sehen (einschließlich bestandener und fehlgeschlagener Tests), war die Installation erfolgreich.


Häufige Installationsprobleme

Das Herunterladen von Browsern ist langsam

Die Browser-Binärdateien sind groß (etwa 400-500 MB), und die Downloadgeschwindigkeit hängt von Ihrer Netzwerkumgebung ab.

Sie können einen inländischen Mirror verwenden, indem Sie Umgebungsvariablen festlegen:

# 设置下载源为国内镜像
export PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright/
npx playwright install

Fehlende Systemabhängigkeiten im Linux-System

Das Ausführen von Playwright unter Linux erfordert die Installation zusätzlicher Systembibliotheken.

# 安装 Playwright 所需的系统依赖
npx playwright install-deps

# 如果只需要某个浏览器对应的依赖
npx playwright install-deps chromium

Wenn Sie Playwright in einem Docker-Container verwenden, nutzen Sie das offizielle Microsoft Docker-Image (mcr.microsoft.com/playwright), bei dem alle Abhängigkeiten vorinstalliert sind.


Erstes Skript: Hello World

Erstellen Sie eine neuetest.jsDatei und schreiben Sie den folgenden Inhalt:

Beispiel

// test.js
const { chromium } = require('playwright');

(async () => {
  // 1. Browser starten
  const browser = await chromium.launch({ headless: false }); // Auf false setzen, um den Browser zu sehen
  const page = await browser.newPage();

  // 2. Webseite öffnen
  await page.goto('https://www.baidu.com');

  // 3. Screenshot aufnehmen und speichern
  await page.screenshot({ path: 'baidu.png' });

  // 4. Browser schließen
  await browser.close();

  console.log("Screenshot gespeichert in example.png");
})();

Ausführen:

node test.js

Das Obige ist ein einfaches Playwright-Beispiel, das einen Screenshot der Baidu-Startseite aufnehmen kann.

Weitere Erweiterungen