chore: setup playwright

.gitignore

@@ -23,3 +23,8 @@ data.json
 temp
 .idea
 references/*
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/
+.env

package.json

@@ -1,51 +1,52 @@
 {
-    "name": "lineage",
-    "version": "0.2.0-dev",
-    "description": "",
-    "scripts": {
-        "dev": "node esbuild.config.mjs",
-        "build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
-        "version": "node version-bump.mjs && git add manifest.json versions.json",
-        "test:watch": "vitest",
-        "test": "vitest run",
-        "prepare": "husky install"
-    },
-    "keywords": [],
-    "author": "",
-    "license": "MIT",
-    "devDependencies": {
-        "@codemirror/language": "6.9.1",
-        "@commitlint/cli": "17.4.0",
-        "@commitlint/config-conventional": "17.4.0",
-        "@tsconfig/svelte": "5.0.2",
-        "@types/electron": "1.6.10",
-        "@types/node": "20.11.24",
-        "@types/uniqid": "5.3.4",
-        "@typescript-eslint/eslint-plugin": "7.1.0",
-        "@typescript-eslint/parser": "7.1.0",
-        "builtin-modules": "3.3.0",
-        "classnames": "2.5.1",
-        "esbuild": "0.20.1",
-        "esbuild-plugin-inline-worker": "0.1.1",
-        "esbuild-svelte": "0.8.0",
-        "eslint": "8.57.0",
-        "eslint-plugin-svelte": "2.35.1",
-        "husky": "8.0.3",
-        "lint-staged": "13.3.0",
-        "lucide-svelte": "0.344.0",
-        "monkey-around": "3.0.0",
-        "nanoid": "5.0.6",
-        "obsidian": "latest",
-        "prettier": "3.2.5",
-        "prettier-plugin-svelte": "3.2.2",
-        "svelte": "4.2.12",
-        "svelte-eslint-parser": "0.33.1",
-        "svelte-preprocess": "5.1.3",
-        "tslib": "2.6.2",
-        "typescript": "5.3.3",
-        "vitest": "1.3.1",
-        "fuse.js": "7.0.0",
-        "jsdom": "24.0.0"
-    },
-    "dependencies": {}
+  "name": "lineage",
+  "version": "0.2.0-dev",
+  "description": "",
+  "scripts": {
+    "dev": "node esbuild.config.mjs",
+    "build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
+    "version": "node version-bump.mjs && git add manifest.json versions.json",
+    "test:watch": "vitest",
+    "test": "vitest run",
+    "prepare": "husky install"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "devDependencies": {
+    "@codemirror/language": "6.9.1",
+    "@commitlint/cli": "17.4.0",
+    "@commitlint/config-conventional": "17.4.0",
+    "@playwright/test": "^1.42.1",
+    "@tsconfig/svelte": "5.0.2",
+    "@types/electron": "1.6.10",
+    "@types/node": "20.11.24",
+    "@types/uniqid": "5.3.4",
+    "@typescript-eslint/eslint-plugin": "7.1.0",
+    "@typescript-eslint/parser": "7.1.0",
+    "builtin-modules": "3.3.0",
+    "classnames": "2.5.1",
+    "esbuild": "0.20.1",
+    "esbuild-plugin-inline-worker": "0.1.1",
+    "esbuild-svelte": "0.8.0",
+    "eslint": "8.57.0",
+    "eslint-plugin-svelte": "2.35.1",
+    "fuse.js": "7.0.0",
+    "husky": "8.0.3",
+    "jsdom": "24.0.0",
+    "lint-staged": "13.3.0",
+    "lucide-svelte": "0.344.0",
+    "monkey-around": "3.0.0",
+    "nanoid": "5.0.6",
+    "obsidian": "latest",
+    "prettier": "3.2.5",
+    "prettier-plugin-svelte": "3.2.2",
+    "svelte": "4.2.12",
+    "svelte-eslint-parser": "0.33.1",
+    "svelte-preprocess": "5.1.3",
+    "tslib": "2.6.2",
+    "typescript": "5.3.3",
+    "vitest": "1.3.1",
+    "dotenv": "^16.4.5"
+  }
 }

playwright.config.ts

@@ -0,0 +1,42 @@
+import { defineConfig, devices } from '@playwright/test';
+import { config } from 'dotenv';
+
+config();
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+    testDir: './src/e2e',
+    /* 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: {
+        /* Base URL to use in actions like `await page.goto('/')`. */
+        // baseURL: 'http://127.0.0.1:3000',
+
+        /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+        trace: 'on-first-retry',
+    },
+
+    /* Configure projects for major browsers */
+    projects: [
+        {
+            name: 'chromium',
+            use: { ...devices['Desktop Chrome'] },
+        },
+    ],
+});

src/e2e/helpers/consts/selectors.ts

@@ -0,0 +1,7 @@
+export const PROMPT_INPUT = '.prompt-input';
+
+export const LINEAGE_VIEW = '.lineage__main';
+
+export const LINEAGE_CARD = '.lineage__card';
+
+export const MARKDOWN_PREVIEW = '.content';

src/e2e/helpers/general/delay.ts

@@ -0,0 +1,3 @@
+export const delay = async (milliseconds: number): Promise<void> => {
+    return new Promise((resolve) => setTimeout(resolve, milliseconds));
+};

src/e2e/helpers/interactions/run-command.ts

@@ -0,0 +1,10 @@
+import { Page } from '@playwright/test';
+import { PROMPT_INPUT } from '../consts/selectors';
+
+export const runCommand = async (obsidian: Page, commandName: string) => {
+    await obsidian.waitForSelector('.workspace-tabs');
+    await obsidian.keyboard.press('Control+P');
+    await obsidian.waitForSelector(PROMPT_INPUT);
+    await obsidian.keyboard.type(commandName);
+    await obsidian.keyboard.press('Enter');
+};

src/e2e/test.spec.ts

@@ -0,0 +1,27 @@
+import { _electron as electron } from 'playwright';
+import { expect, test } from '@playwright/test';
+import {
+    LINEAGE_CARD,
+    LINEAGE_VIEW,
+    MARKDOWN_PREVIEW,
+} from './helpers/consts/selectors';
+import { runCommand } from './helpers/interactions/run-command';
+
+test('can run', async ({ page }) => {
+    const electronApp = await electron.launch({
+        executablePath: process.env.OBSIDIAN_EXECUTABLE_PATH,
+    });
+
+    const obsidian = await electronApp.firstWindow();
+    await runCommand(obsidian, 'Lineage create');
+    await obsidian.waitForSelector(LINEAGE_VIEW);
+    await obsidian.focus(LINEAGE_VIEW);
+    const typedText = 'card 1';
+    await obsidian.keyboard.type(typedText);
+    await obsidian.keyboard.press('Control+Shift+Enter');
+    const cards = await obsidian.$$(LINEAGE_CARD);
+    expect(cards.length).toBe(1);
+    const content = await cards[0].$(MARKDOWN_PREVIEW);
+    if (!content) throw new Error('content is undefined');
+    expect(await content.textContent()).toEqual(typedText);
+});

src/view/components/container/column/components/group/components/card/components/content/content.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
-    import { getPlugin, getStore } from 'src/view/components/container/context';
-    import { ActiveStatus } from 'src/view/components/container/column/components/group/components/active-status.enum';
-    import {
-        markdownPreviewAction
-    } from 'src/view/components/container/column/components/group/components/card/components/content/actions/markdown-preview-action';
+	import { getPlugin, getStore } from 'src/view/components/container/context';
+	import { ActiveStatus } from 'src/view/components/container/column/components/group/components/active-status.enum';
+	import {
+		markdownPreviewAction
+	} from 'src/view/components/container/column/components/group/components/card/components/content/actions/markdown-preview-action';
 
-    export let active: ActiveStatus | null;
+	export let active: ActiveStatus | null;
 
     export let content: string;
     // eslint-disable-next-line no-undef
@@ -35,7 +35,7 @@
 </script>
 
 <div
-    class={'lineage__card content markdown-preview-view ' + (active?classes[active]:'')}
+    class={' content markdown-preview-view ' + (active?classes[active]:'')}
     data-active={active||"inactive"}
     on:click={onClick}
 	use:markdownPreviewAction={content}

vite.config.mjs

@@ -4,7 +4,7 @@ const configMain = defineConfig({
     test: {
         threads: true,
         environment: 'node',
-        exclude: ['temp/**', "node_modules/**"],
+        exclude: ['temp/**', "node_modules/**","src/e2e/**"],
     },
 });