@openwebf/webf 0.24.0 → 0.24.2

package/test/agents-init.test.ts

@@ -0,0 +1,80 @@
+import fs from 'fs';
+import os from 'os';
+import path from 'path';
+import { agentsInitCommand } from '../src/agents';
+
+function readText(filePath: string) {
+  return fs.readFileSync(filePath, 'utf-8');
+}
+
+describe('webf agents init', () => {
+  let tempDir: string;
+  let consoleSpy: jest.SpyInstance;
+
+  beforeEach(() => {
+    tempDir = fs.mkdtempSync(path.join(os.tmpdir(), 'webf-agents-init-'));
+    consoleSpy = jest.spyOn(console, 'log').mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    consoleSpy.mockRestore();
+    fs.rmSync(tempDir, { recursive: true, force: true });
+  });
+
+  it('initializes a new project with skills and CLAUDE.md', async () => {
+    await agentsInitCommand(tempDir);
+
+    expect(fs.existsSync(path.join(tempDir, 'CLAUDE.md'))).toBe(true);
+    expect(fs.existsSync(path.join(tempDir, '.claude', 'skills', 'webf-quickstart', 'SKILL.md'))).toBe(true);
+
+    const claude = readText(path.join(tempDir, 'CLAUDE.md'));
+    expect(claude).toContain('<!-- webf-agents:init start -->');
+    expect(claude).toContain('Source: `@openwebf/claude-code-skills@');
+    expect(claude).toContain('### Skills');
+
+    const version = readText(path.join(tempDir, '.claude', 'webf-claude-code-skills.version'));
+    expect(version).toMatch(/^@openwebf\/claude-code-skills@/);
+  });
+
+  it('updates an existing CLAUDE.md without removing existing content', async () => {
+    fs.writeFileSync(path.join(tempDir, 'CLAUDE.md'), '# Existing\n\nHello\n', 'utf-8');
+
+    await agentsInitCommand(tempDir);
+
+    const claude = readText(path.join(tempDir, 'CLAUDE.md'));
+    expect(claude).toContain('# Existing');
+    expect(claude).toContain('Hello');
+    expect(claude).toContain('<!-- webf-agents:init start -->');
+  });
+
+  it('is idempotent (does not duplicate the injected block)', async () => {
+    await agentsInitCommand(tempDir);
+    await agentsInitCommand(tempDir);
+
+    const claude = readText(path.join(tempDir, 'CLAUDE.md'));
+    const occurrences = claude.split('<!-- webf-agents:init start -->').length - 1;
+    expect(occurrences).toBe(1);
+  });
+
+  it('backs up modified skill files before overwriting', async () => {
+    const skillDir = path.join(tempDir, '.claude', 'skills', 'webf-quickstart');
+    fs.mkdirSync(skillDir, { recursive: true });
+    fs.writeFileSync(path.join(skillDir, 'SKILL.md'), 'local edits', 'utf-8');
+
+    await agentsInitCommand(tempDir);
+
+    const files = fs.readdirSync(skillDir);
+    expect(files.some(f => f.startsWith('SKILL.md.bak.'))).toBe(true);
+
+    const sourceSkill = fs.readFileSync(
+      path.join(
+        path.dirname(require.resolve('@openwebf/claude-code-skills/package.json')),
+        'webf-quickstart',
+        'SKILL.md'
+      ),
+      'utf-8'
+    );
+    const installedSkill = readText(path.join(skillDir, 'SKILL.md'));
+    expect(installedSkill).toBe(sourceSkill);
+  });
+});

package/test/analyzer.test.ts

@@ -366,5 +366,49 @@ describe('Analyzer', () => {
       expect(classObj.props[1].type.value).toBe(FunctionArgumentType.promise);
       expect(classObj.props[2].type.value).toBe(FunctionArgumentType.int);
     });
+
+    it('should preserve complex CustomEvent generic types', () => {
+      const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+
+      const blob = new IDLBlob('/test/source.d.ts', '/test/target', 'test', 'test');
+      blob.raw = `
+        interface VideoError {
+          code: int;
+          message: string;
+        }
+
+        interface Events {
+          error: CustomEvent<VideoError>;
+          loadedmetadata: CustomEvent<{ duration: double; videoWidth: int; videoHeight: int }>;
+          volumechange: CustomEvent<{ volume: double; muted: boolean }>;
+        }
+      `;
+
+      const propertyCollector = {
+        properties: new Set<string>(),
+        files: new Set<string>(),
+        interfaces: new Set<string>(),
+      };
+      const unionTypeCollector = {
+        types: new Set<ParameterType[]>(),
+      };
+
+      analyzer(blob, propertyCollector, unionTypeCollector);
+
+      const eventsObj = blob.objects.find(o => (o as ClassObject).name === 'Events') as ClassObject;
+      expect(eventsObj).toBeDefined();
+
+      const errorProp = eventsObj.props.find(p => p.name === 'error');
+      expect(errorProp?.type.value).toBe('CustomEvent<VideoError>');
+
+      const loadedProp = eventsObj.props.find(p => p.name === 'loadedmetadata');
+      expect(loadedProp?.type.value).toBe('CustomEvent<{ duration: number; videoWidth: number; videoHeight: number }>');
+
+      const volumeProp = eventsObj.props.find(p => p.name === 'volumechange');
+      expect(volumeProp?.type.value).toBe('CustomEvent<{ volume: number; muted: boolean }>');
+
+      expect(warnSpy).not.toHaveBeenCalled();
+      warnSpy.mockRestore();
+    });
   });
-});
+});

package/test/commands.test.ts

@@ -24,7 +24,7 @@ mockFs.readFileSync = jest.fn().mockImplementation((filePath: any) => {
   if (pathStr.includes('gitignore.tpl')) return 'gitignore template';
   if (pathStr.includes('react.package.json.tpl')) return '<%= packageName %> <%= version %> <%= description %>';
   if (pathStr.includes('react.tsconfig.json.tpl')) return 'react tsconfig';
-  if (pathStr.includes('react.tsup.config.ts.tpl')) return 'tsup config';
+  if (pathStr.includes('react.tsdown.config.ts.tpl')) return 'tsdown config';
   if (pathStr.includes('react.index.ts.tpl')) return 'index template';
   if (pathStr.includes('vue.package.json.tpl')) return '<%= packageName %> <%= version %> <%= description %>';
   if (pathStr.includes('vue.tsconfig.json.tpl')) return 'vue tsconfig';
@@ -823,7 +823,7 @@ describe('Commands', () => {
               name: 'test-package',
               version: '1.0.0',
               dependencies: { react: '^18.0.0' },
-              scripts: { build: 'tsup' }
+              scripts: { build: 'tsdown' }
             });
           }
           return '';
@@ -1300,7 +1300,7 @@ describe('Commands', () => {
               name: 'test-package',
               version: '1.0.0',
               scripts: {
-                build: 'tsup'
+                build: 'tsdown'
               },
               dependencies: { react: '^18.0.0' }
             });
@@ -1349,7 +1349,7 @@ describe('Commands', () => {
               name: 'test-package',
               version: '1.0.0',
               scripts: {
-                build: 'tsup'
+                build: 'tsdown'
               },
               dependencies: { react: '^18.0.0' }
             });

package/test/generator.test.ts

@@ -395,6 +395,43 @@ describe('Generator', () => {
       const indexWrite = mockFs.writeFileSync.mock.calls.find(call => call[0].toString().includes('index.ts'));
       expect(indexWrite).toBeUndefined();
     });
+
+    it('should merge type-only Element exports into existing index.ts', async () => {
+      mockAnalyzer.analyzer.mockImplementation((blob: any) => {
+        const props = new ClassObject();
+        props.name = blob.filename === 'test' ? 'TestProperties' : 'ComponentProperties';
+        const events = new ClassObject();
+        events.name = blob.filename === 'test' ? 'TestEvents' : 'ComponentEvents';
+        blob.objects = [props, events];
+      });
+
+      mockFs.existsSync.mockImplementation((p: any) => {
+        const s = p.toString();
+        if (s.includes(path.join('/test/target', 'src', 'index.ts'))) return true;
+        return true;
+      });
+      mockFs.readFileSync.mockImplementation((p: any) => {
+        const s = p.toString();
+        if (s.includes(path.join('/test/target', 'src', 'index.ts'))) {
+          return '/* empty index scaffold */\n';
+        }
+        return 'test content';
+      });
+
+      await reactGen({
+        source: '/test/source',
+        target: '/test/target',
+        command: 'test command'
+      });
+
+      const indexWrite = mockFs.writeFileSync.mock.calls.find(call => call[0].toString().includes('index.ts'));
+      expect(indexWrite).toBeDefined();
+      const content = String(indexWrite![1]);
+      expect(content).toContain('export { Test }');
+      expect(content).toContain('export type { TestElement }');
+      expect(content).toContain('export { Component }');
+      expect(content).toContain('export type { ComponentElement }');
+    });
   });
 
   describe('vueGen', () => {

package/test/react.test.ts

@@ -184,6 +184,11 @@ describe('React Generator', () => {
       // Should include custom props with generated TS types
       expect(result).toContain('title: __webfTypes.dom_string;');
       expect(result).toContain('disabled?: __webfTypes.boolean;');
+
+      // Element interface should surface properties for refs
+      expect(result).toContain('export interface TestComponentElement extends WebFElementWithMethods<{');
+      expect(result).toContain('title: __webfTypes.dom_string;');
+      expect(result).toContain('disabled?: __webfTypes.boolean;');
       
       // And still include standard HTML props
       expect(result).toContain('id?: string;');