Add Playwright example

de.vogella.git.first/playwright-example/README.md

@@ -0,0 +1,29 @@
+# WordPress Playwright Example
+
+This example demonstrates how to use the `@wordpress/e2e-test-utils-playwright`
+package to create a simple end-to-end test that creates a page, saves it as a
+draft, publishes it and verifies the published page in a second browser
+context.
+
+## Setup
+
+1. Install dependencies (requires internet access):
+   ```sh
+   npm install --save-dev playwright @wordpress/e2e-test-utils-playwright
+   ```
+2. Ensure a WordPress site is running locally and accessible via the
+   `WP_BASE_URL` environment variable (default is `http://localhost:8888`).
+   Provide admin credentials via `WP_USERNAME` and `WP_PASSWORD` environment
+   variables.
+
+## Running the test
+
+Execute Playwright using the provided npm script:
+
+```sh
+npm test
+```
+
+This will run the `create-and-publish-page.spec.js` test which logs into the
+WordPress admin, creates and publishes a page, then verifies the content from a
+new browser context to simulate a logged-out user.

de.vogella.git.first/playwright-example/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "playwright-example",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "playwright test"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs"
+}

de.vogella.git.first/playwright-example/playwright.config.js

@@ -0,0 +1,13 @@
+const { devices } = require('@playwright/test');
+
+/** @type {import('@playwright/test').PlaywrightTestConfig} */
+const config = {
+  timeout: 60000,
+  use: {
+    baseURL: process.env.WP_BASE_URL || 'http://localhost:8888',
+    headless: true,
+    trace: 'on-first-retry',
+  },
+};
+
+module.exports = config;

de.vogella.git.first/playwright-example/tests/create-and-publish-page.spec.js

@@ -0,0 +1,33 @@
+const { test, expect } = require('@playwright/test');
+const {
+  loginUser,
+  createNewPost,
+  publishPost,
+} = require('@wordpress/e2e-test-utils-playwright');
+
+// This example assumes you have a local WordPress instance running and the
+// WP_USERNAME and WP_PASSWORD environment variables set for an administrator.
+
+/**
+ * Create a page, save it as draft, publish it and then verify it is visible
+ * from another browser context.
+ */
+
+test('create, save and publish page', async ({ browser, page }) => {
+  await loginUser();
+
+  const title = `Playwright Test Page ${Date.now()}`;
+  await createNewPost({ postType: 'page', title });
+  // The utils automatically save drafts when creating posts.
+
+  // Publish the page
+  await publishPost();
+
+  const pageUrl = page.url();
+
+  // Open the public page in a new browser context (logged out)
+  const userContext = await browser.newContext();
+  const userPage = await userContext.newPage();
+  await userPage.goto(pageUrl);
+  await expect(userPage.locator('body')).toContainText(title);
+});