@useavalon/avalon 0.1.5 → 0.1.6

package/src/client/tests/vue-adapter.test.ts

@@ -1,407 +0,0 @@
-/**
- * Tests for Vue HMR Adapter
- * 
- * Verifies Vue-specific HMR functionality including:
- * - Component detection
- * - State preservation
- * - Vue HMR runtime integration
- * - Error handling
- * 
- * Requirements: 2.3
- */
-
-import { describe, it, expect } from 'vitest';
-import { VueHMRAdapter } from '../adapters/vue-adapter.ts';
-import type { StateSnapshot } from '../framework-adapter.ts';
-
-// Mock HTMLElement for testing
-class MockHTMLElement {
-  private attributes: Map<string, string> = new Map();
-  private _children: MockHTMLElement[] = [];
-  public scrollTop = 0;
-  public scrollLeft = 0;
-  public style: Record<string, string> = {};
-  
-  getAttribute(name: string): string | null {
-    return this.attributes.get(name) || null;
-  }
-  
-  setAttribute(name: string, value: string): void {
-    this.attributes.set(name, value);
-  }
-  
-  removeAttribute(name: string): void {
-    this.attributes.delete(name);
-  }
-  
-  hasAttribute(name: string): boolean {
-    return this.attributes.has(name);
-  }
-  
-  querySelector(selector: string): MockHTMLElement | null {
-    return null;
-  }
-  
-  querySelectorAll(selector: string): MockHTMLElement[] {
-    return [];
-  }
-  
-  contains(element: unknown): boolean {
-    return false;
-  }
-  
-  insertBefore(newNode: unknown, referenceNode: unknown): void {
-    // Mock implementation
-  }
-  
-  get firstChild(): unknown {
-    return null;
-  }
-  
-  dispatchEvent(event: any): boolean {
-    return true;
-  }
-}
-
-// Mock Vue components for testing
-const MockVueOptionsComponent = {
-  name: 'TestComponent',
-  props: ['count'],
-  data() {
-    return {
-      internalState: 0,
-    };
-  },
-  template: '<div>{{ count }}</div>',
-};
-
-const MockVueSetupComponent = {
-  name: 'SetupComponent',
-  setup(props: Record<string, unknown>) {
-    return () => null;
-  },
-};
-
-function MockVueSetupFunction(props: Record<string, unknown>) {
-  return () => null;
-}
-
-const MockVueSFCComponent = {
-  __vccOpts: {
-    name: 'SFCComponent',
-  },
-  render() {
-    return null;
-  },
-};
-
-const MockVueComputedComponent = {
-  name: 'ComputedComponent',
-  computed: {
-    doubled() {
-      return 2;
-    },
-  },
-};
-
-const MockVueMethodsComponent = {
-  name: 'MethodsComponent',
-  methods: {
-    handleClick() {
-      console.log('clicked');
-    },
-  },
-};
-
-describe('VueHMRAdapter - initialization', () => {
-  it('should create adapter with correct name', () => {
-    const adapter = new VueHMRAdapter();
-    
-    expect(adapter).toBeDefined();
-    expect(adapter.name).toBe('vue');
-  });
-});
-
-describe('VueHMRAdapter - canHandle', () => {
-  it('should handle options component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueOptionsComponent);
-    expect(result).toBe(true);
-  });
-
-  it('should handle setup component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueSetupComponent);
-    expect(result).toBe(true);
-  });
-
-  it('should handle setup function', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueSetupFunction);
-    expect(result).toBe(true);
-  });
-
-  it('should handle SFC component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueSFCComponent);
-    expect(result).toBe(true);
-  });
-
-  it('should handle computed component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueComputedComponent);
-    expect(result).toBe(true);
-  });
-
-  it('should handle methods component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const result = adapter.canHandle(MockVueMethodsComponent);
-    expect(result).toBe(true);
-  });
-
-  it('should handle component with lifecycle hooks', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const componentWithHooks = {
-      mounted() {
-        console.log('mounted');
-      },
-    };
-    
-    const result = adapter.canHandle(componentWithHooks);
-    expect(result).toBe(true);
-  });
-
-  it('should handle component with emits', () => {
-    const adapter = new VueHMRAdapter();
-    
-    const componentWithEmits = {
-      emits: ['update', 'change'],
-    };
-    
-    const result = adapter.canHandle(componentWithEmits);
-    expect(result).toBe(true);
-  });
-
-  it('should not handle non-Vue component', () => {
-    const adapter = new VueHMRAdapter();
-    
-    expect(adapter.canHandle(null)).toBe(false);
-    expect(adapter.canHandle(undefined)).toBe(false);
-    expect(adapter.canHandle('string')).toBe(false);
-    expect(adapter.canHandle(123)).toBe(false);
-    expect(adapter.canHandle({})).toBe(false);
-    expect(adapter.canHandle([])).toBe(false);
-  });
-});
-
-describe('VueHMRAdapter - preserveState', () => {
-  it('should return valid snapshot', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    // Set up mock island attributes
-    mockIsland.setAttribute('data-src', '/islands/TestComponent.vue');
-    mockIsland.setAttribute('data-props', JSON.stringify({ count: 5 }));
-    
-    const snapshot = adapter.preserveState(mockIsland);
-    
-    // In test environment without DOM, preserveState returns null
-    // This is expected behavior - the adapter gracefully handles missing DOM
-    if (snapshot) {
-      expect(snapshot.framework).toBe('vue');
-      expect(typeof snapshot.timestamp).toBe('number');
-      expect(snapshot.data).toBeDefined();
-    } else {
-      // Graceful degradation when DOM is not available
-      expect(snapshot).toBeNull();
-    }
-  });
-
-  it('should capture component name', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    mockIsland.setAttribute('data-src', '/islands/Counter.vue');
-    mockIsland.setAttribute('data-props', '{}');
-    
-    const snapshot = adapter.preserveState(mockIsland);
-    
-    // In test environment without DOM, preserveState returns null
-    if (snapshot) {
-      expect(snapshot.data.componentName).toBe('Counter');
-    } else {
-      // Expected in test environment
-      expect(snapshot).toBeNull();
-    }
-  });
-
-  it('should capture props', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    const props = { count: 10, name: 'test' };
-    mockIsland.setAttribute('data-src', '/islands/TestComponent.vue');
-    mockIsland.setAttribute('data-props', JSON.stringify(props));
-    
-    const snapshot = adapter.preserveState(mockIsland);
-    
-    // In test environment without DOM, preserveState returns null
-    if (snapshot) {
-      expect(snapshot.data.capturedProps).toBeDefined();
-      expect(snapshot.data.capturedProps).toEqual(props);
-    } else {
-      // Expected in test environment
-      expect(snapshot).toBeNull();
-    }
-  });
-
-  it('should handle missing props', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    mockIsland.setAttribute('data-src', '/islands/TestComponent.vue');
-    // No data-props attribute
-    
-    const snapshot = adapter.preserveState(mockIsland);
-    
-    // In test environment without DOM, preserveState returns null
-    if (snapshot) {
-      expect(snapshot.data.capturedProps).toBeDefined();
-      expect(Object.keys(snapshot.data.capturedProps || {}).length).toBe(0);
-    } else {
-      // Expected in test environment
-      expect(snapshot).toBeNull();
-    }
-  });
-
-  it('should handle invalid JSON props', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    mockIsland.setAttribute('data-src', '/islands/TestComponent.vue');
-    mockIsland.setAttribute('data-props', 'invalid json');
-    
-    const snapshot = adapter.preserveState(mockIsland);
-    
-    // Should return null on error
-    expect(snapshot).toBeNull();
-  });
-});
-
-describe('VueHMRAdapter - restoreState', () => {
-  it('should call base implementation', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    const snapshot: StateSnapshot = {
-      framework: 'vue',
-      timestamp: Date.now(),
-      data: {},
-      dom: {
-        scrollPosition: { x: 50, y: 100 },
-      },
-    };
-    
-    // Should not throw
-    adapter.restoreState(mockIsland, snapshot);
-    
-    // Verify DOM state was restored
-    expect(mockIsland.scrollLeft).toBe(50);
-    expect(mockIsland.scrollTop).toBe(100);
-  });
-});
-
-describe('VueHMRAdapter - handleError', () => {
-  it('should add Vue-specific error info', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    const error = new Error('Invalid reactive usage');
-    
-    // In test environment without DOM, handleError may fail
-    // This is expected - the adapter requires DOM APIs
-    try {
-      adapter.handleError(mockIsland, error);
-      
-      // If it succeeds, verify error attributes were set
-      expect(mockIsland.getAttribute('data-hmr-error')).toBe('true');
-      expect(mockIsland.getAttribute('data-hmr-error-message')).toBe('Invalid reactive usage');
-    } catch (e) {
-      // Expected in test environment without DOM
-      // The adapter gracefully handles missing DOM APIs
-      expect((e as Error).message.includes('document is not defined')).toBe(true);
-    }
-  });
-
-  it('should provide reactive hint', () => {
-    const adapter = new VueHMRAdapter();
-    const mockIsland = new MockHTMLElement() as unknown as HTMLElement;
-    
-    const error = new Error('ref must be accessed with .value');
-    
-    // The adapter should recognize reactive-related errors and provide helpful hints
-    // This is tested indirectly through the error message
-    try {
-      adapter.handleError(mockIsland, error);
-    } catch (e) {
-      // Expected in test environment
-    }
-    
-    // The actual hint is added to the error indicator element
-    // which requires full DOM support to test properly
-  });
-});
-
-describe('VueHMRAdapter - extractComponentName', () => {
-  it('should extract from various paths', () => {
-    const adapter = new VueHMRAdapter();
-    
-    // Access private method through type assertion for testing
-    const extractName = (adapter as any).extractComponentName.bind(adapter);
-    
-    expect(extractName('/islands/Counter.vue')).toBe('Counter');
-    expect(extractName('/islands/Button.tsx')).toBe('Button');
-    expect(extractName('/src/components/Card.jsx')).toBe('Card');
-    expect(extractName('/nested/path/Component.ts')).toBe('Component');
-    expect(extractName('SimpleComponent.vue')).toBe('SimpleComponent');
-  });
-});
-
-describe('VueHMRAdapter - generateComponentId', () => {
-  it('should create valid ID', () => {
-    const adapter = new VueHMRAdapter();
-    
-    // Access private method through type assertion for testing
-    const generateId = (adapter as any).generateComponentId.bind(adapter);
-    
-    const id1 = generateId('/islands/Counter.vue');
-    const id2 = generateId('/islands/Button.tsx');
-    const id3 = generateId('/src/components/Card.jsx');
-    
-    // IDs should be valid (no special characters)
-    expect(id1.match(/^[a-zA-Z0-9_]+$/) !== null).toBe(true);
-    expect(id2.match(/^[a-zA-Z0-9_]+$/) !== null).toBe(true);
-    expect(id3.match(/^[a-zA-Z0-9_]+$/) !== null).toBe(true);
-    
-    // Same path should generate same ID
-    expect(generateId('/islands/Counter.vue')).toBe(id1);
-  });
-});
-
-describe('VueHMRAdapter - singleton instance', () => {
-  it('should export singleton', async () => {
-    // Import the singleton
-    const { vueAdapter } = await import('../adapters/vue-adapter.ts');
-    
-    expect(vueAdapter).toBeDefined();
-    expect(vueAdapter.name).toBe('vue');
-    expect(vueAdapter instanceof VueHMRAdapter).toBe(true);
-  });
-});

package/src/components/tests/component-analyzer.test.ts

@@ -1,96 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import {
-	analyzeComponentFile,
-	analyzeComponentContent,
-	shouldHydrate,
-	getComponentFramework,
-	generateAnalysisSummary,
-} from '../../core/components/component-analyzer.ts';
-
-describe('Component Analyzer Integration', () => {
-	it('should analyze real component files', () => {
-		const svelteContent = `
-<script>
-  import { onMount } from 'svelte';
-  let count = 0;
-  function increment() { count += 1; }
-  onMount(() => { console.log('mounted'); });
-</script>
-<button on:click={increment}>{count}</button>
-`;
-		const report = analyzeComponentContent('SvelteCounter.svelte', svelteContent, { logDecisions: false });
-		expect(report.analysis.framework).toEqual('svelte');
-		expect(report.analysis.hasScript).toEqual(true);
-		expect(report.decision.shouldHydrate).toEqual(true);
-		expect(report.metadata).toBeDefined();
-	});
-
-	it('should provide quick hydration check', () => {
-		const noHydrateContent = `
-<div>
-  <h1>Static Svelte Component</h1>
-  <p>No JavaScript here</p>
-</div>
-`;
-		const report = analyzeComponentContent('TestCounterNoHydrate.svelte', noHydrateContent);
-		expect(report.decision.shouldHydrate).toEqual(false);
-	});
-
-	it('should detect component framework', () => {
-		const vueContent = `
-<template>
-  <div>{{ count }}</div>
-</template>
-<script setup>
-import { ref } from 'vue'
-const count = ref(0)
-</script>
-`;
-		const report = analyzeComponentContent('TestCounter.vue', vueContent);
-		expect(report.analysis.framework).toEqual('vue');
-	});
-
-	it('should analyze component content directly', () => {
-		const vueContent = `
-<template>
-  <div>Static content</div>
-</template>
-`;
-
-		const report = analyzeComponentContent('test.vue', vueContent);
-		expect(report.analysis.framework).toEqual('vue');
-		expect(report.analysis.hasScript).toEqual(false);
-		expect(report.decision.shouldHydrate).toEqual(false);
-	});
-
-	it('should handle analysis errors gracefully', async () => {
-		const shouldHydrateResult = await shouldHydrate('non-existent.vue');
-		expect(shouldHydrateResult).toEqual(true); // Defaults to hydrate on error
-	});
-});
-
-describe('Analysis Summary Generation', () => {
-	it('should generate summary statistics', () => {
-		const mockReports = new Map();
-
-		mockReports.set('comp1.vue', {
-			analysis: { framework: 'vue', hasScript: true, hasHydrateFunction: true, recommendedStrategy: 'hydrate' },
-			decision: { shouldHydrate: true, reason: 'test' },
-			metadata: {},
-		});
-
-		mockReports.set('comp2.svelte', {
-			analysis: { framework: 'svelte', hasScript: false, hasHydrateFunction: false, recommendedStrategy: 'ssr-only' },
-			decision: { shouldHydrate: false, reason: 'test' },
-			metadata: {},
-		});
-
-		const summary = generateAnalysisSummary(mockReports);
-
-		expect(summary.total).toEqual(2);
-		expect(summary.byFramework.vue).toEqual(1);
-		expect(summary.byFramework.svelte).toEqual(1);
-		expect(summary.byStrategy.hydrate).toEqual(1);
-		expect(summary.byStrategy['ssr-only']).toEqual(1);
-	});
-});