diff --git a/tests/components/ct-angular/src/components/output.component.ts b/tests/components/ct-angular/src/components/output.component.ts new file mode 100644 index 0000000000..5aaacb95a4 --- /dev/null +++ b/tests/components/ct-angular/src/components/output.component.ts @@ -0,0 +1,17 @@ +import { DOCUMENT } from "@angular/common"; +import { Component, Output, inject } from "@angular/core"; +import { Subject, finalize } from "rxjs"; + +@Component({ + standalone: true, + template: `OutputComponent`, +}) +export class OutputComponent { + @Output() answerChange = new Subject().pipe( + /* Detect when observable is unsubscribed from, + * and set a global variable `hasUnsubscribed` to true. */ + finalize(() => ((this._window as any).hasUnsubscribed = true)) + ); + + private _window = inject(DOCUMENT).defaultView; +} diff --git a/tests/components/ct-angular/tests/events.spec.ts b/tests/components/ct-angular/tests/events.spec.ts index a4f67d7202..3abc6816ee 100644 --- a/tests/components/ct-angular/tests/events.spec.ts +++ b/tests/components/ct-angular/tests/events.spec.ts @@ -1,5 +1,6 @@ import { test, expect } from '@playwright/experimental-ct-angular'; import { ButtonComponent } from '@/components/button.component'; +import { OutputComponent } from '@/components/output.component'; test('emit an submit event when the button is clicked', async ({ mount }) => { const messages: string[] = []; @@ -14,3 +15,22 @@ test('emit an submit event when the button is clicked', async ({ mount }) => { await component.click(); expect(messages).toEqual(['hello']); }); + +test('unsubscribe from events when the component is unmounted', async ({ + mount, + page, +}) => { + test.skip(true, '🚧 work in progress'); + const component = await mount(OutputComponent, { + on: { + answerChange: () => {}, + }, + }); + + await component.unmount(); + + /* Check that the output observable had been unsubscribed from + * as it sets a global variable `hasUnusbscribed` to true + * when it detects unsubscription. Cf. OutputComponent. */ + expect(await page.evaluate(() => (window as any).hasUnsubscribed)).toBe(true); +});