PlayWright ialah rangka kerja ujian automasi UI Web yang dibangunkan oleh Microsoft.
Ia bertujuan untuk menyediakan rangka kerja ujian automasi merentas platform, merentas bahasa, dan merentas penyemak imbas yang turut menyokong penyemak imbas mudah alih.
Seperti yang diterangkan pada halaman utama rasminya:
Apakah rangka kerja ujian automasi UI Web terbaik yang tersedia hari ini? Pilihan yang menonjol termasuk Selenium berusia sedekad, Cypress yang popular baru-baru ini, dan yang kami perkenalkan di sini—PlayWright. Bagaimana mereka berbeza? Di bawah ialah ringkasan perbandingan untuk rujukan anda
| Feature | PlayWright | Selenium | Cypress |
|---|---|---|---|
| Supported Languages | JavaScript, Java, C#, Python | JavaScript, Java, C#, Python, Ruby | JavaScript/TypeScript |
| Supported Browsers | Chrome, Edge, Firefox, Safari | Chrome, Edge, Firefox, Safari, IE | Chrome, Edge, Firefox, Safari |
| Testing Framework | Frameworks for supported languages | Frameworks for supported languages | Frameworks for supported languages |
| Usability | Easy to use and configure | Complex setup with a learning curve | Easy to use and configure |
| Code Complexity | Simple | Moderate | Simple |
| DOM Manipulation | Simple | Moderate | Simple |
| Community Maturity | Improving gradually | Highly mature | Fairly mature |
| Headless Mode Support | Yes | Yes | Yes |
| Concurrency Support | Supported | Supported | Depends on CI/CD tools |
| iframe Support | Supported | Supported | Supported via plugins |
| Driver | Not required | Requires a browser-specific driver | Not required |
| Multi-Tab Operations | Supported | Not supported | Supported |
| Drag and Drop | Supported | Supported | Supported |
| Built-in Reporting | Yes | No | Yes |
| Cross-Origin Support | Supported | Supported | Supported |
| Built-in Debugging | Yes | No | Yes |
| Automatic Wait | Yes | No | Yes |
| Built-in Screenshot/Video | Yes | No video recording | Yes |
Walaupun PlayWright menyokong berbilang bahasa, ia sangat bergantung pada Node.js. Tidak kira sama ada anda menggunakan versi Python atau Java, PlayWright memerlukan persekitaran Node.js semasa permulaan, memuat turun pemacu Node.js. Oleh itu, kami akan menumpukan pada JavaScript/TypeScript untuk panduan ini.
# Using npm npm init playwright@latest # Using yarn yarn create playwright
Jika anda memilih untuk memuat turun penyemak imbas, PlayWright akan memuat turun Chromium, Firefox dan WebKit, yang mungkin mengambil sedikit masa. Proses ini berlaku hanya semasa persediaan pertama melainkan versi PlayWright dikemas kini.
Selepas permulaan, anda akan mendapat templat projek:
playwright.config.ts # PlayWright configuration file package.json # Node.js configuration file package-lock.json # Node.js dependency lock file tests/ # Your test directory example.spec.ts # Template test case tests-examples/ # Example tests directory demo-todo-app.spec.ts # Example test case
Jalankan contoh kes ujian:
npx playwright test
Ujian dilaksanakan secara senyap (dalam mod tanpa kepala), dan keputusan dipaparkan sebagai:
Running 6 tests using 6 workers 6 passed (10s) To open the last HTML report run: npx playwright show-report
Berikut ialah contoh.spec.ts kes ujian:
import { test, expect } from '@playwright/test';
test('has title', async ({ page }) => {
await page.goto('https://playwright.dev/');
await expect(page).toHaveTitle(/Playwright/);
});
test('get started link', async ({ page }) => {
await page.goto('https://playwright.dev/');
await page.getByRole('link', { name: 'Get started' }).click();
await expect(page).toHaveURL(/.*intro/);
});
Setiap kaedah ujian mempunyai:
Kaedah utama termasuk:
Berikut ialah arahan biasa:
# Using npm npm init playwright@latest # Using yarn yarn create playwright
playwright.config.ts # PlayWright configuration file package.json # Node.js configuration file package-lock.json # Node.js dependency lock file tests/ # Your test directory example.spec.ts # Template test case tests-examples/ # Example tests directory demo-todo-app.spec.ts # Example test case
npx playwright test
Gunakan ciri codegen untuk merekod interaksi:
Running 6 tests using 6 workers 6 passed (10s) To open the last HTML report run: npx playwright show-report
Kod yang direkodkan boleh disalin ke dalam fail anda. Nota: Perakam mungkin tidak mengendalikan tindakan yang rumit seperti melayang.
Bahagian ini memperkenalkan beberapa tindakan Penulis Drama biasa untuk berinteraksi dengan elemen halaman. Ambil perhatian bahawa objek pencari yang diperkenalkan sebelum ini sebenarnya tidak mengesan elemen pada halaman semasa penciptaannya. Walaupun elemen itu tidak wujud pada halaman, menggunakan kaedah pencari elemen untuk mendapatkan objek pencari tidak akan membuang sebarang pengecualian. Carian elemen sebenar hanya berlaku semasa interaksi. Ini berbeza daripada kaedah findElement Selenium, yang mencari terus elemen pada halaman dan membuang pengecualian jika elemen itu tidak ditemui.
Gunakan kaedah isian untuk input teks, terutamanya menyasarkan ,