feat: add playwright and example test

Author: lifeiscontent

.gitignore

@@ -28,3 +28,6 @@ release
 package-lock.json
 pnpm-lock.yaml
 yarn.lock
+/test-results/
+/playwright-report/
+/playwright/.cache/

e2e/example.spec.ts

@@ -0,0 +1,8 @@
+import { test, expect, _electron as electron } from "@playwright/test";
+
+test("homepage has title and links to intro page", async () => {
+  const app = await electron.launch({ args: [".", "--no-sandbox"] });
+  const page = await app.firstWindow();
+  expect(await page.title()).toBe("Electron + Vite + React");
+  await page.screenshot({ path: "e2e/screenshots/example.png" });
+});

e2e/screenshots/example.png

@@ -14,9 +14,11 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build && electron-builder",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "e2e": "npx playwright test"
   },
   "devDependencies": {
+    "@playwright/test": "^1.29.1",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
     "@vitejs/plugin-react": "^3.0.0",

package.json

@@ -0,0 +1,54 @@
+import type { PlaywrightTestConfig } from "@playwright/test";
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+const config: PlaywrightTestConfig = {
+  testDir: "./e2e",
+  /* Maximum time one test can run for. */
+  timeout: 30 * 1000,
+  expect: {
+    /**
+     * Maximum time expect() should wait for the condition to be met.
+     * For example in `await expect(locator).toHaveText();`
+     */
+    timeout: 5000,
+  },
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: "html",
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
+    actionTimeout: 0,
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    // baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: "on-first-retry",
+  },
+
+  /* Folder for test artifacts such as screenshots, videos, traces, etc. */
+  // outputDir: 'test-results/',
+
+  /* Run your local dev server before starting the tests */
+  // webServer: {
+  //   command: 'npm run start',
+  //   port: 3000,
+  // },
+};
+
+export default config;