@fireproof/core 0.21.0-dev-preview-6 → 0.22.0-dev-preview

package/tests/react/img-file.test.tsx

@@ -1,190 +0,0 @@
-import { render, waitFor } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
-import { ImgFile, bs } from "use-fireproof";
-import { createElement } from "react";
-import type { DocFileMeta } from "use-fireproof";
-
-// Extend HTMLElement to include querySelector for TypeScript
-
-// Simple SVG content for testing
-const SVG_CONTENT = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-  <circle cx="12" cy="12" r="10" fill="blue" />
-</svg>`;
-
-describe("COMPONENT: ImgFile", () => {
-  // Mock URL methods
-  const mockObjectURL = "mock-object-url";
-  const originalCreateObjectURL = window.URL.createObjectURL;
-  const originalRevokeObjectURL = window.URL.revokeObjectURL;
-
-  beforeEach(() => {
-    window.URL.createObjectURL = vi.fn(() => mockObjectURL);
-    window.URL.revokeObjectURL = vi.fn();
-  });
-
-  afterEach(() => {
-    window.URL.createObjectURL = originalCreateObjectURL;
-    window.URL.revokeObjectURL = originalRevokeObjectURL;
-  });
-
-  // Test timeout value for CI
-  const TEST_TIMEOUT = 60000; // 1 minute per test
-
-  it(
-    "renders the image from a File object",
-    async () => {
-      const file = new File([new Blob([SVG_CONTENT], { type: "image/svg+xml" })], "test.svg", { type: "image/svg+xml" });
-
-      const { container } = render(
-        createElement(ImgFile, {
-          file: file,
-          alt: "Test SVG",
-          className: "test-class",
-        }),
-      );
-
-      await waitFor(() => {
-        const img = container.querySelector("img");
-        expect(img).not.toBeNull();
-      });
-
-      const img = container.querySelector("img");
-      expect(img?.getAttribute("src")).toBe(mockObjectURL);
-      expect(img?.getAttribute("alt")).toBe("Test SVG");
-      expect(img?.classList.contains("test-class")).toBe(true);
-      expect(window.URL.createObjectURL).toHaveBeenCalledWith(file);
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "does not render when file is not present",
-    () => {
-      const { container } = render(
-        createElement(ImgFile, {
-          file: undefined,
-          alt: "No File",
-        }),
-      );
-
-      const img = container.querySelector("img");
-      expect(img).toBeNull();
-      expect(window.URL.createObjectURL).not.toHaveBeenCalled();
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "supports legacy 'meta' parameter",
-    async () => {
-      const file = new File([new Blob([SVG_CONTENT], { type: "image/svg+xml" })], "legacy.svg", { type: "image/svg+xml" });
-
-      const { container } = render(
-        createElement(ImgFile, {
-          meta: file,
-          alt: "Legacy File",
-        }),
-      );
-
-      await waitFor(() => {
-        const img = container.querySelector("img");
-        expect(img).not.toBeNull();
-      });
-
-      const img = container.querySelector("img");
-      expect(img?.getAttribute("src")).toBe(mockObjectURL);
-      expect(img?.getAttribute("alt")).toBe("Legacy File");
-      expect(window.URL.createObjectURL).toHaveBeenCalledWith(file);
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "renders from DocFileMeta object",
-    async () => {
-      const file = new File([new Blob([SVG_CONTENT], { type: "image/svg+xml" })], "meta.svg", { type: "image/svg+xml" });
-
-      // Create a mock DocFileMeta with required cid property
-      const mockCid = { toString: () => "test-cid" } as bs.AnyLink;
-      const docFileMeta: DocFileMeta = {
-        type: "image/svg+xml",
-        size: file.size,
-        cid: mockCid,
-        file: async () => file,
-      };
-
-      const { container } = render(
-        createElement(ImgFile, {
-          file: docFileMeta,
-          alt: "DocFileMeta Image",
-        }),
-      );
-
-      await waitFor(() => {
-        const img = container.querySelector("img");
-        expect(img).not.toBeNull();
-      });
-
-      const img = container.querySelector("img");
-      expect(img?.getAttribute("src")).toBe(mockObjectURL);
-      expect(img?.getAttribute("alt")).toBe("DocFileMeta Image");
-      expect(window.URL.createObjectURL).toHaveBeenCalledWith(file);
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "does not render for non-image file types",
-    async () => {
-      const textFile = new File(["test content"], "test.txt", { type: "text/plain" });
-
-      const { container } = render(
-        createElement(ImgFile, {
-          file: textFile,
-          alt: "Text File",
-        }),
-      );
-
-      // Wait a bit to ensure any async operations complete
-      await waitFor(
-        () => {
-          // Verify that createObjectURL was called (or not called)
-          expect(window.URL.createObjectURL).toHaveBeenCalledTimes(0);
-        },
-        { timeout: 1000 },
-      );
-
-      const img = container.querySelector("img");
-      expect(img).toBeNull();
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "cleans up object URLs when unmounted",
-    async () => {
-      const file = new File([new Blob([SVG_CONTENT], { type: "image/svg+xml" })], "cleanup.svg", { type: "image/svg+xml" });
-
-      const { container, unmount } = render(
-        createElement(ImgFile, {
-          file: file,
-          alt: "Cleanup Test",
-        }),
-      );
-
-      await waitFor(() => {
-        const img = container.querySelector("img");
-        expect(img).not.toBeNull();
-      });
-
-      expect(window.URL.createObjectURL).toHaveBeenCalledWith(file);
-      expect(window.URL.revokeObjectURL).not.toHaveBeenCalled();
-
-      // Unmount to trigger cleanup
-      unmount();
-
-      expect(window.URL.revokeObjectURL).toHaveBeenCalledWith(mockObjectURL);
-    },
-    TEST_TIMEOUT,
-  );
-});

package/tests/react/use-all-docs.test.tsx

@@ -1,173 +0,0 @@
-import { renderHook, waitFor } from "@testing-library/react";
-import { describe, expect, it, beforeEach, afterEach } from "vitest";
-import { fireproof, useFireproof } from "use-fireproof";
-import type { Database } from "use-fireproof";
-import type { AllDocsResult } from "../../src/react/types.js";
-
-// Test timeout value for CI
-const TEST_TIMEOUT = 45000;
-
-describe("HOOK: useFireproof useAllDocs", () => {
-  const dbName = "useAllDocsTest";
-  let db: Database,
-    database: ReturnType<typeof useFireproof>["database"],
-    useAllDocs: ReturnType<typeof useFireproof>["useAllDocs"];
-
-  beforeEach(async () => {
-    const expectedValues = ["apple", "banana", "cherry"];
-    db = fireproof(dbName);
-    for (const value of expectedValues) {
-      await db.put({ fruit: value });
-    }
-
-    const allDocs = await db.allDocs<{ fruit: string }>();
-    expect(allDocs.rows.map((row) => row.value.fruit)).toEqual(expectedValues);
-  });
-
-  it(
-    "fetches documents correctly",
-    async () => {
-      let result: AllDocsResult<{ fruit: string }>;
-
-      renderHook(() => {
-        const hookResult = useFireproof(dbName);
-        database = hookResult.database;
-        useAllDocs = hookResult.useAllDocs;
-        result = useAllDocs<{ fruit: string }>();
-      });
-
-      await waitFor(() => {
-        expect(result.docs.length).toBe(3);
-        expect(result.docs.map((doc) => doc.fruit)).toEqual(["apple", "banana", "cherry"]);
-      });
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "updates when database changes",
-    async () => {
-      let allDocsResult: AllDocsResult<{ fruit: string }>;
-
-      renderHook(() => {
-        const hookResult = useFireproof(dbName);
-        database = hookResult.database;
-        useAllDocs = hookResult.useAllDocs;
-        allDocsResult = useAllDocs<{ fruit: string }>();
-      });
-
-      // Wait for initial data to load
-      await waitFor(() => {
-        expect(allDocsResult.docs.length).toBe(3);
-      });
-
-      // Add a new document
-      await database.put({ fruit: "dragonfruit" });
-
-      // Verify the hook updates with the new document
-      await waitFor(() => {
-        expect(allDocsResult.docs.length).toBe(4);
-        expect(allDocsResult.docs.map((doc) => doc.fruit)).toContain("dragonfruit");
-      });
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "properly handles subscription lifecycle",
-    async () => {
-      // This test verifies that the subscription works properly
-      // We'll just check that the component renders and updates
-
-      // Render the hook in a way we can unmount it
-      const { unmount, result } = renderHook(() => {
-        const hookResult = useFireproof(dbName);
-        database = hookResult.database;
-        useAllDocs = hookResult.useAllDocs;
-        return useAllDocs<{ fruit: string }>();
-      });
-
-      // Wait for the hook to initialize with data
-      await waitFor(() => {
-        expect(result.current.docs.length).toBe(3);
-      });
-
-      // Add a document to test subscription works
-      await database?.put({ fruit: "date" });
-
-      // Verify the hook updates with the new document
-      await waitFor(() => {
-        expect(result.current.docs.length).toBe(4);
-      });
-
-      // Unmount the component to trigger cleanup
-      unmount();
-
-      // Test passes if no errors occur during unmount
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "accepts query parameters",
-    async () => {
-      // This test verifies that the hook accepts query parameters
-      let allDocsResult: AllDocsResult<{ fruit: string }>;
-
-      renderHook(() => {
-        const hookResult = useFireproof(dbName);
-        database = hookResult.database;
-        useAllDocs = hookResult.useAllDocs;
-        // Pass query parameters to the hook
-        allDocsResult = useAllDocs<{ fruit: string }>({ descending: true });
-      });
-
-      // Wait for the hook to initialize
-      await waitFor(() => {
-        // Verify that the hook returns data regardless of parameters
-        expect(allDocsResult.docs.length).toBe(3);
-        // The current implementation doesn't filter client-side
-      });
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "refreshes when query parameters change",
-    async () => {
-      // This test verifies that the useAllDocs hook refreshes when query parameters change
-      let allDocsResult: AllDocsResult<{ fruit: string }>;
-      let queryParams = {};
-
-      const { rerender } = renderHook(() => {
-        const hookResult = useFireproof(dbName);
-        database = hookResult.database;
-        useAllDocs = hookResult.useAllDocs;
-        allDocsResult = useAllDocs<{ fruit: string }>(queryParams);
-      });
-
-      // Verify initial state with no query parameters
-      await waitFor(() => {
-        expect(allDocsResult.docs.length).toBe(3);
-      });
-
-      // Change the query parameters
-      queryParams = { descending: true };
-      rerender();
-
-      // Verify the hook still works after query parameters change
-      // The implementation should handle the parameter change correctly
-      await waitFor(() => {
-        expect(allDocsResult.docs.length).toBe(3);
-      });
-    },
-    TEST_TIMEOUT,
-  );
-
-  afterEach(async () => {
-    await db.close();
-    await db.destroy();
-    await database?.close();
-    await database?.destroy();
-  });
-});

package/tests/react/use-document-with-nonexistent-id.test.tsx

@@ -1,96 +0,0 @@
-import { renderHook, waitFor } from "@testing-library/react";
-import { describe, expect, it, beforeEach, afterEach } from "vitest";
-import { fireproof, useFireproof } from "use-fireproof";
-import type { Database, UseDocumentResult } from "use-fireproof";
-
-const TEST_TIMEOUT = 45000;
-
-// Define a type for user settings
-interface TestTypeDoc {
-  _id?: string;
-  testField?: string;
-  theme?: string;
-  notifications?: boolean;
-  language?: string;
-}
-
-describe("HOOK: useDocument with non-existent ID", () => {
-  const dbName = "useDocumentWithNonExistentId";
-  let db: Database;
-  let settingsResult: UseDocumentResult<TestTypeDoc>;
-  let database: ReturnType<typeof useFireproof>["database"];
-  let useDocument: ReturnType<typeof useFireproof>["useDocument"];
-  const testId = "test_settings";
-
-  beforeEach(async () => {
-    db = fireproof(dbName);
-
-    // Make sure the document doesn't exist
-    try {
-      const doc = await db.get(testId);
-      if (doc) {
-        // Use put with _deleted flag instead of delete
-        await db.put({ _id: testId, _deleted: true });
-      }
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    } catch (_) {
-      // Document doesn't exist, which is what we want
-    }
-
-    renderHook(() => {
-      const result = useFireproof(dbName);
-      database = result.database;
-      useDocument = result.useDocument;
-      settingsResult = useDocument<TestTypeDoc>({ _id: testId, testField: "test" });
-    });
-  });
-
-  it(
-    "should initialize with the provided _id even if document doesn't exist",
-    async () => {
-      // Try to refresh the document to see if we get the error
-      try {
-        await settingsResult.refresh();
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      } catch (_) {
-        // Expected error when document doesn't exist yet
-      }
-
-      await waitFor(() => {
-        expect(settingsResult.doc._id).toBe(testId);
-        expect(settingsResult.doc.testField).toBe("test");
-        // Other properties should be undefined
-        expect(settingsResult.doc.theme).toBeUndefined();
-        expect(settingsResult.doc.notifications).toBeUndefined();
-        expect(settingsResult.doc.language).toBeUndefined();
-      });
-
-      // Try to get the document directly from the database
-      try {
-        const docFromDb = await db.get(testId);
-        // This should not happen as the document doesn't exist yet
-        expect(docFromDb).toBeUndefined();
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-      } catch (_) {
-        // Expected error when document doesn't exist yet
-      }
-
-      // Try to save the document and see what happens
-      try {
-        await settingsResult.save();
-        // Document should be saved successfully
-      } catch (error) {
-        // This should not happen
-        expect(error).toBeUndefined();
-      }
-    },
-    TEST_TIMEOUT,
-  );
-
-  afterEach(async () => {
-    await db.close();
-    await db.destroy();
-    await database?.close();
-    await database?.destroy();
-  });
-});

package/tests/react/use-fireproof-db-switch.test.tsx

@@ -1,91 +0,0 @@
-import { renderHook, waitFor } from "@testing-library/react";
-import { describe, expect, it } from "vitest";
-import { fireproof, useFireproof } from "use-fireproof";
-import type { Database, LiveQueryResult } from "use-fireproof";
-
-// Test timeout value for CI
-const TEST_TIMEOUT = 45000;
-
-describe("HOOK: useFireproof database switching", () => {
-  const db1Name = "db1";
-  const db2Name = "db2";
-  let db1: Database, db2: Database;
-
-  beforeEach(async () => {
-    // Setup two databases with different data
-    db1 = fireproof(db1Name);
-    db2 = fireproof(db2Name);
-
-    // Add data to db1
-    await db1.put({ foo: "db1-data" });
-
-    // Add different data to db2
-    await db2.put({ foo: "db2-data" });
-  });
-
-  it(
-    "should switch databases and update query results when database name changes",
-    async () => {
-      let query: LiveQueryResult<{ foo: string }, string>;
-      let currentDbName: string;
-      let currentDb: Database;
-
-      // Initial render with db1
-      const { rerender } = renderHook(
-        ({ dbName }) => {
-          const result = useFireproof(dbName);
-          currentDbName = result.database.name;
-          currentDb = result.database;
-          query = result.useLiveQuery<{ foo: string }>("foo");
-          return result;
-        },
-        { initialProps: { dbName: db1Name } },
-      );
-
-      // Verify initial state with db1
-      await waitFor(() => {
-        expect(currentDbName).toBe(db1Name);
-        expect(currentDb.name).toBe(db1Name);
-        expect(query.rows.map((row) => row.doc?.foo)).toEqual(["db1-data"]);
-      });
-
-      // Switch to db2
-      rerender({ dbName: db2Name });
-
-      // Verify state with db2
-      await waitFor(() => {
-        expect(currentDbName).toBe(db2Name);
-        expect(currentDb.name).toBe(db2Name);
-        expect(query.rows.map((row) => row.doc?.foo)).toEqual(["db2-data"]);
-      });
-
-      // Switch back to db1
-      rerender({ dbName: db1Name });
-
-      // Verify state is back to db1
-      await waitFor(() => {
-        expect(currentDbName).toBe(db1Name);
-        expect(currentDb.name).toBe(db1Name);
-        expect(query.rows.map((row) => row.doc?.foo)).toEqual(["db1-data"]);
-      });
-
-      // Test that changes to the new database are reflected
-      await db2.put({ foo: "db2-updated" });
-      rerender({ dbName: db2Name });
-
-      await waitFor(() => {
-        expect(currentDbName).toBe(db2Name);
-        expect(currentDb.name).toBe(db2Name);
-        expect(query.rows.map((row) => row.doc?.foo)).toEqual(["db2-data", "db2-updated"]);
-      });
-    },
-    TEST_TIMEOUT,
-  );
-
-  afterEach(async () => {
-    await db1.close();
-    await db1.destroy();
-    await db2.close();
-    await db2.destroy();
-  });
-});

package/tests/react/use-fireproof-stability.test.tsx

@@ -1,145 +0,0 @@
-import { describe, expect, it, vi } from "vitest";
-import { act, fireEvent, render, waitFor } from "@testing-library/react";
-import { createElement, useEffect, useState } from "react";
-import { useFireproof } from "../../src/react/use-fireproof.js";
-
-// Extend HTMLElement for TypeScript compatibility
-declare global {
-  interface HTMLElement {
-    querySelector(selectors: string): HTMLElement | null;
-    getAttribute(name: string): string | null;
-    textContent: string | null;
-    click(): void;
-  }
-}
-
-// Test component that triggers state updates and verifies database stability
-function TestComponent() {
-  const { database } = useFireproof("test-stability-db");
-  const [counter, setCounter] = useState(0);
-  const initialDatabaseRef = database;
-
-  // Verify that the database reference remains stable across renders
-  if (counter > 0 && initialDatabaseRef !== database) {
-    throw new Error("Database reference changed between renders!");
-  }
-
-  return createElement("div", {}, [
-    createElement("div", { "data-testid": "db-name", key: "db-name" }, database.name),
-    createElement("div", { "data-testid": "counter", key: "counter" }, String(counter)),
-    createElement(
-      "button",
-      {
-        "data-testid": "increment",
-        key: "increment",
-        type: "button",
-        onClick: () => setCounter((c) => c + 1),
-      },
-      "Increment",
-    ),
-  ]);
-}
-
-// Test timeout value for CI
-const TEST_TIMEOUT = 60000; // 1 minute per test
-
-describe("HOOK: useFireproof stability", () => {
-  it(
-    "database instance remains stable across renders",
-    async () => {
-      // Mock console.error to catch any React errors
-      const consoleErrorMock = vi.spyOn(console, "error").mockImplementation(vi.fn());
-
-      const { findByTestId } = render(createElement(TestComponent, {}));
-
-      // Get initial state
-      const dbNameEl = await findByTestId("db-name" as const);
-      const counterEl = await findByTestId("counter" as const);
-
-      // Verify initial state
-      expect(dbNameEl.textContent).toBe("test-stability-db");
-      expect(counterEl.textContent).toBe("0");
-
-      // Trigger a re-render by updating state
-      const incrementButton = await findByTestId("increment" as const);
-      await act(async () => {
-        incrementButton.click();
-      });
-
-      // Verify state changed but no errors occurred
-      expect(counterEl.textContent).toBe("1");
-
-      // There should be no errors logged from React about database reference changing
-      expect(consoleErrorMock).not.toHaveBeenCalledWith(expect.stringContaining("Database reference changed between renders"));
-
-      // Perform multiple render cycles to ensure stability
-      for (let i = 0; i < 5; i++) {
-        await act(async () => {
-          incrementButton.click();
-        });
-      }
-
-      // Verify no errors occurred during multiple renders
-      expect(consoleErrorMock).not.toHaveBeenCalledWith(expect.stringContaining("Database reference changed between renders"));
-
-      // Restore console
-      consoleErrorMock.mockRestore();
-    },
-    TEST_TIMEOUT,
-  );
-
-  it(
-    "input events do not cause infinite render loops",
-    async () => {
-      // This test is specifically designed to catch the issue reported in v0.20.0
-
-      function InputTestComponent() {
-        // We still create the database to ensure no infinite render loops occur
-        // But we don't need to use any of its features directly in this test
-        useFireproof("test-input-db");
-        const [inputValue, setInputValue] = useState("");
-        const [renderCount, setRenderCount] = useState(0);
-
-        // Track render count
-        useEffect(() => {
-          setRenderCount((c) => c + 1);
-        }, []);
-
-        return createElement("div", {}, [
-          createElement("input", {
-            type: "text",
-            "data-testid": "input",
-            key: "input",
-            value: inputValue,
-            onChange: (e: { target: { value: string } }) => {
-              setInputValue(e.target.value);
-            },
-          }),
-          createElement("div", { "data-testid": "render-count", key: "render-count" }, String(renderCount)),
-        ]);
-      }
-
-      // Instead of using createRoot, use the standard render method
-      const { getByTestId } = render(createElement(InputTestComponent));
-
-      // Get the input element
-      const input = getByTestId("input");
-
-      // Simulate typing in the input field - this would trigger the bug in v0.20.0
-      await waitFor(() => {
-        fireEvent.change(input, { target: { value: "test" } });
-      });
-
-      // Wait a bit to ensure no infinite loop occurs
-      await new Promise((resolve) => setTimeout(resolve, 1000));
-
-      // Verify the render count hasn't exploded (if it were an infinite loop, the test would timeout)
-      const renderCount = getByTestId("render-count");
-
-      // The exact number isn't important, but it should be a small number
-      // If we're in an infinite loop, the test would have timed out before reaching here
-      expect(parseInt(renderCount.textContent || "0", 10)).toBeLessThan(10);
-    },
-    TEST_TIMEOUT,
-  );
-});