diff --git a/libs/ui/components/src/lib/content-hero/content-hero.component.spec.ts b/libs/ui/components/src/lib/content-hero/content-hero.component.spec.ts new file mode 100644 index 000000000..eee853896 --- /dev/null +++ b/libs/ui/components/src/lib/content-hero/content-hero.component.spec.ts @@ -0,0 +1,41 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { TranslateModule } from '@ngx-translate/core'; +import { ContentHeroComponent } from './content-hero.component'; + +describe('ContentHeroComponent', () => { + let fixture: ComponentFixture; + const originalResizeObserver = globalThis.ResizeObserver; + + afterEach(() => { + Object.defineProperty(globalThis, 'ResizeObserver', { + configurable: true, + writable: true, + value: originalResizeObserver, + }); + }); + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [ContentHeroComponent, TranslateModule.forRoot()], + }).compileComponents(); + + fixture = TestBed.createComponent(ContentHeroComponent); + }); + + it('renders description content when ResizeObserver is unavailable', () => { + Object.defineProperty(globalThis, 'ResizeObserver', { + configurable: true, + writable: true, + value: undefined, + }); + + fixture.componentRef.setInput('title', 'Fallback_Title'); + fixture.componentRef.setInput('description', 'Plain description'); + + expect(() => fixture.detectChanges()).not.toThrow(); + + const host = fixture.nativeElement as HTMLElement; + expect(host.textContent).toContain('Fallback Title'); + expect(host.textContent).toContain('Plain description'); + }); +}); diff --git a/libs/ui/components/src/lib/content-hero/content-hero.component.ts b/libs/ui/components/src/lib/content-hero/content-hero.component.ts index 8703858ec..091398fc1 100644 --- a/libs/ui/components/src/lib/content-hero/content-hero.component.ts +++ b/libs/ui/components/src/lib/content-hero/content-hero.component.ts @@ -110,6 +110,10 @@ export class ContentHeroComponent { private observeOverflow(el: HTMLElement): void { this.resizeObserver?.disconnect(); + if (typeof ResizeObserver === 'undefined') { + this.measureOverflow(el); + return; + } this.resizeObserver = new ResizeObserver(() => this.measureOverflow(el)); this.resizeObserver.observe(el); }