Initial project setup with Playwright, including CI configuration, environment support, and example test

Author: munderseth

.env.example

@@ -0,0 +1 @@
+BASE_URL=https://example.com

.github/workflows/ci.yml

@@ -0,0 +1,55 @@
+name: Playwright CI
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+  workflow_dispatch:
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Install Playwright browser
+        run: npx playwright install --with-deps chromium
+
+      - name: Run Playwright tests
+        run: npm test
+
+      - name: Setup Testspace client
+        uses: testspace-com/setup-testspace@v1
+        with:
+          domain: ${{ github.repository_owner }}.stridespace.com
+
+      - name: Publish results to Testspace
+        run: testspace test-results/junit/results.xml
+
+      - name: Upload JUnit report
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: junit-report
+          path: test-results/junit/results.xml
+          if-no-files-found: ignore
+
+      - name: Upload HTML report
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: playwright-html-report
+          path: playwright-report/
+          if-no-files-found: ignore

.gitignore

@@ -0,0 +1,9 @@
+node_modules/
+playwright-report/
+test-results/
+.playwright/
+.env
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*

README.md

@@ -0,0 +1,151 @@
+# JavaScript Playwright Scenarios
+
+Minimal Playwright setup for JavaScript-based browser scenarios with:
+
+- HTML reporting
+- JUnit XML reporting
+- Optional `.env` support via `dotenv`
+- A hello-world smoke test
+- Common npm scripts for local execution
+
+## Prerequisites
+
+- Node.js 20+
+- npm 10+
+
+## Initial setup
+
+If starting from an empty folder, create a project manifest:
+
+```bash
+npm init -y
+```
+
+Install project dependencies:
+
+```bash
+npm install --save-dev @playwright/test dotenv
+```
+
+Optional: create a local environment file from the example:
+
+```bash
+cp .env.example .env
+```
+
+Install the browser used by this starter project:
+
+```bash
+npx playwright install chromium
+```
+
+Run the hello-world verification test:
+
+```bash
+npm run test:hello
+```
+
+## Running tests
+
+Run all tests:
+
+```bash
+npm test
+```
+
+Run a single file directly:
+
+```bash
+npx playwright test tests/hello-world.spec.js
+```
+
+Run headed mode:
+
+```bash
+npm run test:headed
+```
+
+Run with Playwright UI mode:
+
+```bash
+npm run test:ui
+```
+
+Run in debug mode:
+
+```bash
+npm run test:debug
+```
+
+## Reports
+
+Every test run writes:
+
+- HTML report to `playwright-report/`
+- JUnit XML to `test-results/junit/results.xml`
+
+Open the HTML report after a run:
+
+```bash
+npm run report:html
+```
+
+## CI (GitHub Actions)
+
+A minimal workflow is included at `.github/workflows/ci.yml`.
+
+It runs on:
+
+- push to `main` or `master`
+- pull requests
+- manual trigger via `workflow_dispatch`
+- repository dispatch event type `workspace_dispatch`
+
+The workflow uploads both:
+
+- JUnit XML report
+- Playwright HTML report
+
+### Testspace publishing
+
+The workflow can also publish JUnit results to Testspace.
+
+Configure these repository settings in GitHub:
+
+- Variable: TESTSPACE_DOMAIN
+    Example value: your-org.testspace.com
+- Secret: TESTSPACE_TOKEN
+    Required for private repositories
+
+When TESTSPACE_DOMAIN is set, CI runs the Testspace setup action and publishes:
+
+- test-results/junit/results.xml
+
+## Changing the target URL
+
+The sample test uses `BASE_URL` and defaults to `https://example.com`.
+
+You can store it in a `.env` file:
+
+```bash
+BASE_URL=https://example.com
+```
+
+Example:
+
+```bash
+BASE_URL=https://playwright.dev npm run test:hello
+```
+
+If you change `BASE_URL`, update the sample assertions to match that page.
+
+## Project structure
+
+```text
+.
+|-- package.json
+|-- playwright.config.js
+|-- README.md
+`-- tests/
+    `-- hello-world.spec.js
+```

package-lock.json

@@ -0,0 +1,19 @@
+{
+  "name": "javascript.playwright-scenarios",
+  "version": "1.0.0",
+  "private": true,
+  "description": "Starter setup for running JavaScript Playwright scenarios with HTML and JUnit reporting.",
+  "scripts": {
+    "test": "playwright test",
+    "test:headed": "playwright test --headed",
+    "test:ui": "playwright test --ui",
+    "test:debug": "playwright test --debug",
+    "test:hello": "playwright test tests/hello-world.spec.js",
+    "report:html": "playwright show-report playwright-report",
+    "install:browsers": "playwright install chromium"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.60.0",
+    "dotenv": "^16.6.1"
+  }
+}

package.json

@@ -0,0 +1,41 @@
+require('dotenv').config();
+
+const { defineConfig, devices } = require('@playwright/test');
+const isWSL = !!process.env.WSL_DISTRO_NAME;
+
+module.exports = defineConfig({
+  testDir: './tests',
+  timeout: 30_000,
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [
+    ['list'],
+    ['html', { outputFolder: 'playwright-report', open: 'never' }],
+    ['junit', { outputFile: 'test-results/junit/results.xml' }]
+  ],
+  use: {
+    baseURL: process.env.BASE_URL || 'https://example.com',
+    trace: 'on-first-retry',
+    screenshot: 'only-on-failure',
+    video: 'retain-on-failure'
+  },
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        ...devices['Desktop Chrome'],
+        launchOptions: {
+          args: [
+            '--window-position=80,80',
+            '--window-size=1440,900',
+            '--start-maximized',
+            ...(isWSL ? ['--ozone-platform=x11', '--disable-gpu'] : [])
+          ]
+        }
+      }
+    }
+  ],
+  outputDir: 'test-results/artifacts'
+});

playwright.config.js

@@ -0,0 +1,8 @@
+const { test, expect } = require('@playwright/test');
+
+test('hello world smoke test', async ({ page, baseURL }) => {
+  await page.goto(baseURL);
+  await page.waitForTimeout(5000);
+  await expect(page).toHaveTitle(/Example Domain/);
+  await expect(page.getByRole('heading', { name: 'Example Domain' })).toBeVisible();
+});