@peaske7/readit 0.2.1 → 0.3.0-rc.1

package/e2e/persistence-file.spec.ts

@@ -1,357 +0,0 @@
-import {
-  existsSync,
-  mkdirSync,
-  readFileSync,
-  rmSync,
-  writeFileSync,
-} from "node:fs";
-import * as os from "node:os";
-import { dirname, join, resolve } from "node:path";
-import { expect, test } from "@playwright/test";
-import { spawnCli } from "./utils/cli";
-import { addComment, selectTextInArticle } from "./utils/selection";
-
-const FIXTURES_DIR = resolve(import.meta.dirname, "fixtures");
-
-/**
- * Get the expected comment file path for a source file.
- */
-function getCommentPath(sourcePath: string): string {
-  const absolute = resolve(sourcePath);
-  const normalized = absolute.replace(/^\//, "").replace(/^[A-Z]:[\\/]/, "");
-  const ext = normalized.lastIndexOf(".");
-  const withoutExt = ext > 0 ? normalized.slice(0, ext) : normalized;
-  return join(os.homedir(), ".readit", "comments", `${withoutExt}.comments.md`);
-}
-
-/**
- * Clean up comment file for a source file.
- */
-function cleanupCommentFile(sourcePath: string): void {
-  const commentPath = getCommentPath(sourcePath);
-  if (existsSync(commentPath)) {
-    rmSync(commentPath);
-  }
-}
-
-test.describe("File-Based Comment Persistence", () => {
-  const sampleMdPath = resolve(FIXTURES_DIR, "sample.md");
-
-  test.beforeEach(() => {
-    // Clean up any existing comment file before each test
-    cleanupCommentFile(sampleMdPath);
-  });
-
-  test.afterEach(() => {
-    // Clean up after each test
-    cleanupCommentFile(sampleMdPath);
-  });
-
-  test("comments are saved to markdown file", async ({ page }) => {
-    const { url, cleanup } = await spawnCli(sampleMdPath, {
-      port: 4590,
-      clean: false,
-    });
-
-    try {
-      await page.goto(url);
-
-      // Wait for document to load
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Add a comment
-      const textToSelect = "testing text selection";
-      await selectTextInArticle(page, textToSelect);
-
-      const commentText = "This is a test comment for file persistence";
-      await addComment(page, commentText);
-
-      // Wait for comment to be visible in UI
-      await expect(page.locator("body")).toContainText(commentText);
-
-      // Give time for the file to be written
-      await page.waitForTimeout(500);
-
-      // Verify the comment file was created
-      const commentPath = getCommentPath(sampleMdPath);
-      expect(existsSync(commentPath)).toBe(true);
-
-      // Verify the file contains the comment
-      const fileContent = readFileSync(commentPath, "utf-8");
-      expect(fileContent).toContain(textToSelect);
-      expect(fileContent).toContain(commentText);
-      expect(fileContent).toContain("version: 1");
-    } finally {
-      await cleanup();
-    }
-  });
-
-  test("comments persist across page reload", async ({ page }) => {
-    const { url, cleanup } = await spawnCli(sampleMdPath, {
-      port: 4591,
-      clean: false,
-    });
-
-    try {
-      await page.goto(url);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Add a comment
-      const textToSelect = "testing text selection";
-      await selectTextInArticle(page, textToSelect);
-
-      const commentText = "Persistent comment test";
-      await addComment(page, commentText);
-
-      // Wait for comment to appear
-      await expect(page.locator("body")).toContainText(commentText);
-
-      // Reload the page
-      await page.reload();
-
-      // Wait for document to reload
-      await expect(article).toBeVisible();
-
-      // Verify comment still exists after reload
-      await expect(page.locator("body")).toContainText(commentText);
-
-      // Verify highlight still exists
-      await page.waitForFunction(
-        () => {
-          const h = (window as unknown as Record<string, unknown>)
-            .__readitHighlights as { commentIds: string[] } | undefined;
-          return h && h.commentIds.length > 0;
-        },
-        { timeout: 10_000 },
-      );
-    } finally {
-      await cleanup();
-    }
-  });
-
-  test("comments persist across server restart", async ({ page }) => {
-    const PORT = 4592;
-
-    // First session: add a comment
-    const { url: url1, cleanup: cleanup1 } = await spawnCli(sampleMdPath, {
-      port: PORT,
-      clean: false,
-    });
-
-    const commentText = "Comment that survives restart";
-
-    try {
-      await page.goto(url1);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      await selectTextInArticle(page, "testing text selection");
-      await addComment(page, commentText);
-
-      // Wait for comment to appear
-      await expect(page.locator("body")).toContainText(commentText);
-    } finally {
-      await cleanup1();
-    }
-
-    // Wait for server to fully shut down
-    await page.waitForTimeout(1000);
-
-    // Second session: verify comment persists
-    const { url: url2, cleanup: cleanup2 } = await spawnCli(sampleMdPath, {
-      port: PORT,
-      clean: false,
-    });
-
-    try {
-      await page.goto(url2);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Comment should still exist from previous session
-      await expect(page.locator("body")).toContainText(commentText);
-
-      // Highlight should still exist
-      await page.waitForFunction(
-        () => {
-          const h = (window as unknown as Record<string, unknown>)
-            .__readitHighlights as { commentIds: string[] } | undefined;
-          return h && h.commentIds.length > 0;
-        },
-        { timeout: 10_000 },
-      );
-    } finally {
-      await cleanup2();
-    }
-  });
-
-  test("--clean flag deletes comment file", async ({ page }) => {
-    const PORT = 4593;
-
-    // First, create a comment file manually
-    const commentPath = getCommentPath(sampleMdPath);
-    const commentDir = dirname(commentPath);
-    mkdirSync(commentDir, { recursive: true });
-    writeFileSync(
-      commentPath,
-      `---
-source: ${sampleMdPath}
-hash: abc123
-version: 1
----
-
-<!-- c:12345678|L5|2024-12-24T10:00:00Z -->
-> testing text selection
-
-Pre-existing comment to be cleared.
-
----
-`,
-      "utf-8",
-    );
-
-    expect(existsSync(commentPath)).toBe(true);
-
-    // Start server with --clean flag
-    const { url, cleanup } = await spawnCli(sampleMdPath, {
-      port: PORT,
-      clean: true,
-    });
-
-    try {
-      await page.goto(url);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Wait for clean operation to complete
-      await page.waitForTimeout(500);
-
-      // Verify no highlights via observability hook
-      const highlightCount = await page.evaluate(() => {
-        const h = (window as unknown as Record<string, unknown>)
-          .__readitHighlights as { commentIds: string[] } | undefined;
-        return h?.commentIds?.length ?? 0;
-      });
-      expect(highlightCount).toBe(0);
-    } finally {
-      await cleanup();
-    }
-  });
-
-  test("edit updates the comment file", async ({ page }) => {
-    const { url, cleanup } = await spawnCli(sampleMdPath, {
-      port: 4594,
-      clean: false,
-    });
-
-    try {
-      await page.goto(url);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Add initial comment
-      const textToSelect = "testing text selection";
-      await selectTextInArticle(page, textToSelect);
-      const initialComment = "Initial comment text";
-      await addComment(page, initialComment);
-
-      await expect(page.locator("body")).toContainText(initialComment);
-
-      // Wait for file to be written
-      await page.waitForTimeout(500);
-
-      // Verify initial comment in file
-      const commentPath = getCommentPath(sampleMdPath);
-      let fileContent = readFileSync(commentPath, "utf-8");
-      expect(fileContent).toContain(initialComment);
-
-      // Find the margin note by data-comment-id (first one)
-      const marginNote = page.locator("[data-comment-id]").first();
-
-      // Force-click edit button (may be hidden behind opacity-0 group-hover)
-      const editButton = marginNote.getByText("Edit").first();
-      await editButton.click({ force: true });
-
-      // Wait for edit mode — find textarea globally since hasText filter breaks in edit mode
-      const textarea = page.locator("[data-comment-id] textarea");
-      await expect(textarea).toBeVisible();
-
-      // Clear and type new text
-      await textarea.fill("Updated comment text");
-
-      // Save edit
-      const saveButton = page
-        .locator("[data-comment-id]")
-        .getByText("Save")
-        .first();
-      await saveButton.click();
-
-      // Wait for file to be updated
-      await page.waitForTimeout(500);
-
-      // Verify updated comment in file
-      fileContent = readFileSync(commentPath, "utf-8");
-      expect(fileContent).toContain("Updated comment text");
-    } finally {
-      await cleanup();
-    }
-  });
-
-  test("delete removes comment from file", async ({ page }) => {
-    const { url, cleanup } = await spawnCli(sampleMdPath, {
-      port: 4595,
-      clean: false,
-    });
-
-    try {
-      await page.goto(url);
-
-      const article = page.locator("article#document-content");
-      await expect(article).toBeVisible();
-
-      // Add a comment
-      await selectTextInArticle(page, "testing text selection");
-      const commentText = "Comment to be deleted";
-      await addComment(page, commentText);
-
-      await expect(page.locator("body")).toContainText(commentText);
-
-      // Wait for file to be written
-      await page.waitForTimeout(500);
-
-      // Verify comment in file
-      const commentPath = getCommentPath(sampleMdPath);
-      let fileContent = readFileSync(commentPath, "utf-8");
-      expect(fileContent).toContain(commentText);
-
-      // Find the margin note containing the comment
-      const marginNote = page
-        .locator(".group")
-        .filter({ hasText: commentText })
-        .first();
-      await marginNote.hover();
-
-      // Click delete button
-      const deleteButton = marginNote.locator('button:has-text("Delete")');
-      await deleteButton.click();
-
-      // Wait for file to be updated
-      await page.waitForTimeout(500);
-
-      // Verify comment removed from file (file may be deleted if no comments left)
-      if (existsSync(commentPath)) {
-        fileContent = readFileSync(commentPath, "utf-8");
-        expect(fileContent).not.toContain(commentText);
-      }
-    } finally {
-      await cleanup();
-    }
-  });
-});

package/e2e/utils/cli.ts

@@ -1,84 +0,0 @@
-import type { ChildProcess } from "node:child_process";
-import { spawn } from "node:child_process";
-import { resolve } from "node:path";
-
-interface SpawnCliResult {
-  url: string;
-  process: ChildProcess;
-  cleanup: () => Promise<void>;
-}
-
-interface SpawnCliOptions {
-  port?: number;
-  clean?: boolean;
-}
-
-const CLI_PATH = resolve(import.meta.dirname, "../../dist/index.js");
-
-export async function spawnCli(
-  fixturePath: string,
-  options: SpawnCliOptions = {},
-): Promise<SpawnCliResult> {
-  const { port = 4567, clean = true } = options;
-
-  const args = [CLI_PATH, fixturePath, "--no-open", "--port", String(port)];
-  if (clean) {
-    args.push("--clean");
-  }
-
-  const cliProcess = spawn("bun", args, {
-    cwd: resolve(import.meta.dirname, "../.."),
-    stdio: ["pipe", "pipe", "pipe"],
-  });
-
-  const url = await waitForServerReady(cliProcess);
-
-  return {
-    url,
-    process: cliProcess,
-    cleanup: async () => {
-      cliProcess.kill("SIGTERM");
-      await new Promise<void>((resolve) => {
-        cliProcess.once("exit", () => resolve());
-        setTimeout(resolve, 1000); // Fallback timeout
-      });
-    },
-  };
-}
-
-function waitForServerReady(cliProcess: ChildProcess): Promise<string> {
-  return new Promise((resolve, reject) => {
-    let output = "";
-
-    const timeout = setTimeout(() => {
-      reject(new Error("Server did not start within timeout"));
-    }, 10_000);
-
-    cliProcess.stdout?.on("data", (data: Buffer) => {
-      output += data.toString();
-
-      // Look for "URL:  http://..." in output
-      const urlMatch = output.match(/URL:\s+(http:\/\/[^\s]+)/);
-      if (urlMatch) {
-        clearTimeout(timeout);
-        resolve(urlMatch[1]);
-      }
-    });
-
-    cliProcess.stderr?.on("data", (data: Buffer) => {
-      console.error("[CLI stderr]", data.toString());
-    });
-
-    cliProcess.on("error", (err) => {
-      clearTimeout(timeout);
-      reject(err);
-    });
-
-    cliProcess.on("exit", (code) => {
-      if (code !== 0 && code !== null) {
-        clearTimeout(timeout);
-        reject(new Error(`CLI exited with code ${code}: ${output}`));
-      }
-    });
-  });
-}

package/e2e/utils/selection.ts

@@ -1,79 +0,0 @@
-import type { Page } from "@playwright/test";
-
-/**
- * Wait for the Svelte app to be fully mounted and interactive.
- * The app sets data-readit-ready="true" on <html> after onMount.
- */
-export async function waitForAppReady(page: Page): Promise<void> {
-  await page.waitForFunction(
-    () => document.documentElement.dataset.readitReady === "true",
-    { timeout: 10_000 },
-  );
-}
-
-/**
- * Select text within an article element (for markdown documents)
- * Uses custom event to trigger selection handler (workaround for Playwright mouse issues)
- */
-export async function selectTextInArticle(
-  page: Page,
-  textToSelect: string,
-): Promise<void> {
-  // Ensure the Svelte app is fully mounted before dispatching events
-  await waitForAppReady(page);
-
-  // Find text and calculate offsets, then dispatch custom event
-  await page.evaluate((text) => {
-    const article = document.querySelector("article#document-content");
-    if (!article) throw new Error("Article element not found");
-
-    const walker = document.createTreeWalker(article, NodeFilter.SHOW_TEXT);
-    let currentOffset = 0;
-
-    while (walker.nextNode()) {
-      const textNode = walker.currentNode as Text;
-      const content = textNode.textContent || "";
-      const index = content.indexOf(text);
-
-      if (index !== -1) {
-        const startOffset = currentOffset + index;
-        const endOffset = startOffset + text.length;
-
-        // Dispatch custom event that DocumentViewer listens for
-        const event = new CustomEvent("test:select-text", {
-          detail: { text, startOffset, endOffset },
-        });
-        window.dispatchEvent(event);
-        return;
-      }
-
-      currentOffset += content.length;
-    }
-
-    throw new Error(`Text "${text}" not found in article`);
-  }, textToSelect);
-
-  // Wait for Svelte to process the selection
-  await page.waitForTimeout(100);
-}
-
-/**
- * Add a comment to the current selection
- * Assumes CommentInputArea is visible
- */
-export async function addComment(
-  page: Page,
-  commentText: string,
-): Promise<void> {
-  const textarea = page.locator('textarea[placeholder="Add your comment..."]');
-  await textarea.waitFor({ state: "visible", timeout: 10000 });
-
-  // Fill in the comment
-  await textarea.fill(commentText);
-
-  // Click the Add button
-  await page.getByRole("button", { name: "Add" }).click();
-
-  // Wait for the textarea to disappear (comment submitted)
-  await textarea.waitFor({ state: "hidden", timeout: 5000 });
-}