diff --git a/projects/ion/src/lib/notification/component/notification.component.spec.ts b/projects/ion/src/lib/notification/component/notification.component.spec.ts index c9ce86aa3..c14345872 100644 --- a/projects/ion/src/lib/notification/component/notification.component.spec.ts +++ b/projects/ion/src/lib/notification/component/notification.component.spec.ts @@ -151,6 +151,7 @@ describe('Time by words', () => { ...defaultNotification, // "word" -> 1 word. 1/3 = 0.33. + 1 = 1.33s -> 1000ms. message: 'word', + title: '', fixed: false, }, on: { @@ -161,6 +162,42 @@ describe('Time by words', () => { jest.advanceTimersByTime(2500); // 1000ms delay + 1000ms animation + buffer expect(ionOnCloseSpy).toHaveBeenCalled(); }); + + it('should emit close event when only title is passed', async () => { + const ionOnCloseSpy = jest.fn(); + await render(IonNotificationComponent, { + componentInputs: { + title: 'Notification Title', + message: '', + fixed: false, + }, + on: { + ionOnClose: ionOnCloseSpy, + }, + }); + + // "Notification Title" -> 2 words. 2/3 = 0.66. + 1 = 1.66s -> 2000ms. + jest.advanceTimersByTime(3500); // 2000ms delay + 1000ms animation + buffer + expect(ionOnCloseSpy).toHaveBeenCalled(); + }); + + it('should emit close event when title and message are passed', async () => { + const ionOnCloseSpy = jest.fn(); + await render(IonNotificationComponent, { + componentInputs: { + title: 'Title', + message: 'This is a message', + fixed: false, + }, + on: { + ionOnClose: ionOnCloseSpy, + }, + }); + + // "Title This is a message" -> 5 words. 5/3 = 1.66. + 1 = 2.66s -> 3000ms. + jest.advanceTimersByTime(4500); // 3000ms delay + 1000ms animation + buffer + expect(ionOnCloseSpy).toHaveBeenCalled(); + }); }); describe('Pause on hover', () => { diff --git a/projects/ion/src/lib/notification/component/notification.component.ts b/projects/ion/src/lib/notification/component/notification.component.ts index 4ca550fbe..71588f76c 100644 --- a/projects/ion/src/lib/notification/component/notification.component.ts +++ b/projects/ion/src/lib/notification/component/notification.component.ts @@ -92,7 +92,7 @@ export class IonNotificationComponent implements OnInit, OnDestroy { if (this.fixed() || !this.pauseOnHover() || this.isClosing) { return; } - const timeToClose = this.timeByWords(this.message()); + const timeToClose = this.timeByWords(this._getMessageToCheck()); this.autoCloseTimer = setTimeout(() => { this.closeNotification(); }, timeToClose); @@ -100,13 +100,24 @@ export class IonNotificationComponent implements OnInit, OnDestroy { ngOnInit(): void { if (!this.fixed()) { - const timeToClose = this.timeByWords(this.message()); + const timeToClose = this.timeByWords(this._getMessageToCheck()); this.autoCloseTimer = setTimeout(() => { this.closeNotification(); }, timeToClose); } } + private _getMessageToCheck(): string { + if (!this.title()) { + return this.message(); + } + if (!this.message()) { + return this.title(); + } + + return `${this.title()} ${this.message()}`; + } + ngOnDestroy(): void { clearTimeout(this.autoCloseTimer); clearTimeout(this.closeAnimationTimer);