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('[aria-label="关闭预览"]')!.click(); expect(spy).toHaveBeenCalled(); }); });