ObsiViewer/src/components/smart-file-viewer/smart-file-viewer.component.spec.ts

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { SmartFileViewerComponent } from './smart-file-viewer.component';
import { FileTypeDetectorService } from '../../services/file-type-detector.service';
import { MarkdownService } from '../../services/markdown.service';

describe('SmartFileViewerComponent', () => {
  let component: SmartFileViewerComponent;
  let fixture: ComponentFixture<SmartFileViewerComponent>;
  let fileTypeDetector: jasmine.SpyObj<FileTypeDetectorService>;

  beforeEach(async () => {
    const fileTypeDetectorSpy = jasmine.createSpyObj('FileTypeDetectorService', ['getViewerType']);
    const markdownServiceSpy = jasmine.createSpyObj('MarkdownService', ['render']);

    await TestBed.configureTestingModule({
      imports: [SmartFileViewerComponent],
      providers: [
        { provide: FileTypeDetectorService, useValue: fileTypeDetectorSpy },
        { provide: MarkdownService, useValue: markdownServiceSpy }
      ]
    }).compileComponents();

    fileTypeDetector = TestBed.inject(FileTypeDetectorService) as jasmine.SpyObj<FileTypeDetectorService>;
    fixture = TestBed.createComponent(SmartFileViewerComponent);
    component = fixture.componentInstance;
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should detect markdown viewer type', () => {
    fileTypeDetector.getViewerType.and.returnValue('markdown');
    component.filePath = 'test.md';
    component.content = '# Test';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'test.md',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    expect(component.viewerType()).toBe('markdown');
  });

  it('should detect excalidraw viewer type', () => {
    fileTypeDetector.getViewerType.and.returnValue('excalidraw');
    component.filePath = 'drawing.excalidraw.md';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'drawing.excalidraw.md',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    expect(component.viewerType()).toBe('excalidraw');
  });

  it('should detect image viewer type', () => {
    fileTypeDetector.getViewerType.and.returnValue('image');
    component.filePath = 'photo.png';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'photo.png',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    expect(component.viewerType()).toBe('image');
  });

  it('should extract file name correctly', () => {
    component.filePath = 'folder/subfolder/test.md';
    expect(component.fileName()).toBe('test.md');
  });

  it('should handle windows paths', () => {
    component.filePath = 'folder\\subfolder\\test.md';
    expect(component.fileName()).toBe('test.md');
  });

  it('should construct image src for image files', () => {
    fileTypeDetector.getViewerType.and.returnValue('image');
    component.filePath = 'images/photo.png';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'images/photo.png',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    fixture.detectChanges();
    
    expect(component.imageSrc()).toContain('images/photo.png');
  });

  it('should handle base64 image content', () => {
    fileTypeDetector.getViewerType.and.returnValue('image');
    component.content = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==';
    
    component.ngOnChanges({
      content: {
        currentValue: component.content,
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    expect(component.imageSrc()).toBe(component.content);
  });

  it('should construct PDF src for PDF files', () => {
    fileTypeDetector.getViewerType.and.returnValue('pdf');
    component.filePath = 'documents/file.pdf';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'documents/file.pdf',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    fixture.detectChanges();
    
    expect(component.pdfSrc()).toContain('documents/file.pdf');
  });

  it('should update viewer type when file path changes', () => {
    fileTypeDetector.getViewerType.and.returnValue('markdown');
    component.filePath = 'test.md';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'test.md',
        previousValue: '',
        firstChange: true,
        isFirstChange: () => true
      }
    });
    
    expect(component.viewerType()).toBe('markdown');
    
    fileTypeDetector.getViewerType.and.returnValue('image');
    component.filePath = 'test.png';
    
    component.ngOnChanges({
      filePath: {
        currentValue: 'test.png',
        previousValue: 'test.md',
        firstChange: false,
        isFirstChange: () => false
      }
    });
    
    expect(component.viewerType()).toBe('image');
  });
});