fmode-app/src/app/components/preview/image-lightbox/image-lightbox.spec.ts

import { TestBed } from '@angular/core/testing';
import { ImageLightboxComponent } from './image-lightbox';

/** 图片灯箱：打开/关闭、Esc、文件名与大小展示 */
describe('ImageLightboxComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({ imports: [ImageLightboxComponent] }).compileComponents();
  });

  function make(open = true) {
    const fixture = TestBed.createComponent(ImageLightboxComponent);
    fixture.componentRef.setInput('open', open);
    fixture.componentRef.setInput('url', 'https://x/a.png');
    fixture.componentRef.setInput('name', 'A_clean.png');
    fixture.componentRef.setInput('size', 2048);
    fixture.detectChanges();
    return fixture;
  }

  it('open=false 不渲染', () => {
    const f = make(false);
    expect((f.nativeElement as HTMLElement).querySelector('.lb-mask')).toBeNull();
  });

  it('展示文件名与大小', () => {
    const f = make();
    const text = (f.nativeElement as HTMLElement).textContent ?? '';
    expect(text).toContain('A_clean.png');
    expect(text).toContain('2.0 KB');
  });

  it('关闭按钮发出 closed', () => {
    const f = make();
    const c = f.componentInstance;
    const spy = jasmine.createSpy('closed');
    c.closed.subscribe(spy);
    (f.nativeElement as HTMLElement).querySelector<HTMLButtonElement>('[aria-label="关闭预览"]')!.click();
    expect(spy).toHaveBeenCalled();
  });
});