preact-missing-hooks 3.1.0 → 4.1.0

package/tests/useClipboard.test.tsx

@@ -4,6 +4,8 @@ import { useState } from 'preact/hooks'
 import { render, fireEvent, waitFor } from '@testing-library/preact'
 import { useClipboard } from '../src/useClipboard'
 
+const isReact = !!(globalThis as unknown as { __VITEST_REACT__?: boolean }).__VITEST_REACT__
+
 describe('useClipboard', () => {
   const originalNavigator = global.navigator
 
@@ -15,7 +17,7 @@ describe('useClipboard', () => {
     vi.useRealTimers()
   })
 
-  it('copy succeeds and sets copied to true', async () => {
+  it.skipIf(isReact)('copy succeeds and sets copied to true', async () => {
     vi.useFakeTimers()
     const writeText = vi.fn().mockResolvedValue(undefined)
     Object.defineProperty(global, 'navigator', {
@@ -108,7 +110,7 @@ describe('useClipboard', () => {
     })
   })
 
-  it('reset clears copied and error state', async () => {
+  it.skipIf(isReact)('reset clears copied and error state', async () => {
     vi.useFakeTimers()
     const writeText = vi.fn().mockResolvedValue(undefined)
     Object.defineProperty(global, 'navigator', {

package/tests/useLLMMetadata.test.tsx

@@ -0,0 +1,149 @@
+/** @jsx h */
+import { h } from "preact";
+import { render } from "@testing-library/preact";
+import "@testing-library/jest-dom";
+import { useLLMMetadata } from "../src/useLLMMetadata";
+
+const SCRIPT_SELECTOR = 'script[data-llm="true"]';
+
+function getLLMScript(): HTMLScriptElement | null {
+  return document.querySelector(SCRIPT_SELECTOR);
+}
+
+function getLLMPayload(): unknown {
+  const script = getLLMScript();
+  if (!script?.textContent) return null;
+  try {
+    return JSON.parse(script.textContent);
+  } catch {
+    return null;
+  }
+}
+
+describe("useLLMMetadata", () => {
+  beforeEach(() => {
+    document.head.querySelectorAll(SCRIPT_SELECTOR).forEach((el) => el.remove());
+  });
+
+  it("injects script with type application/llm+json and data-llm=true", () => {
+    function TestComponent() {
+      useLLMMetadata({ route: "/", mode: "manual", title: "Home" });
+      return <div />;
+    }
+    render(<TestComponent />);
+    const script = getLLMScript();
+    expect(script).toBeInTheDocument();
+    expect(script?.getAttribute("type")).toBe("application/llm+json");
+    expect(script?.getAttribute("data-llm")).toBe("true");
+  });
+
+  it("manual mode uses title, description, tags from config", () => {
+    function TestComponent() {
+      useLLMMetadata({
+        route: "/blog/ai",
+        mode: "manual",
+        title: "AI Post",
+        description: "A short desc",
+        tags: ["a", "b"],
+      });
+      return <div />;
+    }
+    render(<TestComponent />);
+    const payload = getLLMPayload() as Record<string, unknown>;
+    expect(payload).not.toBeNull();
+    expect(payload.route).toBe("/blog/ai");
+    expect(payload.title).toBe("AI Post");
+    expect(payload.description).toBe("A short desc");
+    expect(payload.tags).toEqual(["a", "b"]);
+    expect(payload.generatedAt).toBeDefined();
+  });
+
+  it("removes previous script when route changes", () => {
+    function TestComponent({ route }: { route: string }) {
+      useLLMMetadata({ route, mode: "manual", title: route });
+      return <div />;
+    }
+    const { rerender } = render(<TestComponent route="/a" />);
+    expect(getLLMScript()?.textContent).toContain('"route":"/a"');
+    rerender(<TestComponent route="/b" />);
+    const script = getLLMScript();
+    expect(script).toBeInTheDocument();
+    expect(script?.textContent).toContain('"route":"/b"');
+    expect(document.querySelectorAll(SCRIPT_SELECTOR).length).toBe(1);
+  });
+
+  it("auto-extract mode uses document.title and builds outline from visible h1/h2", () => {
+    document.title = "Page Title";
+    const main = document.createElement("main");
+    const h1 = document.createElement("h1");
+    h1.textContent = "Intro";
+    const h2 = document.createElement("h2");
+    h2.textContent = "Section";
+    main.append(h1, h2);
+    document.body.appendChild(main);
+
+    function TestComponent() {
+      useLLMMetadata({ route: "/doc", mode: "auto-extract" });
+      return <div />;
+    }
+    render(<TestComponent />);
+    const payload = getLLMPayload() as Record<string, unknown>;
+    expect(payload?.title).toBe("Page Title");
+    expect(Array.isArray(payload?.outline)).toBe(true);
+    expect((payload?.outline as string[]).includes("Intro")).toBe(true);
+    expect((payload?.outline as string[]).includes("Section")).toBe(true);
+    main.remove();
+  });
+
+  it("cleans up script on unmount", () => {
+    function Page() {
+      useLLMMetadata({ route: "/x", mode: "manual" });
+      return <div>Page</div>;
+    }
+    const { unmount } = render(<Page />);
+    expect(getLLMScript()).toBeInTheDocument();
+    unmount();
+    expect(getLLMScript()).not.toBeInTheDocument();
+  });
+
+  it("default mode is manual when mode is omitted", () => {
+    function TestComponent() {
+      useLLMMetadata({ route: "/", title: "T" });
+      return <div />;
+    }
+    render(<TestComponent />);
+    const payload = getLLMPayload() as Record<string, unknown>;
+    expect(payload?.title).toBe("T");
+    expect(payload?.outline).toBeUndefined();
+  });
+
+  it("accepts null config without throwing and injects minimal payload", () => {
+    function TestComponent() {
+      useLLMMetadata(null);
+      return <div />;
+    }
+    expect(() => render(<TestComponent />)).not.toThrow();
+    const payload = getLLMPayload() as Record<string, unknown>;
+    expect(payload?.route).toBe("/");
+    expect(payload?.generatedAt).toBeDefined();
+  });
+
+  it("includes canonicalUrl, ogType, siteName when provided", () => {
+    function TestComponent() {
+      useLLMMetadata({
+        route: "/page",
+        mode: "manual",
+        title: "Page",
+        canonicalUrl: "https://example.com/page",
+        ogType: "article",
+        siteName: "My Site",
+      });
+      return <div />;
+    }
+    render(<TestComponent />);
+    const payload = getLLMPayload() as Record<string, unknown>;
+    expect(payload?.canonicalUrl).toBe("https://example.com/page");
+    expect(payload?.ogType).toBe("article");
+    expect(payload?.siteName).toBe("My Site");
+  });
+});

package/tests/useThreadedWorker.test.tsx

@@ -4,6 +4,8 @@ import { render, waitFor } from '@testing-library/preact'
 import '@testing-library/jest-dom'
 import { useThreadedWorker } from '@/useThreadedWorker'
 
+const isReact = !!(globalThis as unknown as { __VITEST_REACT__?: boolean }).__VITEST_REACT__
+
 /** Worker that resolves after delay with the input value (for order/concurrency tests). */
 function delayedWorker<T>(delayMs: number) {
   return (data: T): Promise<T> =>
@@ -12,7 +14,7 @@ function delayedWorker<T>(delayMs: number) {
 
 describe('useThreadedWorker', () => {
   describe('sequential mode', () => {
-    it('runs one task at a time and returns result', async () => {
+    it.skipIf(isReact)('runs one task at a time and returns result', async () => {
       const worker = vi.fn().mockResolvedValue('done')
       let api: ReturnType<typeof useThreadedWorker<string, string>>
 

package/tests/useWasmCompute.test.tsx

@@ -19,7 +19,7 @@ describe('useWasmCompute', () => {
     URL.revokeObjectURL = originalRevokeObjectURL;
   });
 
-  it('returns error when window is undefined (SSR)', async () => {
+  it.skipIf(!!(globalThis as unknown as { __VITEST_REACT__?: boolean }).__VITEST_REACT__)('returns error when window is undefined (SSR)', async () => {
     const container = document.createElement('div');
     document.body.appendChild(container);
     (global as unknown as { window: undefined }).window = undefined;

package/tests/useWebRTCIP.test.tsx

@@ -4,6 +4,8 @@ import { render, waitFor } from '@testing-library/preact';
 import '@testing-library/jest-dom';
 import { useWebRTCIP } from '@/useWebRTCIP';
 
+const isReact = !!(globalThis as unknown as { __VITEST_REACT__?: boolean }).__VITEST_REACT__;
+
 describe('useWebRTCIP', () => {
   const originalRTCPeerConnection = global.RTCPeerConnection;
 
@@ -37,7 +39,7 @@ describe('useWebRTCIP', () => {
     expect(getByTestId('ips').textContent).toBe('');
   });
 
-  it('starts with loading true and then resolves with mock ICE candidate', async () => {
+  it.skipIf(isReact)('starts with loading true and then resolves with mock ICE candidate', async () => {
     vi.useFakeTimers();
 
     let onIceCandidate: (e: { candidate: { candidate: string } | null }) => void = () => { };

package/vite.config.ts

@@ -1,15 +1,22 @@
-import { defineConfig } from 'vitest/config';
-import path from 'node:path';
+import { defineConfig } from "vitest/config";
+import path from "node:path";
 
 export default defineConfig({
   resolve: {
     alias: {
-      '@': path.resolve(__dirname, './src'),
+      "@": path.resolve(__dirname, "./src"),
     },
   },
   test: {
     globals: true,
-    environment: 'jsdom',
+    environment: "jsdom",
     setupFiles: [],
+    include: ["tests/**/*.test.{ts,tsx}"],
+    poolOptions: {
+      threads: {
+        maxThreads: 8,
+        minThreads: 1,
+      },
+    },
   },
 });

package/vitest.config.preact.ts

@@ -0,0 +1,21 @@
+import { defineConfig } from "vitest/config";
+import path from "node:path";
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+      react: path.resolve(__dirname, "./tests/preact-as-react.ts"),
+    },
+  },
+  test: {
+    name: "preact",
+    globals: true,
+    environment: "jsdom",
+    setupFiles: [],
+    include: ["tests/**/*.test.{ts,tsx}"],
+    poolOptions: {
+      threads: { maxThreads: 8, minThreads: 1 },
+    },
+  },
+});

package/vitest.config.react.ts

@@ -0,0 +1,36 @@
+import { defineConfig } from "vitest/config";
+import path from "node:path";
+
+const rootDir = __dirname;
+
+export default defineConfig({
+  resolve: {
+    alias: [
+      {
+        find: "preact/hooks",
+        replacement: path.resolve(rootDir, "node_modules/react"),
+      },
+      {
+        find: "preact",
+        replacement: path.resolve(rootDir, "tests/react-adapter.tsx"),
+      },
+      {
+        find: "@testing-library/preact",
+        replacement: path.resolve(rootDir, "node_modules/@testing-library/react"),
+      },
+      { find: "@", replacement: path.resolve(rootDir, "./src") },
+    ],
+  },
+  test: {
+    name: "react",
+    globals: true,
+    environment: "jsdom",
+    setupFiles: [path.resolve(rootDir, "tests/setup-react.ts")],
+    include: ["tests/**/*.test.{ts,tsx}"],
+    testTimeout: 10000,
+    hookTimeout: 10000,
+    poolOptions: {
+      threads: { maxThreads: 8, minThreads: 1 },
+    },
+  },
+});

package/vitest.workspace.ts

@@ -0,0 +1,6 @@
+import { defineWorkspace } from "vitest/config";
+
+export default defineWorkspace([
+  "vitest.config.preact.ts",
+  "vitest.config.react.ts",
+]);