@assistkick/create 1.0.0

package/templates/product-system/tests/node_search.test.ts

@@ -0,0 +1,340 @@
+/**
+ * Tests for Node Search with real-time graph highlighting (feat_020 + feat_035).
+ * Uses node:test built-in runner.
+ * Tests search logic, type filtering, onQueryChange callback, and clear behavior.
+ */
+import { describe, it, mock } from 'node:test';
+import assert from 'node:assert/strict';
+const ALL_NODE_TYPES = [
+  'feature', 'component', 'data_entity', 'decision', 'tech_choice',
+  'non_functional_requirement', 'design_token', 'design_pattern',
+  'user_role', 'flow', 'assumption', 'open_question',
+];
+
+const TYPE_DISPLAY_NAMES: Record<string, string> = {
+  feature: 'Feature', component: 'Component', data_entity: 'Data Entity',
+  decision: 'Decision', tech_choice: 'Tech Choice',
+  non_functional_requirement: 'NFR', design_token: 'Design Token',
+  design_pattern: 'Design Pattern', user_role: 'User Role',
+  flow: 'Flow', assumption: 'Assumption', open_question: 'Open Question',
+};
+
+class NodeSearch {
+  nodes: any[] = [];
+  query = '';
+  inputEl: any = null;
+  onSelect: any;
+  onQueryChange: any;
+  selectedType: string | null = null;
+
+  constructor(_container: any, _doc: any, onSelect: any, onQueryChange?: any) {
+    this.onSelect = onSelect;
+    this.onQueryChange = onQueryChange || null;
+  }
+
+  setNodes(nodes: any) {
+    this.nodes = nodes || [];
+  }
+
+  search(query: string | null, typeFilter: string | null): any[] {
+    if (!query || !query.trim()) return [];
+    const q = query.toLowerCase().trim();
+    let results = this.nodes.filter((n: any) => n.name.toLowerCase().includes(q));
+    if (typeFilter) results = results.filter((n: any) => n.type === typeFilter);
+    return results.slice(0, 20);
+  }
+
+  handleInput(e: any) {
+    this.query = e.target.value;
+    if (this.onQueryChange) this.onQueryChange(this.query);
+  }
+
+  handleTypeChange(e: any) {
+    this.selectedType = e.target.value;
+    if (this.onQueryChange) this.onQueryChange(this.query);
+  }
+
+  handleKeydown(e: any) {
+    if (e.key === 'Escape') {
+      this.clear();
+    }
+  }
+
+  clear() {
+    this.query = '';
+    if (this.inputEl) this.inputEl.value = '';
+    if (this.onQueryChange) this.onQueryChange('');
+  }
+
+  closeResults() {
+    // no-op for backward compat
+  }
+}
+
+// Test fixtures
+const makeNodes = () => [
+  { id: 'feat_001', type: 'feature', name: 'Node CRUD Operations' },
+  { id: 'feat_002', type: 'feature', name: 'Edge Management' },
+  { id: 'comp_001', type: 'component', name: 'Graph Renderer' },
+  { id: 'dec_001', type: 'decision', name: 'Force-Directed Layout' },
+  { id: 'tech_001', type: 'tech_choice', name: 'D3.js Force Graph' },
+  { id: 'nfr_001', type: 'non_functional_requirement', name: 'Development Guidelines' },
+  { id: 'dpat_001', type: 'design_pattern', name: 'Full-Screen Graph Layout' },
+];
+
+// Minimal DOM mock for NodeSearch constructor (init not called)
+const makeMockContainer = () => ({
+  querySelector: mock.fn(() => null),
+  contains: mock.fn(() => false),
+});
+
+const makeMockDocument = () => ({
+  addEventListener: mock.fn(),
+  removeEventListener: mock.fn(),
+  createElement: mock.fn(() => ({
+    className: '',
+    classList: { add: mock.fn() },
+    textContent: '',
+    appendChild: mock.fn(),
+    addEventListener: mock.fn(),
+    style: {},
+  })),
+});
+
+describe('NodeSearch', () => {
+
+  describe('search method', () => {
+    it('returns matching nodes by partial name (case-insensitive)', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('crud', null);
+      assert.equal(results.length, 1);
+      assert.equal(results[0].id, 'feat_001');
+    });
+
+    it('matches partial names', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('graph', null);
+      assert.equal(results.length, 3);
+      const ids = results.map(r => r.id).sort();
+      assert.deepEqual(ids, ['comp_001', 'dpat_001', 'tech_001']);
+    });
+
+    it('is case-insensitive', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const lower = search.search('d3.js', null);
+      const upper = search.search('D3.JS', null);
+      const mixed = search.search('d3.Js', null);
+
+      assert.equal(lower.length, 1);
+      assert.equal(upper.length, 1);
+      assert.equal(mixed.length, 1);
+      assert.equal(lower[0].id, 'tech_001');
+    });
+
+    it('returns empty array for empty query', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      assert.deepEqual(search.search('', null), []);
+      assert.deepEqual(search.search('   ', null), []);
+      assert.deepEqual(search.search(null, null), []);
+    });
+
+    it('returns empty array when no matches', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('zzzzzzz', null);
+      assert.equal(results.length, 0);
+    });
+
+    it('limits results to 20', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      const manyNodes = Array.from({ length: 30 }, (_, i) => ({
+        id: `feat_${i}`, type: 'feature', name: `Feature ${i}`,
+      }));
+      search.setNodes(manyNodes);
+
+      const results = search.search('Feature', null);
+      assert.equal(results.length, 20);
+    });
+  });
+
+  describe('type filter', () => {
+    it('filters results by node type', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('graph', 'component');
+      assert.equal(results.length, 1);
+      assert.equal(results[0].id, 'comp_001');
+    });
+
+    it('returns no results when type filter excludes all matches', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('crud', 'decision');
+      assert.equal(results.length, 0);
+    });
+
+    it('passes null type filter to show all types', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(makeNodes());
+
+      const results = search.search('e', null);
+      // Multiple types should appear
+      const types = new Set(results.map(r => r.type));
+      assert.ok(types.size > 1, 'multiple types should appear');
+    });
+  });
+
+  describe('onQueryChange callback', () => {
+    it('fires onQueryChange on every input event', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.setNodes(makeNodes());
+
+      search.handleInput({ target: { value: 'gra' } });
+      assert.equal(queryCallback.mock.calls.length, 1);
+      assert.equal(queryCallback.mock.calls[0].arguments[0], 'gra');
+
+      search.handleInput({ target: { value: 'graph' } });
+      assert.equal(queryCallback.mock.calls.length, 2);
+      assert.equal(queryCallback.mock.calls[1].arguments[0], 'graph');
+    });
+
+    it('fires onQueryChange with empty string when input is cleared', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+
+      search.handleInput({ target: { value: '' } });
+      assert.equal(queryCallback.mock.calls.length, 1);
+      assert.equal(queryCallback.mock.calls[0].arguments[0], '');
+    });
+
+    it('does not throw when onQueryChange is null', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, null);
+      assert.doesNotThrow(() => {
+        search.handleInput({ target: { value: 'test' } });
+      });
+    });
+
+    it('fires onQueryChange on type filter change', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.query = 'graph';
+
+      search.handleTypeChange({ target: { value: 'component' } });
+      assert.equal(queryCallback.mock.calls.length, 1);
+      assert.equal(queryCallback.mock.calls[0].arguments[0], 'graph');
+    });
+  });
+
+  describe('clear method', () => {
+    it('resets query and input value', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, mock.fn());
+      search.inputEl = { value: 'test' };
+      search.query = 'test';
+
+      search.clear();
+
+      assert.equal(search.query, '');
+      assert.equal(search.inputEl.value, '');
+    });
+
+    it('fires onQueryChange with empty string', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.inputEl = { value: 'test' };
+      search.query = 'test';
+
+      search.clear();
+
+      assert.equal(queryCallback.mock.calls.length, 1);
+      assert.equal(queryCallback.mock.calls[0].arguments[0], '');
+    });
+
+    it('Escape key calls clear', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.inputEl = { value: 'test' };
+      search.query = 'test';
+
+      search.handleKeydown({ key: 'Escape' });
+
+      assert.equal(search.query, '');
+      assert.equal(queryCallback.mock.calls.length, 1);
+      assert.equal(queryCallback.mock.calls[0].arguments[0], '');
+    });
+  });
+
+  describe('keyboard handling', () => {
+    it('Escape clears the search', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.inputEl = { value: 'hello' };
+      search.query = 'hello';
+
+      search.handleKeydown({ key: 'Escape' });
+
+      assert.equal(search.query, '');
+      assert.equal(search.inputEl.value, '');
+    });
+
+    it('non-Escape keys do not clear', () => {
+      const queryCallback = mock.fn();
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null, queryCallback);
+      search.query = 'hello';
+
+      search.handleKeydown({ key: 'Enter' });
+
+      assert.equal(search.query, 'hello');
+      assert.equal(queryCallback.mock.calls.length, 0);
+    });
+  });
+
+  describe('constants', () => {
+    it('ALL_NODE_TYPES contains all expected types', () => {
+      assert.equal(ALL_NODE_TYPES.length, 12);
+      assert.ok(ALL_NODE_TYPES.includes('feature'));
+      assert.ok(ALL_NODE_TYPES.includes('decision'));
+      assert.ok(ALL_NODE_TYPES.includes('open_question'));
+    });
+
+    it('TYPE_DISPLAY_NAMES has an entry for every type', () => {
+      for (const type of ALL_NODE_TYPES) {
+        assert.ok(TYPE_DISPLAY_NAMES[type], `missing display name for ${type}`);
+      }
+    });
+  });
+
+  describe('setNodes', () => {
+    it('sets nodes for searching', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      assert.deepEqual(search.nodes, []);
+
+      search.setNodes(makeNodes());
+      assert.equal(search.nodes.length, 7);
+    });
+
+    it('handles null nodes gracefully', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      search.setNodes(null);
+      assert.deepEqual(search.nodes, []);
+    });
+  });
+
+  describe('closeResults (backward compat)', () => {
+    it('is a no-op and does not throw', () => {
+      const search = new NodeSearch(makeMockContainer(), makeMockDocument(), null);
+      assert.doesNotThrow(() => search.closeResults());
+    });
+  });
+});

package/templates/product-system/tests/node_sizing.test.ts

@@ -0,0 +1,170 @@
+/**
+ * Tests for Node Sizing by Edge Count (feat_014).
+ * Uses node:test built-in runner.
+ * Tests that node radius scales proportionally to edge count,
+ * with min/max caps and perceptible size differences.
+ */
+import { describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+const createRenderer = () => ({
+  nodeRadius(d: any) {
+    const base = 8;
+    const scale = Math.min((d.edgeCount || 0) * 1.5, 20);
+    return base + scale;
+  },
+  buildNodes(graphData: any) {
+    const edgeCounts = new Map();
+    graphData.edges.forEach((e: any) => {
+      edgeCounts.set(e.from, (edgeCounts.get(e.from) || 0) + 1);
+      edgeCounts.set(e.to, (edgeCounts.get(e.to) || 0) + 1);
+    });
+    return graphData.nodes.map((n: any) => ({
+      ...n,
+      edgeCount: edgeCounts.get(n.id) || 0,
+    }));
+  },
+});
+
+const makeNode = (overrides = {}) => ({
+  id: 'feat_001',
+  type: 'feature',
+  name: 'Test Node',
+  completeness: 1.0,
+  open_questions_count: 0,
+  edgeCount: 0,
+  ...overrides,
+});
+
+describe('Node Sizing by Edge Count', () => {
+  describe('nodeRadius', () => {
+    const renderer = createRenderer();
+
+    it('returns base radius for nodes with zero edges', () => {
+      const node = makeNode({ edgeCount: 0 });
+      assert.equal(renderer.nodeRadius(node), 8);
+    });
+
+    it('scales radius proportionally to edge count', () => {
+      const node1 = makeNode({ edgeCount: 1 });
+      const node2 = makeNode({ edgeCount: 4 });
+      const r1 = renderer.nodeRadius(node1);
+      const r2 = renderer.nodeRadius(node2);
+
+      assert.ok(r2 > r1, 'more edges should produce larger radius');
+      assert.equal(r1, 8 + 1.5);  // 9.5
+      assert.equal(r2, 8 + 6);    // 14
+    });
+
+    it('caps maximum radius to prevent extreme outliers', () => {
+      const node20 = makeNode({ edgeCount: 20 });
+      const node100 = makeNode({ edgeCount: 100 });
+
+      assert.equal(renderer.nodeRadius(node20), 28);
+      assert.equal(renderer.nodeRadius(node100), 28);
+    });
+
+    it('achieves at least 2x radius ratio between least and most connected', () => {
+      const minNode = makeNode({ edgeCount: 0 });
+      const maxNode = makeNode({ edgeCount: 20 });
+
+      const minR = renderer.nodeRadius(minNode);
+      const maxR = renderer.nodeRadius(maxNode);
+      const ratio = maxR / minR;
+
+      assert.ok(ratio >= 2, `ratio ${ratio.toFixed(2)} should be >= 2`);
+    });
+
+    it('produces monotonically increasing radii up to the cap', () => {
+      const radii = [0, 1, 2, 3, 5, 8, 13].map(
+        ec => renderer.nodeRadius(makeNode({ edgeCount: ec }))
+      );
+
+      for (let i = 1; i < radii.length; i++) {
+        assert.ok(radii[i] >= radii[i - 1],
+          `radius at edgeCount=${[0, 1, 2, 3, 5, 8, 13][i]} should be >= previous`);
+      }
+    });
+  });
+
+  describe('buildNodes edge count calculation', () => {
+    const renderer = createRenderer();
+
+    it('counts both inbound and outbound edges per node', () => {
+      const graphData = {
+        nodes: [
+          { id: 'a', type: 'feature', name: 'A', completeness: 1, open_questions_count: 0 },
+          { id: 'b', type: 'component', name: 'B', completeness: 1, open_questions_count: 0 },
+          { id: 'c', type: 'decision', name: 'C', completeness: 1, open_questions_count: 0 },
+        ],
+        edges: [
+          { from: 'a', to: 'b', relation: 'contains' },
+          { from: 'a', to: 'c', relation: 'governed_by' },
+          { from: 'b', to: 'c', relation: 'depends_on' },
+        ],
+      };
+
+      const nodes = renderer.buildNodes(graphData);
+      const byId = Object.fromEntries(nodes.map(n => [n.id, n]));
+
+      assert.equal(byId['a'].edgeCount, 2); // 2 outbound
+      assert.equal(byId['b'].edgeCount, 2); // 1 inbound + 1 outbound
+      assert.equal(byId['c'].edgeCount, 2); // 2 inbound
+    });
+
+    it('assigns zero edge count to isolated nodes', () => {
+      const graphData = {
+        nodes: [
+          { id: 'x', type: 'feature', name: 'X', completeness: 1, open_questions_count: 0 },
+        ],
+        edges: [],
+      };
+
+      const nodes = renderer.buildNodes(graphData);
+      assert.equal(nodes[0].edgeCount, 0);
+    });
+
+    it('counts hub nodes with many connections correctly', () => {
+      const graphData = {
+        nodes: [
+          { id: 'hub', type: 'feature', name: 'Hub', completeness: 1, open_questions_count: 0 },
+          { id: 'a', type: 'component', name: 'A', completeness: 1, open_questions_count: 0 },
+          { id: 'b', type: 'component', name: 'B', completeness: 1, open_questions_count: 0 },
+          { id: 'c', type: 'component', name: 'C', completeness: 1, open_questions_count: 0 },
+          { id: 'd', type: 'component', name: 'D', completeness: 1, open_questions_count: 0 },
+          { id: 'e', type: 'component', name: 'E', completeness: 1, open_questions_count: 0 },
+        ],
+        edges: [
+          { from: 'hub', to: 'a', relation: 'contains' },
+          { from: 'hub', to: 'b', relation: 'contains' },
+          { from: 'hub', to: 'c', relation: 'contains' },
+          { from: 'hub', to: 'd', relation: 'contains' },
+          { from: 'hub', to: 'e', relation: 'contains' },
+        ],
+      };
+
+      const nodes = renderer.buildNodes(graphData);
+      const hub = nodes.find(n => n.id === 'hub');
+      const leaf = nodes.find(n => n.id === 'a');
+
+      assert.equal(hub.edgeCount, 5);
+      assert.equal(leaf.edgeCount, 1);
+      assert.ok(
+        renderer.nodeRadius(hub) > renderer.nodeRadius(leaf),
+        'hub should be visually larger than leaf'
+      );
+    });
+  });
+
+  describe('collision force uses node radius', () => {
+    it('nodeRadius returns consistent values for force simulation', () => {
+      const renderer = createRenderer();
+
+      // Verify the radius function is deterministic
+      const node = makeNode({ edgeCount: 5 });
+      const r1 = renderer.nodeRadius(node);
+      const r2 = renderer.nodeRadius(node);
+      assert.equal(r1, r2);
+      assert.equal(r1, 8 + Math.min(5 * 1.5, 20)); // 15.5
+    });
+  });
+});