From b371b0aa816b6a2d98cb8f8ded27191954f31be6 Mon Sep 17 00:00:00 2001
From: Trang Doan <doantranghp2000@gmail.com>
Date: Thu, 26 Feb 2026 15:08:34 -0500
Subject: [PATCH 1/2] curr stage

---
 apps/obsidian/.gitignore                    |   3 +
 apps/obsidian/e2e/NOTES.md                  | 159 ++++++++++++++++++++
 apps/obsidian/e2e/helpers/obsidian-setup.ts | 132 ++++++++++++++++
 apps/obsidian/e2e/playwright.config.ts      |  17 +++
 apps/obsidian/e2e/tests/smoke.spec.ts       | 123 +++++++++++++++
 apps/obsidian/package.json                  |   5 +-
 pnpm-lock.yaml                              |  57 ++++---
 7 files changed, 477 insertions(+), 19 deletions(-)
 create mode 100644 apps/obsidian/.gitignore
 create mode 100644 apps/obsidian/e2e/NOTES.md
 create mode 100644 apps/obsidian/e2e/helpers/obsidian-setup.ts
 create mode 100644 apps/obsidian/e2e/playwright.config.ts
 create mode 100644 apps/obsidian/e2e/tests/smoke.spec.ts

diff --git a/apps/obsidian/.gitignore b/apps/obsidian/.gitignore
new file mode 100644
index 000000000..81613c0af
--- /dev/null
+++ b/apps/obsidian/.gitignore
@@ -0,0 +1,3 @@
+e2e/test-vault/
+e2e/test-results/
+e2e/html-report/
diff --git a/apps/obsidian/e2e/NOTES.md b/apps/obsidian/e2e/NOTES.md
new file mode 100644
index 000000000..9dab62b8d
--- /dev/null
+++ b/apps/obsidian/e2e/NOTES.md
@@ -0,0 +1,159 @@
+# E2E Testing for Obsidian Plugin — Notes
+
+## Approaches Considered
+
+### Option 1: Playwright `electron.launch()`
+
+The standard Playwright approach for Electron apps — point `executablePath` at the binary and let Playwright manage the process lifecycle.
+
+**Pros:**
+- First-class Playwright API — `app.evaluate()` runs code in the main process, not just renderer
+- Automatic process lifecycle management (launch, close, cleanup)
+- Access to Electron-specific APIs (e.g., `app.evaluate(() => process.env)`)
+- Well-documented, widely used for Electron testing
+
+**Cons:**
+- **Does not work with Obsidian.** Obsidian's executable is a launcher that loads an `.asar` package (`obsidian-1.11.7.asar`) and forks a new Electron process. Playwright connects to the initial process, which exits, causing `kill EPERM` and connection failures.
+- No workaround without modifying Obsidian's startup or using a custom Electron shell
+
+**Verdict:** Not viable for Obsidian.
+
+---
+
+### Option 2: CDP via `chromium.connectOverCDP()` (chosen)
+
+Launch Obsidian as a subprocess with `--remote-debugging-port=9222`, then connect via Chrome DevTools Protocol.
+
+**Pros:**
+- Works with Obsidian's forked process architecture — the debug port is inherited by the child process
+- Full access to renderer via `page.evaluate()` — Obsidian's global `app` object is available
+- Keyboard/mouse interaction works normally
+- Can take screenshots, traces, and use all Playwright assertions
+- Process is managed explicitly — clear control over startup and teardown
+
+**Cons:**
+- No main process access (can't call Electron APIs directly, only renderer-side `window`/`app`)
+- Must manually manage process lifecycle (spawn, pkill, port polling)
+- Fixed debug port (9222) means tests can't run in parallel across multiple Obsidian instances without port management
+- Port polling adds ~2-5s startup overhead
+- `pkill -f Obsidian` in setup is aggressive — kills ALL Obsidian instances, not just test ones
+
+**Verdict:** Works well for PoC. Sufficient for single-worker CI/local testing.
+
+---
+
+### Option 3: Obsidian's built-in plugin testing (not explored)
+
+Obsidian has no official testing framework. Some community approaches exist (e.g., `obsidian-jest`, hot-reload-based testing), but none are mature or maintained.
+
+**Verdict:** Not a real option today.
+
+---
+
+## What We Learned
+
+### Obsidian internals accessible via `page.evaluate()`
+- `app.plugins.plugins["@discourse-graph/obsidian"]` — check plugin loaded
+- `app.vault.getMarkdownFiles()` — list files
+- `app.vault.read(file)` — read file content
+- `app.vault.create(name, content)` — create files
+- `app.workspace.openLinkText(path, "", false)` — open a file in the editor
+- `app.commands.executeCommandById(id)` — could execute commands directly (alternative to command palette UI)
+
+### Plugin command IDs
+Commands are registered with IDs like `@discourse-graph/obsidian:create-discourse-node`. The command palette shows them as "Discourse Graph: Create discourse node".
+
+### Modal DOM structure
+The `ModifyNodeModal` renders React inside Obsidian's `.modal-container`:
+- Node type: `<select>` element (`.modal-container select`)
+- Content: `<input type="text">` (`.modal-container input[type='text']`)
+- Confirm: `<button class="mod-cta">`
+
+### Vault configuration
+Minimum config for plugin to load:
+- `.obsidian/community-plugins.json` → `["@discourse-graph/obsidian"]`
+- `.obsidian/app.json` → `{"livePreview": true}` (restricted mode must be off, but this is handled by Obsidian detecting the plugins dir)
+- Plugin files (`main.js`, `manifest.json`, `styles.css`) in `.obsidian/plugins/@discourse-graph/obsidian/`
+
+---
+
+## Proposal: Full Agentic Testing Flow
+
+### Goal
+AI coding agents (Cursor, Claude Code) can run `pnpm test:e2e` after making changes to automatically verify features work end-to-end. The test suite should be comprehensive enough to catch regressions, fast enough to run frequently, and deterministic enough to trust the results.
+
+### Phase 1: Stabilize the PoC (current state + hardening)
+
+**Isolation improvements:**
+- Use a unique temp directory per test run (`os.tmpdir()`) instead of a fixed `test-vault/` path to avoid stale state
+- Use a random debug port to allow parallel runs
+- Replace `pkill -f Obsidian` with tracking the specific child PID — parse it from `lsof -i :<port>` after launch
+- Add a global setup/teardown in Playwright config to manage the single Obsidian instance across all tests
+
+**Reliability improvements:**
+- Replace `waitForTimeout()` calls with proper waitFor conditions (e.g., `waitForSelector`, `waitForFunction`)
+- Add retry logic for CDP connection (currently fails hard on timeout)
+- Add a `test.beforeEach` that resets vault state (delete all non-config files) instead of full vault recreation
+
+### Phase 2: Expand test coverage
+
+**Core plugin features to test:**
+- Create each discourse node type (Question, Claim, Evidence, Source)
+- Verify frontmatter (`nodeTypeId`) is set correctly
+- Verify file naming conventions (e.g., `QUE - `, `CLM - `, `EVD - `, `SRC - `)
+- Open node type menu via hotkey (`Cmd+\`)
+- Discourse context view toggle
+- Settings panel opens and renders
+
+**Vault-level tests:**
+- Create multiple nodes and verify they appear in file explorer
+- Verify node format regex matching (files follow the format pattern)
+
+**Use `app.commands.executeCommandById()` as the primary way to trigger commands** — faster, more reliable, and avoids flaky command palette typing. Reserve command palette tests for testing the palette itself.
+
+### Phase 3: Agentic integration
+
+**For agents to use the tests effectively:**
+
+1. **Fast feedback loop** — Tests should complete in <30s total. Current PoC is ~14s for 2 tests, which is good. Keep Obsidian running between test files using Playwright's `globalSetup`/`globalTeardown`.
+
+2. **Clear error messages** — When a test fails, the agent needs to understand WHY. Add descriptive assertion messages:
+   ```ts
+   expect(pluginLoaded, "Plugin should be loaded — check dist/ is built and plugin ID matches manifest.json").toBe(true);
+   ```
+
+3. **Screenshot-on-failure for visual debugging** — Already configured. Consider adding `page.screenshot()` at key checkpoints even on success, so agents can visually verify state.
+
+4. **Test file organization** — One test file per feature area:
+   ```
+   e2e/tests/
+   ├── plugin-load.spec.ts        # Plugin loads, settings exist
+   ├── node-creation.spec.ts      # Create each node type
+   ├── command-palette.spec.ts    # Command palette interactions
+   ├── discourse-context.spec.ts  # Context view, relations
+   └── settings.spec.ts           # Settings panel
+   ```
+
+5. **CI integration** — Run in GitHub Actions with a macOS runner. Obsidian would need to be pre-installed on the runner (or downloaded in a setup step). This is the biggest open question — Obsidian doesn't have a headless mode, so CI would need `xvfb` or a virtual display.
+
+6. **Agent-executable test commands:**
+   ```bash
+   pnpm test:e2e              # run all tests
+   pnpm test:e2e -- --grep "node creation"  # run specific tests
+   pnpm test:e2e:ui           # interactive Playwright UI (for humans)
+   ```
+
+### Phase 4: Advanced (future)
+
+- **Visual regression testing** — Compare screenshots against baselines to catch UI regressions
+- **Obsidian version matrix** — Test against multiple Obsidian versions (download different `.asar` files)
+- **Headless mode wrapper** — Investigate running Obsidian with `--disable-gpu --headless` flags (may not work due to Obsidian's renderer requirements)
+- **Test data fixtures** — Pre-built vaults with specific node/relation configurations for testing complex scenarios
+- **Performance benchmarks** — Measure plugin load time, command execution time
+
+### Open Questions
+
+1. **CI runner setup** — How to install Obsidian on GitHub Actions macOS runners? Is there a `.dmg` download URL that's stable? Or do we cache the `.app` bundle?
+2. **Obsidian updates** — Obsidian auto-updates the `.asar`. Should tests pin a specific version? How to prevent auto-update during test runs?
+3. **Multiple vaults** — Obsidian tracks known vaults globally. Test vaults may accumulate in Obsidian's vault list. Need cleanup strategy.
+4. **Restricted mode** — The PoC doesn't explicitly disable restricted mode via config. The plugin loads because the `community-plugins.json` file is present, but a fresh Obsidian install might prompt the user to enable community plugins. Need to investigate if there's a config flag to skip this.
diff --git a/apps/obsidian/e2e/helpers/obsidian-setup.ts b/apps/obsidian/e2e/helpers/obsidian-setup.ts
new file mode 100644
index 000000000..fc19f0e1e
--- /dev/null
+++ b/apps/obsidian/e2e/helpers/obsidian-setup.ts
@@ -0,0 +1,132 @@
+import fs from "fs";
+import path from "path";
+import { spawn, execSync, type ChildProcess } from "child_process";
+import { chromium, type Browser, type Page } from "@playwright/test";
+
+const OBSIDIAN_PATH = "/Applications/Obsidian.app/Contents/MacOS/Obsidian";
+const PLUGIN_ID = "@discourse-graph/obsidian";
+const DEBUG_PORT = 9222;
+
+export const createTestVault = (vaultPath: string): void => {
+  // Clean up any existing vault
+  cleanTestVault(vaultPath);
+
+  // Create vault directories
+  const obsidianDir = path.join(vaultPath, ".obsidian");
+  const pluginDir = path.join(obsidianDir, "plugins", PLUGIN_ID);
+  fs.mkdirSync(pluginDir, { recursive: true });
+
+  // Write community-plugins.json to enable our plugin
+  fs.writeFileSync(
+    path.join(obsidianDir, "community-plugins.json"),
+    JSON.stringify([PLUGIN_ID]),
+  );
+
+  // Write app.json to disable restricted mode (allows community plugins)
+  fs.writeFileSync(
+    path.join(obsidianDir, "app.json"),
+    JSON.stringify({ livePreview: true }),
+  );
+
+  // Copy built plugin files from dist/ into the vault's plugin directory
+  const distDir = path.join(__dirname, "..", "..", "dist");
+  if (!fs.existsSync(distDir)) {
+    throw new Error(
+      `dist/ directory not found at ${distDir}. Run "pnpm build" first.`,
+    );
+  }
+
+  const filesToCopy = ["main.js", "manifest.json", "styles.css"];
+  for (const file of filesToCopy) {
+    const src = path.join(distDir, file);
+    if (fs.existsSync(src)) {
+      fs.copyFileSync(src, path.join(pluginDir, file));
+    }
+  }
+};
+
+export const cleanTestVault = (vaultPath: string): void => {
+  if (fs.existsSync(vaultPath)) {
+    fs.rmSync(vaultPath, { recursive: true, force: true });
+  }
+};
+
+/**
+ * Launch Obsidian as a subprocess with remote debugging enabled,
+ * then connect via Chrome DevTools Protocol.
+ *
+ * We can't use Playwright's electron.launch() because Obsidian's
+ * executable is a launcher that loads an asar package and forks
+ * a new process, which breaks Playwright's Electron API connection.
+ */
+export const launchObsidian = async (vaultPath: string): Promise<{
+  browser: Browser;
+  page: Page;
+  obsidianProcess: ChildProcess;
+}> => {
+  // Kill any existing Obsidian instances to free the debug port
+  try {
+    execSync("pkill -f Obsidian", { stdio: "ignore" });
+    // Wait for processes to fully exit
+    await new Promise((resolve) => setTimeout(resolve, 2_000));
+  } catch {
+    // No existing Obsidian processes — that's fine
+  }
+
+  // Launch Obsidian with remote debugging port
+  const obsidianProcess = spawn(
+    OBSIDIAN_PATH,
+    [`--remote-debugging-port=${DEBUG_PORT}`, `--vault=${vaultPath}`],
+    {
+      stdio: "pipe",
+      detached: true,
+    },
+  );
+
+  obsidianProcess.stderr?.on("data", (data: Buffer) => {
+    console.log("[Obsidian stderr]", data.toString());
+  });
+  obsidianProcess.stdout?.on("data", (data: Buffer) => {
+    console.log("[Obsidian stdout]", data.toString());
+  });
+
+  // Unref so the spawned process doesn't keep the test runner alive
+  obsidianProcess.unref();
+
+  // Wait for the debug port to be ready
+  await waitForDebugPort(DEBUG_PORT, 30_000);
+
+  // Connect to Obsidian via CDP
+  const browser = await chromium.connectOverCDP(`http://localhost:${DEBUG_PORT}`);
+
+  // Get the first browser context and page
+  const context = browser.contexts()[0];
+  if (!context) {
+    throw new Error("No browser context found after connecting via CDP");
+  }
+
+  let page = context.pages()[0];
+  if (!page) {
+    page = await context.waitForEvent("page");
+  }
+
+  // Wait for Obsidian to finish initializing
+  await page.waitForLoadState("domcontentloaded");
+  await page.waitForSelector(".workspace", { timeout: 30_000 });
+
+  return { browser, page, obsidianProcess };
+};
+
+const waitForDebugPort = async (port: number, timeoutMs: number): Promise<void> => {
+  const start = Date.now();
+  while (Date.now() - start < timeoutMs) {
+    try {
+      const response = await fetch(`http://localhost:${port}/json/version`);
+      if (response.ok) return;
+    } catch {
+      // Port not ready yet, retry
+    }
+    await new Promise((resolve) => setTimeout(resolve, 500));
+  }
+  throw new Error(`Obsidian debug port ${port} did not become ready within ${timeoutMs}ms`);
+};
diff --git a/apps/obsidian/e2e/playwright.config.ts b/apps/obsidian/e2e/playwright.config.ts
new file mode 100644
index 000000000..b91f072e0
--- /dev/null
+++ b/apps/obsidian/e2e/playwright.config.ts
@@ -0,0 +1,17 @@
+import { defineConfig } from "@playwright/test";
+
+export default defineConfig({
+  testDir: "./tests",
+  timeout: 60_000,
+  expect: {
+    timeout: 10_000,
+  },
+  retries: 0,
+  workers: 1,
+  reporter: [["list"], ["html", { outputFolder: "html-report" }]],
+  use: {
+    screenshot: "only-on-failure",
+    trace: "retain-on-failure",
+  },
+  outputDir: "test-results",
+});
diff --git a/apps/obsidian/e2e/tests/smoke.spec.ts b/apps/obsidian/e2e/tests/smoke.spec.ts
new file mode 100644
index 000000000..e79f79572
--- /dev/null
+++ b/apps/obsidian/e2e/tests/smoke.spec.ts
@@ -0,0 +1,123 @@
+import { test, expect, type Browser, type Page } from "@playwright/test";
+import path from "path";
+import type { ChildProcess } from "child_process";
+import { createTestVault, cleanTestVault, launchObsidian } from "../helpers/obsidian-setup";
+
+const VAULT_PATH = path.join(__dirname, "..", "test-vault-3");
+const PLUGIN_ID = "@discourse-graph/obsidian";
+
+let browser: Browser;
+let page: Page;
+let obsidianProcess: ChildProcess;
+
+test.beforeAll(async () => {
+  createTestVault(VAULT_PATH);
+  const launched = await launchObsidian(VAULT_PATH);
+  browser = launched.browser;
+  page = launched.page;
+  obsidianProcess = launched.obsidianProcess;
+});
+
+test.afterAll(async () => {
+  if (browser) {
+    await browser.close();
+  }
+  if (obsidianProcess) {
+    obsidianProcess.kill();
+  }
+  cleanTestVault(VAULT_PATH);
+});
+
+test("Plugin loads in Obsidian", async () => {
+  // Wait a bit for plugins to fully initialize
+  await page.waitForTimeout(5_000);
+
+  // Check that the plugin is loaded via Obsidian's internal API
+  const pluginLoaded = await page.evaluate((pluginId) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const plugins = app?.plugins?.plugins;
+    return plugins ? pluginId in plugins : false;
+  }, PLUGIN_ID);
+
+  // Take a screenshot for visual verification
+  await page.screenshot({ path: path.join(__dirname, "..", "test-results", "plugin-loaded.png") });
+
+  expect(pluginLoaded).toBe(true);
+});
+
+test("Create a discourse node via command palette", async () => {
+  const testTitle = `What is discourse graph testing ${Date.now()}`;
+
+  // Ensure we have an active editor (the "Create discourse node" command requires editorCallback).
+  // Create a scratch file with a unique name, or open it if it already exists.
+  await page.evaluate(async () => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const vault = app.vault;
+    const fileName = `scratch-e2e-${Date.now()}.md`;
+    const file = await vault.create(fileName, "");
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    await app.workspace.openLinkText(file.path, "", false);
+  });
+  await page.waitForTimeout(1_000);
+
+  // Open the command palette with Cmd+P
+  await page.keyboard.press("Meta+p");
+  await page.waitForTimeout(500);
+
+  // Type the command name to search for it
+  await page.keyboard.type("Discourse Graph: Create discourse node", { delay: 30 });
+  await page.waitForTimeout(500);
+
+  // Press Enter to execute the command
+  await page.keyboard.press("Enter");
+  await page.waitForTimeout(1_000);
+
+  // The "Create discourse node" modal should now be open.
+  // Wait for the modal to appear
+  await page.waitForSelector(".modal-container", { timeout: 5_000 });
+
+  // Select "Question" from the node type <select> dropdown
+  const nodeTypeSelect = page.locator(".modal-container select").first();
+  await nodeTypeSelect.selectOption({ label: "Question" });
+  await page.waitForTimeout(300);
+
+  // Fill the Content <input> field
+  const contentInput = page.locator(".modal-container input[type='text']").first();
+  await contentInput.click();
+  await contentInput.fill(testTitle);
+  await page.waitForTimeout(300);
+
+  // Click the Confirm button (has class "mod-cta")
+  await page.locator(".modal-container button.mod-cta").click();
+  await page.waitForTimeout(2_000);
+
+  // Verify the file was created using Obsidian's vault API
+  const fileExists = await page.evaluate((title) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const files = app?.vault?.getMarkdownFiles() || [];
+    return files.some((f: { basename: string }) =>
+      f.basename.includes(title) || f.basename.includes("QUE -")
+    );
+  }, testTitle);
+
+  // Take a screenshot for visual verification
+  await page.screenshot({ path: path.join(__dirname, "..", "test-results", "node-created.png") });
+
+  expect(fileExists).toBe(true);
+
+  // Verify the file content includes the nodeTypeId frontmatter
+  const fileContent = await page.evaluate(() => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const files = app?.vault?.getMarkdownFiles() || [];
+    const queFile = files.find((f: { basename: string }) =>
+      f.basename.includes("QUE -")
+    );
+    if (!queFile) return null;
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    return app.vault.read(queFile);
+  });
+
+  if (fileContent) {
+    expect(fileContent).toContain("nodeTypeId");
+  }
+});
diff --git a/apps/obsidian/package.json b/apps/obsidian/package.json
index 70537f7fc..8a96d50b0 100644
--- a/apps/obsidian/package.json
+++ b/apps/obsidian/package.json
@@ -10,12 +10,15 @@
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "publish": "tsx scripts/publish.ts --version 0.1.0",
-    "check-types": "tsc --noEmit --skipLibCheck"
+    "check-types": "tsc --noEmit --skipLibCheck",
+    "test:e2e": "playwright test --config e2e/playwright.config.ts",
+    "test:e2e:ui": "playwright test --config e2e/playwright.config.ts --ui"
   },
   "keywords": [],
   "author": "",
   "license": "Apache-2.0",
   "devDependencies": {
+    "@playwright/test": "^1.52.0",
     "@octokit/core": "^6.1.2",
     "@repo/eslint-config": "workspace:*",
     "@repo/typescript-config": "workspace:*",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b30c23a77..3a3adbcbc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -152,6 +152,9 @@ importers:
       '@octokit/core':
         specifier: ^6.1.2
         version: 6.1.6
+      '@playwright/test':
+        specifier: ^1.52.0
+        version: 1.58.2
       '@repo/eslint-config':
         specifier: workspace:*
         version: link:../../packages/eslint-config
@@ -450,7 +453,7 @@ importers:
         version: 4.0.0
       next:
         specifier: 15.5.7
-        version: 15.5.7(@opentelemetry/api@1.9.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
+        version: 15.5.7(@opentelemetry/api@1.9.0)(@playwright/test@1.58.2)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
       openai:
         specifier: ^4.98.0
         version: 4.104.0(ws@8.18.3)(zod@3.25.76)
@@ -2712,10 +2715,9 @@ packages:
     resolution: {integrity: sha512-QNqXyfVS2wm9hweSYD2O7F0G06uurj9kZ96TRQE5Y9hU7+tgdZwIkbAKc5Ocy1HxEY2kuDQa6cQ1WRs/O5LFKA==}
     engines: {node: ^12.20.0 || ^14.18.0 || >=16.0.0}
 
-  '@playwright/test@1.29.0':
-    resolution: {integrity: sha512-gp5PVBenxTJsm2bATWDNc2CCnrL5OaA/MXQdJwwkGQtqTjmY+ZOqAdLqo49O9MLTDh2vYh+tHWDnmFsILnWaeA==}
-    engines: {node: '>=14'}
-    deprecated: Please update to the latest version of Playwright to test up-to-date browsers.
+  '@playwright/test@1.58.2':
+    resolution: {integrity: sha512-akea+6bHYBBfA9uQqSYmlJXn61cTa+jbO87xVLCWbTqbWadRVmhxlXATaOjOgcBaWU4ePo0wB41KMFv3o35IXA==}
+    engines: {node: '>=18'}
     hasBin: true
 
   '@popperjs/core@2.11.8':
@@ -6504,6 +6506,11 @@ packages:
   fs.realpath@1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
 
+  fsevents@2.3.2:
+    resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
   fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -8217,9 +8224,14 @@ packages:
     resolution: {integrity: sha512-ueGLflrrnvwB3xuo/uGob5pd5FN7l0MsLf0Z87o/UQmRtwjvfylfc9MurIxRAWywCYTgrvpXBcqjV4OfCYGCIQ==}
     engines: {node: '>=16.20.0'}
 
-  playwright-core@1.29.0:
-    resolution: {integrity: sha512-pboOm1m0RD6z1GtwAbEH60PYRfF87vKdzOSRw2RyO0Y0a7utrMyWN2Au1ojGvQr4umuBMODkKTv607YIRypDSQ==}
-    engines: {node: '>=14'}
+  playwright-core@1.58.2:
+    resolution: {integrity: sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  playwright@1.58.2:
+    resolution: {integrity: sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==}
+    engines: {node: '>=18'}
     hasBin: true
 
   pluralize@8.0.0:
@@ -12238,10 +12250,9 @@ snapshots:
 
   '@pkgr/core@0.2.9': {}
 
-  '@playwright/test@1.29.0':
+  '@playwright/test@1.58.2':
     dependencies:
-      '@types/node': 20.19.13
-      playwright-core: 1.29.0
+      playwright: 1.58.2
 
   '@popperjs/core@2.11.8': {}
 
@@ -13684,11 +13695,11 @@ snapshots:
 
   '@rushstack/eslint-patch@1.12.0': {}
 
-  '@samepage/scripts@0.74.5(@aws-sdk/client-lambda@3.882.0)(@aws-sdk/client-s3@3.882.0)(@samepage/testing@0.74.5(@playwright/test@1.29.0)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(archiver@5.3.2)(axios@0.27.2(debug@4.4.1))(debug@4.4.1)(dotenv@16.6.1)(esbuild@0.17.14)(patch-package@6.5.1)(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))(zod@3.25.76)':
+  '@samepage/scripts@0.74.5(@aws-sdk/client-lambda@3.882.0)(@aws-sdk/client-s3@3.882.0)(@samepage/testing@0.74.5(@playwright/test@1.58.2)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(archiver@5.3.2)(axios@0.27.2(debug@4.4.1))(debug@4.4.1)(dotenv@16.6.1)(esbuild@0.17.14)(patch-package@6.5.1)(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))(zod@3.25.76)':
     dependencies:
       '@aws-sdk/client-lambda': 3.882.0
       '@aws-sdk/client-s3': 3.882.0
-      '@samepage/testing': 0.74.5(@playwright/test@1.29.0)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))
+      '@samepage/testing': 0.74.5(@playwright/test@1.58.2)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))
       archiver: 5.3.2
       axios: 0.27.2(debug@4.4.1)
       debug: 4.4.1(supports-color@8.1.1)
@@ -13699,9 +13710,9 @@ snapshots:
       ts-node: 10.9.2(@types/node@20.19.13)(typescript@5.9.3)
       zod: 3.25.76
 
-  '@samepage/testing@0.74.5(@playwright/test@1.29.0)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))':
+  '@samepage/testing@0.74.5(@playwright/test@1.58.2)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))':
     dependencies:
-      '@playwright/test': 1.29.0
+      '@playwright/test': 1.58.2
       '@testing-library/react': 16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
       '@testing-library/user-event': 14.6.1(@testing-library/dom@10.4.1)
       '@types/jsdom': 20.0.1
@@ -17222,6 +17233,9 @@ snapshots:
 
   fs.realpath@1.0.0: {}
 
+  fsevents@2.3.2:
+    optional: true
+
   fsevents@2.3.3:
     optional: true
 
@@ -18650,7 +18664,7 @@ snapshots:
 
   netmask@2.0.2: {}
 
-  next@15.5.7(@opentelemetry/api@1.9.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1):
+  next@15.5.7(@opentelemetry/api@1.9.0)(@playwright/test@1.58.2)(react-dom@19.1.1(react@19.1.1))(react@19.1.1):
     dependencies:
       '@next/env': 15.5.7
       '@swc/helpers': 0.5.15
@@ -18669,6 +18683,7 @@ snapshots:
       '@next/swc-win32-arm64-msvc': 15.5.7
       '@next/swc-win32-x64-msvc': 15.5.7
       '@opentelemetry/api': 1.9.0
+      '@playwright/test': 1.58.2
       sharp: 0.34.3
     transitivePeerDependencies:
       - '@babel/core'
@@ -19124,7 +19139,13 @@ snapshots:
 
   pkce-challenge@5.0.0: {}
 
-  playwright-core@1.29.0: {}
+  playwright-core@1.58.2: {}
+
+  playwright@1.58.2:
+    dependencies:
+      playwright-core: 1.58.2
+    optionalDependencies:
+      fsevents: 2.3.2
 
   pluralize@8.0.0: {}
 
@@ -19928,7 +19949,7 @@ snapshots:
       '@blueprintjs/core': 3.50.4(patch_hash=51c5847e0a73a1be0cc263036ff64d8fada46f3b65831ed938dbca5eecf3edc0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
       '@blueprintjs/datetime': 3.23.14(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
       '@blueprintjs/select': 3.19.1(patch_hash=5b2821b0bf7274e9b64d7824648c596b9e73c61f421d699a6d4c494f12f62355)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
-      '@samepage/scripts': 0.74.5(@aws-sdk/client-lambda@3.882.0)(@aws-sdk/client-s3@3.882.0)(@samepage/testing@0.74.5(@playwright/test@1.29.0)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(archiver@5.3.2)(axios@0.27.2(debug@4.4.1))(debug@4.4.1)(dotenv@16.6.1)(esbuild@0.17.14)(patch-package@6.5.1)(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))(zod@3.25.76)
+      '@samepage/scripts': 0.74.5(@aws-sdk/client-lambda@3.882.0)(@aws-sdk/client-s3@3.882.0)(@samepage/testing@0.74.5(@playwright/test@1.58.2)(@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.2.17)(@types/react@18.2.21)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@testing-library/user-event@14.6.1(@testing-library/dom@10.4.1))(@types/jsdom@20.0.1)(c8@7.14.0)(debug@4.4.1)(dotenv@16.6.1)(jsdom@20.0.3)(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(archiver@5.3.2)(axios@0.27.2(debug@4.4.1))(debug@4.4.1)(dotenv@16.6.1)(esbuild@0.17.14)(patch-package@6.5.1)(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3)))(ts-node@10.9.2(@types/node@20.19.13)(typescript@5.9.3))(zod@3.25.76)
       '@types/crypto-js': 4.1.1
       '@types/cytoscape': 3.21.9
       '@types/file-saver': 2.0.5

From a20e0edab44df1c0ca512d804e9c9748b12131f6 Mon Sep 17 00:00:00 2001
From: Trang Doan <doantranghp2000@gmail.com>
Date: Thu, 26 Feb 2026 15:24:42 -0500
Subject: [PATCH 2/2] Refactor e2e tests: extract helpers, add step
 screenshots, split specs

Extract inline Obsidian interaction logic into reusable helpers (commands,
vault, modal, screenshots) and split smoke.spec.ts into focused spec files
for plugin-load and node-creation. Add JSON reporter to playwright config.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 apps/obsidian/.gitignore                      |  2 +-
 apps/obsidian/e2e/helpers/commands.ts         | 44 +++++++++
 apps/obsidian/e2e/helpers/modal.ts            | 44 +++++++++
 apps/obsidian/e2e/helpers/screenshots.ts      | 22 +++++
 apps/obsidian/e2e/helpers/vault.ts            | 52 ++++++++++
 apps/obsidian/e2e/playwright.config.ts        |  6 +-
 apps/obsidian/e2e/tests/node-creation.spec.ts | 61 ++++++++++++
 apps/obsidian/e2e/tests/plugin-load.spec.ts   | 41 ++++++++
 apps/obsidian/e2e/tests/smoke.spec.ts         | 99 ++++---------------
 9 files changed, 291 insertions(+), 80 deletions(-)
 create mode 100644 apps/obsidian/e2e/helpers/commands.ts
 create mode 100644 apps/obsidian/e2e/helpers/modal.ts
 create mode 100644 apps/obsidian/e2e/helpers/screenshots.ts
 create mode 100644 apps/obsidian/e2e/helpers/vault.ts
 create mode 100644 apps/obsidian/e2e/tests/node-creation.spec.ts
 create mode 100644 apps/obsidian/e2e/tests/plugin-load.spec.ts

diff --git a/apps/obsidian/.gitignore b/apps/obsidian/.gitignore
index 81613c0af..a4569d0d5 100644
--- a/apps/obsidian/.gitignore
+++ b/apps/obsidian/.gitignore
@@ -1,3 +1,3 @@
-e2e/test-vault/
+e2e/test-vault*/
 e2e/test-results/
 e2e/html-report/
diff --git a/apps/obsidian/e2e/helpers/commands.ts b/apps/obsidian/e2e/helpers/commands.ts
new file mode 100644
index 000000000..f5607c78c
--- /dev/null
+++ b/apps/obsidian/e2e/helpers/commands.ts
@@ -0,0 +1,44 @@
+import type { Page } from "@playwright/test";
+
+/**
+ * Execute a command via Obsidian's internal command API (fast, reliable).
+ * Use this for most test scenarios.
+ */
+export const executeCommand = async (page: Page, commandId: string): Promise<void> => {
+  await page.evaluate((id) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    app.commands.executeCommandById(`@discourse-graph/obsidian:${id}`);
+  }, commandId);
+  await page.waitForTimeout(500);
+};
+
+/**
+ * Execute a command via the command palette UI.
+ * Use this when testing the palette interaction itself.
+ */
+export const executeCommandViaPalette = async (page: Page, commandLabel: string): Promise<void> => {
+  await page.keyboard.press("Meta+p");
+  await page.waitForTimeout(500);
+
+  await page.keyboard.type(commandLabel, { delay: 30 });
+  await page.waitForTimeout(500);
+
+  await page.keyboard.press("Enter");
+  await page.waitForTimeout(1_000);
+};
+
+/**
+ * Ensure an active editor exists by creating and opening a scratch file.
+ * Required before running editorCallback commands like "Create discourse node".
+ */
+export const ensureActiveEditor = async (page: Page): Promise<void> => {
+  await page.evaluate(async () => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const vault = app.vault;
+    const fileName = `scratch-e2e-${Date.now()}.md`;
+    const file = await vault.create(fileName, "");
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    await app.workspace.openLinkText(file.path, "", false);
+  });
+  await page.waitForTimeout(1_000);
+};
diff --git a/apps/obsidian/e2e/helpers/modal.ts b/apps/obsidian/e2e/helpers/modal.ts
new file mode 100644
index 000000000..e03a86afb
--- /dev/null
+++ b/apps/obsidian/e2e/helpers/modal.ts
@@ -0,0 +1,44 @@
+import type { Page } from "@playwright/test";
+
+/**
+ * Wait for the ModifyNodeModal to appear.
+ */
+export const waitForModal = async (page: Page): Promise<void> => {
+  await page.waitForSelector(".modal-container", { timeout: 5_000 });
+};
+
+/**
+ * Select a node type from the dropdown in the modal.
+ */
+export const selectNodeType = async (page: Page, label: string): Promise<void> => {
+  const nodeTypeSelect = page.locator(".modal-container select").first();
+  await nodeTypeSelect.selectOption({ label });
+  await page.waitForTimeout(300);
+};
+
+/**
+ * Fill the content/title input field in the modal.
+ */
+export const fillNodeContent = async (page: Page, content: string): Promise<void> => {
+  const contentInput = page.locator(".modal-container input[type='text']").first();
+  await contentInput.click();
+  await contentInput.fill(content);
+  await page.waitForTimeout(300);
+};
+
+/**
+ * Click the Confirm button (mod-cta) in the modal.
+ */
+export const confirmModal = async (page: Page): Promise<void> => {
+  // Use force: true to bypass any suggestion/autocomplete overlay that may cover the button
+  await page.locator(".modal-container button.mod-cta").click({ force: true });
+  await page.waitForTimeout(2_000);
+};
+
+/**
+ * Click the Cancel button in the modal.
+ */
+export const cancelModal = async (page: Page): Promise<void> => {
+  await page.locator(".modal-container button:not(.mod-cta)").click();
+  await page.waitForTimeout(500);
+};
diff --git a/apps/obsidian/e2e/helpers/screenshots.ts b/apps/obsidian/e2e/helpers/screenshots.ts
new file mode 100644
index 000000000..94c98f354
--- /dev/null
+++ b/apps/obsidian/e2e/helpers/screenshots.ts
@@ -0,0 +1,22 @@
+import path from "path";
+import fs from "fs";
+import type { Page } from "@playwright/test";
+
+const TEST_RESULTS_DIR = path.join(__dirname, "..", "test-results");
+
+/**
+ * Capture a step-based screenshot organized by test name.
+ * Saves to: test-results/<testName>/<stepName>.png
+ */
+export const captureStep = async (
+  page: Page,
+  testName: string,
+  stepName: string,
+): Promise<string> => {
+  const dir = path.join(TEST_RESULTS_DIR, testName);
+  fs.mkdirSync(dir, { recursive: true });
+
+  const filePath = path.join(dir, `${stepName}.png`);
+  await page.screenshot({ path: filePath });
+  return filePath;
+};
diff --git a/apps/obsidian/e2e/helpers/vault.ts b/apps/obsidian/e2e/helpers/vault.ts
new file mode 100644
index 000000000..5867610c0
--- /dev/null
+++ b/apps/obsidian/e2e/helpers/vault.ts
@@ -0,0 +1,52 @@
+import type { Page } from "@playwright/test";
+
+/**
+ * Find markdown files whose basename starts with the given prefix.
+ * Returns an array of basenames.
+ */
+export const findFilesByPrefix = async (page: Page, prefix: string): Promise<string[]> => {
+  return page.evaluate((pfx) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const files = app?.vault?.getMarkdownFiles() || [];
+    return files
+      .filter((f: { basename: string }) => f.basename.startsWith(pfx))
+      .map((f: { basename: string }) => f.basename);
+  }, prefix);
+};
+
+/**
+ * Read the text content of a markdown file by its basename.
+ * Returns null if the file is not found.
+ */
+export const readFileContent = async (page: Page, basename: string): Promise<string | null> => {
+  return page.evaluate(async (name) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const files = app?.vault?.getMarkdownFiles() || [];
+    const file = files.find((f: { basename: string }) => f.basename === name);
+    if (!file) return null;
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    return app.vault.read(file);
+  }, basename);
+};
+
+/**
+ * Check whether a plugin is loaded in Obsidian's plugin registry.
+ */
+export const isPluginLoaded = async (page: Page, pluginId: string): Promise<boolean> => {
+  return page.evaluate((id) => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const plugins = app?.plugins?.plugins;
+    return plugins ? id in plugins : false;
+  }, pluginId);
+};
+
+/**
+ * Get all markdown file basenames in the vault.
+ */
+export const getMarkdownFiles = async (page: Page): Promise<string[]> => {
+  return page.evaluate(() => {
+    // @ts-expect-error - Obsidian's global `app` is available at runtime
+    const files = app?.vault?.getMarkdownFiles() || [];
+    return files.map((f: { basename: string }) => f.basename);
+  });
+};
diff --git a/apps/obsidian/e2e/playwright.config.ts b/apps/obsidian/e2e/playwright.config.ts
index b91f072e0..91210ca4c 100644
--- a/apps/obsidian/e2e/playwright.config.ts
+++ b/apps/obsidian/e2e/playwright.config.ts
@@ -8,7 +8,11 @@ export default defineConfig({
   },
   retries: 0,
   workers: 1,
-  reporter: [["list"], ["html", { outputFolder: "html-report" }]],
+  reporter: [
+    ["list"],
+    ["html", { outputFolder: "html-report" }],
+    ["json", { outputFile: "test-results/report.json" }],
+  ],
   use: {
     screenshot: "only-on-failure",
     trace: "retain-on-failure",
diff --git a/apps/obsidian/e2e/tests/node-creation.spec.ts b/apps/obsidian/e2e/tests/node-creation.spec.ts
new file mode 100644
index 000000000..6a0eef47a
--- /dev/null
+++ b/apps/obsidian/e2e/tests/node-creation.spec.ts
@@ -0,0 +1,61 @@
+import { test, expect, type Browser, type Page } from "@playwright/test";
+import path from "path";
+import type { ChildProcess } from "child_process";
+import { createTestVault, cleanTestVault, launchObsidian } from "../helpers/obsidian-setup";
+import { ensureActiveEditor, executeCommandViaPalette } from "../helpers/commands";
+import { findFilesByPrefix, readFileContent } from "../helpers/vault";
+import { waitForModal, selectNodeType, fillNodeContent, confirmModal } from "../helpers/modal";
+import { captureStep } from "../helpers/screenshots";
+
+const VAULT_PATH = path.join(__dirname, "..", "test-vault-node-creation");
+
+let browser: Browser;
+let page: Page;
+let obsidianProcess: ChildProcess;
+
+test.beforeAll(async () => {
+  createTestVault(VAULT_PATH);
+  const launched = await launchObsidian(VAULT_PATH);
+  browser = launched.browser;
+  page = launched.page;
+  obsidianProcess = launched.obsidianProcess;
+
+  // Wait for plugins to initialize
+  await page.waitForTimeout(5_000);
+});
+
+test.afterAll(async () => {
+  if (browser) {
+    await browser.close();
+  }
+  if (obsidianProcess) {
+    obsidianProcess.kill();
+  }
+  cleanTestVault(VAULT_PATH);
+});
+
+test("Create a Question node via command palette", async () => {
+  await ensureActiveEditor(page);
+
+  await executeCommandViaPalette(page, "Discourse Graph: Create discourse node");
+
+  await waitForModal(page);
+  await captureStep(page, "node-creation", "01-modal-open");
+
+  await selectNodeType(page, "Question");
+  await fillNodeContent(page, `What is discourse graph testing ${Date.now()}`);
+  await captureStep(page, "node-creation", "02-modal-filled");
+
+  await confirmModal(page);
+  await captureStep(page, "node-creation", "03-node-created");
+
+  // Verify file was created with correct prefix
+  const files = await findFilesByPrefix(page, "QUE -");
+  expect(files.length).toBeGreaterThan(0);
+
+  // Verify frontmatter contains nodeTypeId
+  const content = await readFileContent(page, files[0]!);
+  if (content) {
+    expect(content).toContain("nodeTypeId");
+  }
+});
diff --git a/apps/obsidian/e2e/tests/plugin-load.spec.ts b/apps/obsidian/e2e/tests/plugin-load.spec.ts
new file mode 100644
index 000000000..ccff51462
--- /dev/null
+++ b/apps/obsidian/e2e/tests/plugin-load.spec.ts
@@ -0,0 +1,41 @@
+import { test, expect, type Browser, type Page } from "@playwright/test";
+import path from "path";
+import type { ChildProcess } from "child_process";
+import { createTestVault, cleanTestVault, launchObsidian } from "../helpers/obsidian-setup";
+import { isPluginLoaded } from "../helpers/vault";
+import { captureStep } from "../helpers/screenshots";
+
+const VAULT_PATH = path.join(__dirname, "..", "test-vault-plugin-load");
+const PLUGIN_ID = "@discourse-graph/obsidian";
+
+let browser: Browser;
+let page: Page;
+let obsidianProcess: ChildProcess;
+
+test.beforeAll(async () => {
+  createTestVault(VAULT_PATH);
+  const launched = await launchObsidian(VAULT_PATH);
+  browser = launched.browser;
+  page = launched.page;
+  obsidianProcess = launched.obsidianProcess;
+});
+
+test.afterAll(async () => {
+  if (browser) {
+    await browser.close();
+  }
+  if (obsidianProcess) {
+    obsidianProcess.kill();
+  }
+  cleanTestVault(VAULT_PATH);
+});
+
+test("Plugin loads in Obsidian", async () => {
+  await page.waitForTimeout(5_000);
+
+  const pluginLoaded = await isPluginLoaded(page, PLUGIN_ID);
+
+  await captureStep(page, "plugin-load", "01-plugin-loaded");
+
+  expect(pluginLoaded).toBe(true);
+});
diff --git a/apps/obsidian/e2e/tests/smoke.spec.ts b/apps/obsidian/e2e/tests/smoke.spec.ts
index e79f79572..7ddcd50b5 100644
--- a/apps/obsidian/e2e/tests/smoke.spec.ts
+++ b/apps/obsidian/e2e/tests/smoke.spec.ts
@@ -2,8 +2,12 @@ import { test, expect, type Browser, type Page } from "@playwright/test";
 import path from "path";
 import type { ChildProcess } from "child_process";
 import { createTestVault, cleanTestVault, launchObsidian } from "../helpers/obsidian-setup";
+import { ensureActiveEditor, executeCommandViaPalette } from "../helpers/commands";
+import { isPluginLoaded, findFilesByPrefix, readFileContent } from "../helpers/vault";
+import { waitForModal, selectNodeType, fillNodeContent, confirmModal } from "../helpers/modal";
+import { captureStep } from "../helpers/screenshots";
 
-const VAULT_PATH = path.join(__dirname, "..", "test-vault-3");
+const VAULT_PATH = path.join(__dirname, "..", "test-vault-smoke");
 const PLUGIN_ID = "@discourse-graph/obsidian";
 
 let browser: Browser;
@@ -29,95 +33,34 @@ test.afterAll(async () => {
 });
 
 test("Plugin loads in Obsidian", async () => {
-  // Wait a bit for plugins to fully initialize
   await page.waitForTimeout(5_000);
 
-  // Check that the plugin is loaded via Obsidian's internal API
-  const pluginLoaded = await page.evaluate((pluginId) => {
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    const plugins = app?.plugins?.plugins;
-    return plugins ? pluginId in plugins : false;
-  }, PLUGIN_ID);
-
-  // Take a screenshot for visual verification
-  await page.screenshot({ path: path.join(__dirname, "..", "test-results", "plugin-loaded.png") });
+  const pluginLoaded = await isPluginLoaded(page, PLUGIN_ID);
+  await captureStep(page, "smoke", "01-plugin-loaded");
 
   expect(pluginLoaded).toBe(true);
 });
 
 test("Create a discourse node via command palette", async () => {
-  const testTitle = `What is discourse graph testing ${Date.now()}`;
-
-  // Ensure we have an active editor (the "Create discourse node" command requires editorCallback).
-  // Create a scratch file with a unique name, or open it if it already exists.
-  await page.evaluate(async () => {
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    const vault = app.vault;
-    const fileName = `scratch-e2e-${Date.now()}.md`;
-    const file = await vault.create(fileName, "");
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    await app.workspace.openLinkText(file.path, "", false);
-  });
-  await page.waitForTimeout(1_000);
-
-  // Open the command palette with Cmd+P
-  await page.keyboard.press("Meta+p");
-  await page.waitForTimeout(500);
-
-  // Type the command name to search for it
-  await page.keyboard.type("Discourse Graph: Create discourse node", { delay: 30 });
-  await page.waitForTimeout(500);
-
-  // Press Enter to execute the command
-  await page.keyboard.press("Enter");
-  await page.waitForTimeout(1_000);
-
-  // The "Create discourse node" modal should now be open.
-  // Wait for the modal to appear
-  await page.waitForSelector(".modal-container", { timeout: 5_000 });
-
-  // Select "Question" from the node type <select> dropdown
-  const nodeTypeSelect = page.locator(".modal-container select").first();
-  await nodeTypeSelect.selectOption({ label: "Question" });
-  await page.waitForTimeout(300);
-
-  // Fill the Content <input> field
-  const contentInput = page.locator(".modal-container input[type='text']").first();
-  await contentInput.click();
-  await contentInput.fill(testTitle);
-  await page.waitForTimeout(300);
+  await ensureActiveEditor(page);
 
-  // Click the Confirm button (has class "mod-cta")
-  await page.locator(".modal-container button.mod-cta").click();
-  await page.waitForTimeout(2_000);
+  await executeCommandViaPalette(page, "Discourse Graph: Create discourse node");
 
-  // Verify the file was created using Obsidian's vault API
-  const fileExists = await page.evaluate((title) => {
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    const files = app?.vault?.getMarkdownFiles() || [];
-    return files.some((f: { basename: string }) =>
-      f.basename.includes(title) || f.basename.includes("QUE -")
-    );
-  }, testTitle);
+  await waitForModal(page);
+  await captureStep(page, "smoke", "02-modal-open");
 
-  // Take a screenshot for visual verification
-  await page.screenshot({ path: path.join(__dirname, "..", "test-results", "node-created.png") });
+  await selectNodeType(page, "Question");
+  await fillNodeContent(page, `What is discourse graph testing ${Date.now()}`);
+  await captureStep(page, "smoke", "03-modal-filled");
 
-  expect(fileExists).toBe(true);
+  await confirmModal(page);
+  await captureStep(page, "smoke", "04-node-created");
 
-  // Verify the file content includes the nodeTypeId frontmatter
-  const fileContent = await page.evaluate(() => {
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    const files = app?.vault?.getMarkdownFiles() || [];
-    const queFile = files.find((f: { basename: string }) =>
-      f.basename.includes("QUE -")
-    );
-    if (!queFile) return null;
-    // @ts-expect-error - Obsidian's global `app` is available at runtime
-    return app.vault.read(queFile);
-  });
+  const files = await findFilesByPrefix(page, "QUE -");
+  expect(files.length).toBeGreaterThan(0);
 
-  if (fileContent) {
-    expect(fileContent).toContain("nodeTypeId");
+  const content = await readFileContent(page, files[0]!);
+  if (content) {
+    expect(content).toContain("nodeTypeId");
   }
 });