@alloy-js/core 0.23.0-dev.9 → 0.24.0-dev.1

package/src/debug/diagnostics-broadcast.test.tsx

@@ -0,0 +1,98 @@
+import { mkdtempSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { afterEach, beforeEach, expect, it } from "vitest";
+import { DiagnosticsCollector } from "../diagnostics.js";
+import { closeTrace, initTrace, setChangeListener } from "./trace-writer.js";
+
+let tmpDir: string;
+
+beforeEach(async () => {
+  tmpDir = mkdtempSync(join(tmpdir(), "alloy-diag-test-"));
+});
+
+afterEach(async () => {
+  setChangeListener(null);
+  closeTrace();
+  rmSync(tmpDir, { recursive: true, force: true });
+});
+
+it("does not call insertDiagnostic when tracing is disabled", () => {
+  let events = 0;
+  setChangeListener(() => {
+    events++;
+  });
+
+  const collector = new DiagnosticsCollector();
+  for (let i = 0; i < 100; i++) {
+    collector.emit({ message: `diag ${i}`, severity: "warning" });
+  }
+
+  // No trace DB => no change events should fire.
+  expect(events).toBe(0);
+  expect(collector.getDiagnostics()).toHaveLength(100);
+});
+
+it("emits one added event per diagnostic (linear, not quadratic)", async () => {
+  await initTrace(join(tmpDir, "trace.db"));
+  const events: Array<{ channel: string; action: string }> = [];
+  setChangeListener((event) => {
+    events.push({ channel: event.channel, action: event.action });
+  });
+
+  const collector = new DiagnosticsCollector();
+  const N = 50;
+  for (let i = 0; i < N; i++) {
+    collector.emit({ message: `diag ${i}`, severity: "warning" });
+  }
+
+  const added = events.filter(
+    (e) => e.channel === "diagnostics" && e.action === "added",
+  );
+  expect(added).toHaveLength(N); // was previously N*(N+1)/2 due to re-broadcast
+});
+
+it("emits one removed event per dismissal", async () => {
+  await initTrace(join(tmpDir, "trace.db"));
+  const events: Array<{ channel: string; action: string }> = [];
+  setChangeListener((event) => {
+    events.push({ channel: event.channel, action: event.action });
+  });
+
+  const collector = new DiagnosticsCollector();
+  const handles = [];
+  for (let i = 0; i < 10; i++) {
+    handles.push(collector.emit({ message: `diag ${i}`, severity: "warning" }));
+  }
+
+  for (const h of handles) h.dismiss();
+
+  const added = events.filter(
+    (e) => e.channel === "diagnostics" && e.action === "added",
+  );
+  const removed = events.filter(
+    (e) => e.channel === "diagnostics" && e.action === "removed",
+  );
+  expect(added).toHaveLength(10);
+  expect(removed).toHaveLength(10);
+  expect(collector.getDiagnostics()).toHaveLength(0);
+});
+
+it("dismiss is idempotent and only fires one removal", async () => {
+  await initTrace(join(tmpDir, "trace.db"));
+  const events: Array<{ channel: string; action: string }> = [];
+  setChangeListener((event) => {
+    events.push({ channel: event.channel, action: event.action });
+  });
+
+  const collector = new DiagnosticsCollector();
+  const h = collector.emit({ message: "once", severity: "warning" });
+  h.dismiss();
+  h.dismiss();
+  h.dismiss();
+
+  const removed = events.filter(
+    (e) => e.channel === "diagnostics" && e.action === "removed",
+  );
+  expect(removed).toHaveLength(1);
+});

package/src/debug/diagnostics.test.tsx

@@ -34,7 +34,7 @@ afterEach(async () => {
 });
 
 it("emits diagnostics:report messages", async () => {
-  const collector = createMessageCollector(socket!);
+  const collector = await createMessageCollector(socket!);
   const diagnostics = new DiagnosticsCollector();
 
   diagnostics.emit({ message: "Test diagnostic", severity: "warning" });
@@ -50,6 +50,7 @@ it("emits diagnostics:report messages", async () => {
 
   expect(diagnosticsMessages[0]).toMatchObject({
     type: "diagnostics:report",
-    diagnostics: expect.any(Array),
+    message: "Test diagnostic",
+    severity: "warning",
   });
 });

package/src/debug/effects.test.tsx

@@ -1,4 +1,5 @@
-import { afterEach, beforeEach, expect, it } from "vitest";
+import { shallowReactive } from "@vue/reactivity";
+import { afterEach, beforeEach, describe, expect, it } from "vitest";
 import WebSocket from "ws";
 import {
   createMessageCollector,
@@ -9,8 +10,9 @@ import {
   enableDevtools,
   resetDevtoolsServerForTests,
 } from "../devtools/devtools-server.js";
-import { effect, ref } from "../reactivity.js";
+import { effect, memo, ref } from "../reactivity.js";
 import { renderAsync } from "../render.js";
+import { flushJobsAsync } from "../scheduler.js";
 import { debug } from "./index.js";
 
 let socket: WebSocket | undefined;
@@ -36,54 +38,264 @@ afterEach(async () => {
   debug.effect.reset();
 });
 
-it("emits effect, ref, edge, and update messages", async () => {
-  const collector = createMessageCollector(socket!);
+it("emits effect, ref, and track messages", async () => {
+  const collector = await createMessageCollector(socket!);
   const r1 = ref(0);
+  const r2 = ref(1);
 
-  // Create an effect that reads r1.
-  let observed = 0;
   effect(() => {
-    observed = r1.value;
+    r1.value = r2.value + 1;
   });
 
-  // Mutate r1 to trigger the effect.
-  r1.value = 42;
-
   await renderAsync(<Output>{"ok"}</Output>);
 
   const messages = await collector.waitForRender();
   const effectsMessages = filterEffectsMessages(messages);
   collector.stop();
 
-  // Check that core message types are present
-  const byType = (type: string) =>
-    effectsMessages.filter((m: any) => m.type === type);
-  expect(byType("effect:refAdded").length).toBeGreaterThanOrEqual(1);
-  expect(byType("effect:effectAdded").length).toBeGreaterThanOrEqual(1);
-  expect(byType("effect:track").length).toBeGreaterThanOrEqual(1);
-  expect(byType("effect:trigger").length).toBeGreaterThanOrEqual(1);
-  expect(byType("effect:effectUpdated").length).toBeGreaterThanOrEqual(1);
-
-  // Verify message shapes
-  expect(byType("effect:refAdded")[0]).toMatchObject({
-    ref: expect.objectContaining({ id: expect.any(Number), kind: "ref" }),
+  expect(effectsMessages[0]).toMatchObject({
+    type: "ref:added",
+    id: expect.any(Number),
+    kind: "ref",
+  });
+  expect(effectsMessages[1]).toMatchObject({
+    type: "ref:added",
+    id: expect.any(Number),
+    kind: "ref",
+  });
+  expect(effectsMessages[2]).toMatchObject({
+    type: "effect:added",
+    id: expect.any(Number),
+  });
+  expect(effectsMessages[3]).toMatchObject({
+    type: "edge:track",
+    effect_id: expect.any(Number),
+    ref_id: expect.any(Number),
+  });
+});
+
+describe("unified trigger edges", () => {
+  it("ref trigger records consumer and producer (caused_by)", async () => {
+    const collector = await createMessageCollector(socket!);
+    const r = ref(0);
+
+    // Producer effect writes to the ref
+    const producerName = "test-producer";
+    effect(
+      () => {
+        r.value = 42;
+      },
+      undefined,
+      { debug: { name: producerName } },
+    );
+
+    // Consumer effect reads the ref
+    const consumerName = "test-consumer";
+    effect(
+      () => {
+        void r.value;
+      },
+      undefined,
+      { debug: { name: consumerName } },
+    );
+
+    await renderAsync(<Output>{"ok"}</Output>);
+    const renderMessages = await collector.waitForRender();
+
+    // Trigger the consumer by changing the ref
+    r.value = 99;
+    await flushJobsAsync();
+    const flushMessages = await collector.waitForFlush();
+    collector.stop();
+
+    // Find the trigger edge on the consumer
+    const triggerEdges = flushMessages.filter(
+      (m: any) => m.type === "edge:trigger" && m.ref_id !== undefined,
+    );
+    expect(triggerEdges.length).toBeGreaterThan(0);
+
+    // The trigger edge should be on the consumer effect
+    const effectsMessages = filterEffectsMessages(renderMessages);
+    const consumerEffect = effectsMessages.find(
+      (m: any) => m.type === "effect:added" && m.name === consumerName,
+    );
+    expect(consumerEffect).toBeDefined();
+
+    const consumerTrigger = triggerEdges.find(
+      (m: any) => m.effect_id === consumerEffect!.id,
+    );
+    expect(consumerTrigger).toBeDefined();
+    // caused_by is null since the mutation happens outside any effect (top-level r.value = 99)
+    expect(consumerTrigger!.caused_by).toBeNull();
   });
-  expect(byType("effect:effectAdded")[0]).toMatchObject({
-    effect: expect.objectContaining({ id: expect.any(Number) }),
+
+  it("reactive object trigger records consumer and producer", async () => {
+    const collector = await createMessageCollector(socket!);
+    const map = shallowReactive(new Map<string, number>());
+
+    // Consumer: memo reads the map
+    const sum = memo(() => {
+      let total = 0;
+      for (const v of map.values()) total += v;
+      return total;
+    });
+
+    // Producer: effect mutates the map
+    effect(
+      () => {
+        const _s = sum();
+        map.set("key", 42);
+      },
+      undefined,
+      { debug: { name: "producer-effect" } },
+    );
+
+    await renderAsync(<Output>{"ok"}</Output>);
+
+    const messages = await collector.waitForRender();
+    const effectsMessages = filterEffectsMessages(messages);
+    collector.stop();
+
+    // Find trigger edges for the reactive map
+    const triggerEdges = effectsMessages.filter(
+      (m: any) => m.type === "edge:trigger" && m.target_id !== undefined,
+    );
+    expect(triggerEdges.length).toBeGreaterThan(0);
+
+    // The trigger should have caused_by (the producer effect)
+    const producerEffect = effectsMessages.find(
+      (m: any) => m.type === "effect:added" && m.name === "producer-effect",
+    );
+    expect(producerEffect).toBeDefined();
+
+    const withCause = triggerEdges.filter(
+      (m: any) => m.caused_by === producerEffect!.id,
+    );
+    expect(withCause.length).toBeGreaterThan(0);
+    expect(withCause[0]).toMatchObject({
+      type: "edge:trigger",
+      effect_id: expect.any(Number),
+      caused_by: producerEffect!.id,
+      target_id: expect.any(Number),
+    });
   });
-  expect(byType("effect:track")[0]).toMatchObject({
-    edge: expect.objectContaining({
-      type: "track",
-      effectId: expect.any(Number),
-      refId: expect.any(Number),
-    }),
+
+  it("trigger outside any effect has no caused_by", async () => {
+    const collector = await createMessageCollector(socket!);
+    const r = ref(0);
+
+    // Consumer effect
+    effect(() => {
+      void r.value;
+    });
+
+    await renderAsync(<Output>{"ok"}</Output>);
+    await collector.waitForRender();
+
+    // Trigger from top-level (outside any effect)
+    r.value = 1;
+    await flushJobsAsync();
+    const flushMessages = await collector.waitForFlush();
+    collector.stop();
+
+    const triggerEdges = flushMessages.filter(
+      (m: any) => m.type === "edge:trigger",
+    );
+    expect(triggerEdges.length).toBeGreaterThan(0);
+    // caused_by should be null (no producer effect)
+    expect(triggerEdges[0].caused_by).toBeNull();
   });
-  expect(byType("effect:trigger")[0]).toMatchObject({
-    edge: expect.objectContaining({
-      effectId: expect.any(Number),
-      refId: expect.any(Number),
-    }),
+
+  it("multiple consumers of same ref get separate trigger edges", async () => {
+    const collector = await createMessageCollector(socket!);
+    const r = ref(0);
+
+    // Two consumer effects
+    effect(
+      () => {
+        void r.value;
+      },
+      undefined,
+      { debug: { name: "consumer-a" } },
+    );
+    effect(
+      () => {
+        void r.value;
+      },
+      undefined,
+      { debug: { name: "consumer-b" } },
+    );
+
+    await renderAsync(<Output>{"ok"}</Output>);
+    const renderMessages = await collector.waitForRender();
+
+    // Find the effect IDs
+    const effectsMessages = filterEffectsMessages(renderMessages);
+    const consumerA = effectsMessages.find(
+      (m: any) => m.type === "effect:added" && m.name === "consumer-a",
+    );
+    const consumerB = effectsMessages.find(
+      (m: any) => m.type === "effect:added" && m.name === "consumer-b",
+    );
+    expect(consumerA).toBeDefined();
+    expect(consumerB).toBeDefined();
+
+    // Trigger both by changing the ref
+    r.value = 1;
+    await flushJobsAsync();
+    const flushMessages = await collector.waitForFlush();
+    collector.stop();
+
+    const triggerEdges = flushMessages.filter(
+      (m: any) => m.type === "edge:trigger",
+    );
+
+    // Each consumer gets its own trigger edge
+    const aTrigger = triggerEdges.find(
+      (m: any) => m.effect_id === consumerA!.id,
+    );
+    const bTrigger = triggerEdges.find(
+      (m: any) => m.effect_id === consumerB!.id,
+    );
+    expect(aTrigger).toBeDefined();
+    expect(bTrigger).toBeDefined();
+    // Both reference the same ref
+    expect(aTrigger!.ref_id).toBe(bTrigger!.ref_id);
   });
 
-  expect(observed).toBe(42);
+  it("no triggered-by or duplicate trigger edge types exist", async () => {
+    const collector = await createMessageCollector(socket!);
+    const r = ref(0);
+    const map = shallowReactive(new Map<string, number>());
+
+    effect(() => {
+      void r.value;
+      for (const _v of map.values()) {
+        /* track */
+      }
+    });
+
+    effect(() => {
+      r.value = 1;
+      map.set("x", 1);
+    });
+
+    await renderAsync(<Output>{"ok"}</Output>);
+    const messages = await collector.waitForRender();
+    collector.stop();
+
+    // No edge:triggered-by messages should exist
+    const triggeredBy = messages.filter(
+      (m: any) => m.type === "edge:triggered-by",
+    );
+    expect(triggeredBy.length).toBe(0);
+
+    // All edge types should be edge:track or edge:trigger only
+    const edges = messages.filter(
+      (m: any) => typeof m.type === "string" && m.type.startsWith("edge:"),
+    );
+    for (const edge of edges) {
+      expect(["edge:track", "edge:trigger"]).toContain(edge.type);
+    }
+  });
 });