markupr 2.1.8 → 2.5.0

package/tests/e2e/criticalPaths.test.ts

@@ -1,594 +0,0 @@
-/**
- * End-to-End Critical Path Tests
- *
- * Tests the most critical user journeys through markupr:
- * - Recording session lifecycle
- * - Output generation flow
- * - Clipboard summary flow
- *
- * These tests use mocked services but simulate real user interactions.
- */
-
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { EventEmitter } from 'events';
-
-// =============================================================================
-// Mocks
-// =============================================================================
-
-vi.mock('electron', () => ({
-  app: {
-    getPath: vi.fn(() => '/tmp'),
-    getName: vi.fn(() => 'markupr'),
-    getVersion: vi.fn(() => '0.4.0'),
-  },
-  clipboard: {
-    writeText: vi.fn(),
-  },
-  Notification: {
-    isSupported: vi.fn(() => false),
-  },
-  BrowserWindow: {
-    getAllWindows: vi.fn(() => []),
-  },
-  shell: {
-    openPath: vi.fn(() => Promise.resolve('')),
-  },
-}));
-
-vi.mock('electron-store', () => ({
-  default: vi.fn().mockImplementation(() => ({
-    get: vi.fn((key: string, defaultValue?: unknown) => defaultValue),
-    set: vi.fn(),
-    delete: vi.fn(),
-    clear: vi.fn(),
-  })),
-}));
-
-// =============================================================================
-// E2E Test Application Simulation
-// =============================================================================
-
-interface SimulatedSession {
-  id: string;
-  startTime: number;
-  endTime?: number;
-  feedbackItems: Array<{
-    id: string;
-    timestamp: number;
-    text: string;
-    screenshot?: {
-      id: string;
-      width: number;
-      height: number;
-      imagePath: string;
-    };
-    category?: string;
-  }>;
-  metadata: {
-    sourceName: string;
-    sourceType: 'screen' | 'window';
-    os: string;
-  };
-}
-
-/**
- * Simulates the complete markupr application for E2E testing
- */
-class markuprSimulator {
-  private state: 'idle' | 'recording' | 'processing' | 'complete' = 'idle';
-  private currentSession: SimulatedSession | null = null;
-  private events = new EventEmitter();
-  private outputFiles: Map<string, string> = new Map();
-  private clipboardContent: string = '';
-
-  // ---------------------------------------------------------------------------
-  // User Actions
-  // ---------------------------------------------------------------------------
-
-  /**
-   * Simulate user starting a recording session
-   */
-  async userStartsRecording(sourceName: string = 'Test Window'): Promise<void> {
-    if (this.state !== 'idle') {
-      throw new Error('Already recording');
-    }
-
-    this.currentSession = {
-      id: `session-${Date.now()}`,
-      startTime: Date.now(),
-      feedbackItems: [],
-      metadata: {
-        sourceName,
-        sourceType: 'window',
-        os: process.platform,
-      },
-    };
-
-    this.state = 'recording';
-    this.events.emit('recording:started', this.currentSession);
-  }
-
-  /**
-   * Simulate user speaking feedback
-   */
-  userSpeaksFeedback(text: string, category?: string): void {
-    if (this.state !== 'recording' || !this.currentSession) {
-      throw new Error('Not recording');
-    }
-
-    const item = {
-      id: `fb-${this.currentSession.feedbackItems.length + 1}`,
-      timestamp: Date.now(),
-      text,
-      screenshot: {
-        id: `ss-${this.currentSession.feedbackItems.length + 1}`,
-        width: 1920,
-        height: 1080,
-        imagePath: `/tmp/screenshot-${this.currentSession.feedbackItems.length + 1}.png`,
-      },
-      category: category || this.inferCategory(text),
-    };
-
-    this.currentSession.feedbackItems.push(item);
-    this.events.emit('feedback:captured', item);
-  }
-
-  /**
-   * Simulate user stopping the recording
-   */
-  async userStopsRecording(): Promise<SimulatedSession> {
-    if (this.state !== 'recording' || !this.currentSession) {
-      throw new Error('Not recording');
-    }
-
-    this.state = 'processing';
-    this.events.emit('recording:processing');
-
-    // Simulate processing delay
-    await new Promise((r) => setTimeout(r, 10));
-
-    this.currentSession.endTime = Date.now();
-    this.state = 'complete';
-    this.events.emit('recording:complete', this.currentSession);
-
-    return { ...this.currentSession };
-  }
-
-  /**
-   * Simulate user saving the session
-   */
-  async userSavesSession(format: 'markdown' | 'pdf' | 'html' | 'json' = 'markdown'): Promise<string> {
-    if (!this.currentSession) {
-      throw new Error('No session to save');
-    }
-
-    const filename = this.generateFilename(format);
-    const content = this.generateOutput(format);
-
-    this.outputFiles.set(filename, content);
-    this.events.emit('session:saved', { filename, format });
-
-    return filename;
-  }
-
-  /**
-   * Simulate user copying summary to clipboard
-   */
-  async userCopiesSummary(): Promise<string> {
-    if (!this.currentSession) {
-      throw new Error('No session');
-    }
-
-    const summary = this.generateClipboardSummary();
-    this.clipboardContent = summary;
-    this.events.emit('clipboard:copied', summary);
-
-    return summary;
-  }
-
-  /**
-   * Simulate user discarding the session
-   */
-  userDiscardsSession(): void {
-    this.currentSession = null;
-    this.state = 'idle';
-    this.events.emit('session:discarded');
-  }
-
-  // ---------------------------------------------------------------------------
-  // State Access
-  // ---------------------------------------------------------------------------
-
-  getState() {
-    return this.state;
-  }
-
-  getCurrentSession() {
-    return this.currentSession;
-  }
-
-  getOutputFiles() {
-    return new Map(this.outputFiles);
-  }
-
-  getClipboardContent() {
-    return this.clipboardContent;
-  }
-
-  // ---------------------------------------------------------------------------
-  // Event Subscriptions
-  // ---------------------------------------------------------------------------
-
-  on(event: string, callback: (...args: unknown[]) => void): () => void {
-    this.events.on(event, callback);
-    return () => this.events.off(event, callback);
-  }
-
-  // ---------------------------------------------------------------------------
-  // Internal Helpers
-  // ---------------------------------------------------------------------------
-
-  private inferCategory(text: string): string {
-    const lowerText = text.toLowerCase();
-
-    if (lowerText.includes('bug') || lowerText.includes('broken') || lowerText.includes('crash')) {
-      return 'Bug';
-    }
-    if (lowerText.includes('confusing') || lowerText.includes('hard to')) {
-      return 'UX Issue';
-    }
-    if (lowerText.includes('should') || lowerText.includes('would be nice')) {
-      return 'Suggestion';
-    }
-    if (lowerText.includes('?')) {
-      return 'Question';
-    }
-    return 'General';
-  }
-
-  private generateFilename(format: string): string {
-    const name = (this.currentSession?.metadata.sourceName || 'feedback')
-      .toLowerCase()
-      .replace(/[^a-z0-9]/g, '-');
-
-    const date = new Date(this.currentSession?.startTime || Date.now());
-    const dateStr = date.toISOString().split('T')[0].replace(/-/g, '');
-
-    const extensions: Record<string, string> = {
-      markdown: 'md',
-      pdf: 'pdf',
-      html: 'html',
-      json: 'json',
-    };
-
-    return `${name}-feedback-${dateStr}.${extensions[format]}`;
-  }
-
-  private generateOutput(format: string): string {
-    if (!this.currentSession) return '';
-
-    switch (format) {
-      case 'json':
-        return JSON.stringify({
-          session: this.currentSession,
-          exportedAt: new Date().toISOString(),
-        }, null, 2);
-
-      case 'html':
-        return `<!DOCTYPE html>
-<html>
-<head><title>${this.currentSession.metadata.sourceName} Feedback</title></head>
-<body>
-<h1>${this.currentSession.metadata.sourceName} Feedback Report</h1>
-<p>Items: ${this.currentSession.feedbackItems.length}</p>
-${this.currentSession.feedbackItems.map((item, i) => `
-<h2>FB-${String(i + 1).padStart(3, '0')}: ${item.text.slice(0, 50)}</h2>
-<p>${item.text}</p>
-`).join('')}
-</body>
-</html>`;
-
-      case 'markdown':
-      default:
-        let md = `# ${this.currentSession.metadata.sourceName} Feedback Report\n\n`;
-        md += `> Items: ${this.currentSession.feedbackItems.length}\n\n`;
-
-        this.currentSession.feedbackItems.forEach((item, i) => {
-          const id = `FB-${String(i + 1).padStart(3, '0')}`;
-          md += `### ${id}: ${item.text.slice(0, 50)}\n`;
-          md += `**Type:** ${item.category}\n\n`;
-          md += `> ${item.text}\n\n`;
-          if (item.screenshot) {
-            md += `![${id}](./screenshots/${id.toLowerCase()}.png)\n\n`;
-          }
-          md += `---\n\n`;
-        });
-
-        return md;
-    }
-  }
-
-  private generateClipboardSummary(): string {
-    if (!this.currentSession) return '';
-
-    const items = this.currentSession.feedbackItems;
-    let summary = `# Feedback: ${this.currentSession.metadata.sourceName} - ${items.length} items\n\n`;
-
-    summary += `## Priority Items\n`;
-    items.slice(0, 3).forEach((item, i) => {
-      const id = `FB-${String(i + 1).padStart(3, '0')}`;
-      summary += `- **${id}:** ${item.text.slice(0, 60)}...\n`;
-    });
-
-    if (items.length > 3) {
-      summary += `\n## Other\n`;
-      summary += `- ${items.length - 3} more items (see full report)\n`;
-    }
-
-    return summary;
-  }
-
-  reset(): void {
-    this.state = 'idle';
-    this.currentSession = null;
-    this.outputFiles.clear();
-    this.clipboardContent = '';
-    this.events.removeAllListeners();
-  }
-}
-
-// =============================================================================
-// E2E Tests
-// =============================================================================
-
-describe('E2E: Critical User Paths', () => {
-  let app: markuprSimulator;
-
-  beforeEach(() => {
-    app = new markuprSimulator();
-  });
-
-  afterEach(() => {
-    app.reset();
-  });
-
-  describe('Recording Session Lifecycle', () => {
-    it('should complete a full recording session', async () => {
-      // User starts recording
-      await app.userStartsRecording('My Test App');
-      expect(app.getState()).toBe('recording');
-
-      // User provides feedback
-      app.userSpeaksFeedback('The save button is broken and crashes the app.');
-      app.userSpeaksFeedback('The navigation menu is confusing.');
-      app.userSpeaksFeedback('It would be nice to have dark mode.');
-
-      // User stops recording
-      const session = await app.userStopsRecording();
-
-      expect(app.getState()).toBe('complete');
-      expect(session.feedbackItems).toHaveLength(3);
-      expect(session.endTime).toBeDefined();
-    });
-
-    it('should track feedback items with correct categories', async () => {
-      await app.userStartsRecording('Test App');
-
-      app.userSpeaksFeedback('This is broken!'); // Bug
-      app.userSpeaksFeedback('This is confusing and hard to use.'); // UX Issue
-      app.userSpeaksFeedback('You should add a feature.'); // Suggestion
-      app.userSpeaksFeedback('How do I do this?'); // Question
-
-      const session = await app.userStopsRecording();
-
-      expect(session.feedbackItems[0].category).toBe('Bug');
-      expect(session.feedbackItems[1].category).toBe('UX Issue');
-      expect(session.feedbackItems[2].category).toBe('Suggestion');
-      expect(session.feedbackItems[3].category).toBe('Question');
-    });
-
-    it('should emit events throughout the session lifecycle', async () => {
-      const events: string[] = [];
-
-      app.on('recording:started', () => events.push('started'));
-      app.on('feedback:captured', () => events.push('feedback'));
-      app.on('recording:processing', () => events.push('processing'));
-      app.on('recording:complete', () => events.push('complete'));
-
-      await app.userStartsRecording();
-      app.userSpeaksFeedback('Test feedback');
-      await app.userStopsRecording();
-
-      expect(events).toEqual(['started', 'feedback', 'processing', 'complete']);
-    });
-
-    it('should allow discarding a session', async () => {
-      await app.userStartsRecording();
-      app.userSpeaksFeedback('Feedback to discard');
-
-      app.userDiscardsSession();
-
-      expect(app.getState()).toBe('idle');
-      expect(app.getCurrentSession()).toBeNull();
-    });
-  });
-
-  describe('Output Generation Flow', () => {
-    beforeEach(async () => {
-      await app.userStartsRecording('Test App');
-      app.userSpeaksFeedback('Bug: The save button crashes.');
-      app.userSpeaksFeedback('UX: Navigation is confusing.');
-      await app.userStopsRecording();
-    });
-
-    it('should save session as Markdown', async () => {
-      const filename = await app.userSavesSession('markdown');
-
-      expect(filename).toMatch(/\.md$/);
-
-      const files = app.getOutputFiles();
-      expect(files.has(filename)).toBe(true);
-
-      const content = files.get(filename)!;
-      expect(content).toContain('# Test App Feedback Report');
-      expect(content).toContain('FB-001');
-      expect(content).toContain('FB-002');
-    });
-
-    it('should save session as JSON', async () => {
-      const filename = await app.userSavesSession('json');
-
-      expect(filename).toMatch(/\.json$/);
-
-      const files = app.getOutputFiles();
-      const content = files.get(filename)!;
-      const parsed = JSON.parse(content);
-
-      expect(parsed.session.feedbackItems).toHaveLength(2);
-      expect(parsed.exportedAt).toBeDefined();
-    });
-
-    it('should save session as HTML', async () => {
-      const filename = await app.userSavesSession('html');
-
-      expect(filename).toMatch(/\.html$/);
-
-      const files = app.getOutputFiles();
-      const content = files.get(filename)!;
-
-      expect(content).toContain('<!DOCTYPE html>');
-      expect(content).toContain('Test App Feedback Report');
-    });
-
-    it('should emit save event', async () => {
-      const saveEvents: Array<{ filename: string; format: string }> = [];
-      app.on('session:saved', (data) => saveEvents.push(data as { filename: string; format: string }));
-
-      await app.userSavesSession('markdown');
-
-      expect(saveEvents).toHaveLength(1);
-      expect(saveEvents[0].format).toBe('markdown');
-    });
-  });
-
-  describe('Clipboard Summary Flow', () => {
-    beforeEach(async () => {
-      await app.userStartsRecording('My App');
-      app.userSpeaksFeedback('First priority feedback item about a critical bug.');
-      app.userSpeaksFeedback('Second priority feedback about UX issues.');
-      app.userSpeaksFeedback('Third priority suggestion for improvement.');
-      app.userSpeaksFeedback('Fourth item that should be in "other" section.');
-      await app.userStopsRecording();
-    });
-
-    it('should copy summary to clipboard', async () => {
-      const summary = await app.userCopiesSummary();
-
-      expect(summary).toContain('# Feedback: My App - 4 items');
-      expect(summary).toContain('## Priority Items');
-      expect(summary).toContain('FB-001');
-      expect(summary).toContain('FB-002');
-      expect(summary).toContain('FB-003');
-    });
-
-    it('should show remaining items in Other section', async () => {
-      const summary = await app.userCopiesSummary();
-
-      expect(summary).toContain('## Other');
-      expect(summary).toContain('1 more items');
-    });
-
-    it('should store summary in clipboard content', async () => {
-      await app.userCopiesSummary();
-
-      const clipboardContent = app.getClipboardContent();
-      expect(clipboardContent).toContain('# Feedback: My App');
-    });
-
-    it('should emit clipboard event', async () => {
-      let copiedContent = '';
-      app.on('clipboard:copied', (content) => { copiedContent = content as string; });
-
-      await app.userCopiesSummary();
-
-      expect(copiedContent).toContain('# Feedback:');
-    });
-  });
-
-  describe('Error Handling', () => {
-    it('should prevent starting recording when already recording', async () => {
-      await app.userStartsRecording();
-
-      await expect(app.userStartsRecording()).rejects.toThrow('Already recording');
-    });
-
-    it('should prevent speaking feedback when not recording', async () => {
-      expect(() => app.userSpeaksFeedback('Test')).toThrow('Not recording');
-    });
-
-    it('should prevent stopping when not recording', async () => {
-      await expect(app.userStopsRecording()).rejects.toThrow('Not recording');
-    });
-
-    it('should prevent saving when no session exists', async () => {
-      await expect(app.userSavesSession()).rejects.toThrow('No session to save');
-    });
-
-    it('should prevent copying summary when no session exists', async () => {
-      await expect(app.userCopiesSummary()).rejects.toThrow('No session');
-    });
-  });
-
-  describe('Real-World Scenario: Bug Report Session', () => {
-    it('should handle a realistic bug reporting session', async () => {
-      // User discovers a bug and starts markupr
-      await app.userStartsRecording('Acme Dashboard');
-
-      // User describes the bug
-      app.userSpeaksFeedback(
-        'I found a critical bug. When I click the export button with more than 100 items selected, ' +
-        'the entire application freezes and I have to force quit.'
-      );
-
-      // User provides steps to reproduce
-      app.userSpeaksFeedback(
-        'To reproduce: First, go to the data table view. Then select all items using the checkbox. ' +
-        'Finally, click the export button in the toolbar.'
-      );
-
-      // User mentions the expected behavior
-      app.userSpeaksFeedback(
-        'I would expect the export to start processing in the background without freezing the UI.'
-      );
-
-      // User notes the severity
-      app.userSpeaksFeedback(
-        'This is blocking my work because I need to export reports daily. Very urgent fix needed.'
-      );
-
-      // User stops recording
-      const session = await app.userStopsRecording();
-
-      // Verify session integrity
-      expect(session.feedbackItems).toHaveLength(4);
-      expect(session.feedbackItems[0].category).toBe('Bug');
-      expect(session.metadata.sourceName).toBe('Acme Dashboard');
-
-      // User saves the report
-      const filename = await app.userSavesSession('markdown');
-      const files = app.getOutputFiles();
-      const report = files.get(filename)!;
-
-      // Verify report contains all feedback
-      expect(report).toContain('critical bug');
-      expect(report).toContain('To reproduce');
-      expect(report).toContain('export'); // The word "expected" gets truncated in title, check full content
-      expect(report).toContain('blocking');
-
-      // User copies summary for quick sharing
-      const summary = await app.userCopiesSummary();
-      expect(summary).toContain('4 items');
-    });
-  });
-});