From b3e3cedb55f9142714d0db3daf9cb30f22202818 Mon Sep 17 00:00:00 2001 From: Dimitri Kreik Date: Fri, 2 Dec 2022 11:52:09 +0100 Subject: [PATCH 1/6] feat(toast): add global config toastDuration --- core/src/components.d.ts | 4 ++-- core/src/components/toast/toast.tsx | 5 +++-- core/src/utils/config.ts | 5 +++++ 3 files changed, 10 insertions(+), 4 deletions(-) diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 22d6ffc4eea..f04d50b071c 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -2953,7 +2953,7 @@ export namespace Components { /** * How many milliseconds to wait before hiding the toast. By default, it will show until `dismiss()` is called. */ - "duration": number; + "duration": any; /** * Animation to use when the toast is presented. */ @@ -6954,7 +6954,7 @@ declare namespace LocalJSX { /** * How many milliseconds to wait before hiding the toast. By default, it will show until `dismiss()` is called. */ - "duration"?: number; + "duration"?: any; /** * Animation to use when the toast is presented. */ diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx index efb6e29a111..0af3249c6c9 100644 --- a/core/src/components/toast/toast.tsx +++ b/core/src/components/toast/toast.tsx @@ -1,6 +1,7 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core'; -import { Component, Element, Event, Host, Method, Prop, h } from '@stencil/core'; +import { Component, Element, Event, h, Host, Method, Prop } from '@stencil/core'; +import { config } from '../../global/config'; import { getIonMode } from '../../global/ionic-global'; import type { AnimationBuilder, @@ -77,7 +78,7 @@ export class Toast implements ComponentInterface, OverlayInterface { * How many milliseconds to wait before hiding the toast. By default, it will show * until `dismiss()` is called. */ - @Prop() duration = 0; + @Prop() duration = config.get('toastDuration', 0); /** * Header to be shown in the toast. diff --git a/core/src/utils/config.ts b/core/src/utils/config.ts index ecb07cefc17..33bca08b455 100644 --- a/core/src/utils/config.ts +++ b/core/src/utils/config.ts @@ -96,6 +96,11 @@ export interface IonicConfig { */ tabButtonLayout?: TabButtonLayout; + /** + * Overrides the default duration for all `ion-toast` overlays. + */ + toastDuration?: number; + /** * Overrides the default "animation" of all `ion-nav` and `ion-router-outlet` across the whole application. * This prop allows to replace the default transition and provide a custom one that applies to all navigation outlets. From c2146d387893bf64e601bb71a1195733bae34ef7 Mon Sep 17 00:00:00 2001 From: DwieDima Date: Fri, 2 Dec 2022 19:47:47 +0100 Subject: [PATCH 2/6] Update core/src/utils/config.ts Co-authored-by: Liam DeBeasi --- core/src/utils/config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/utils/config.ts b/core/src/utils/config.ts index 33bca08b455..1336de4669e 100644 --- a/core/src/utils/config.ts +++ b/core/src/utils/config.ts @@ -97,7 +97,7 @@ export interface IonicConfig { tabButtonLayout?: TabButtonLayout; /** - * Overrides the default duration for all `ion-toast` overlays. + * Overrides the default `duration` for all `ion-toast` components. */ toastDuration?: number; From 2f2e73b866a22b0e378dc5ef8b1f77b7072e3735 Mon Sep 17 00:00:00 2001 From: DwieDima Date: Fri, 2 Dec 2022 19:47:47 +0100 Subject: [PATCH 3/6] Update core/src/utils/config.ts Co-authored-by: Liam DeBeasi --- core/api.txt | 2 +- core/src/components.d.ts | 4 +-- .../components/toast/test/basic/toast.e2e.ts | 26 ++++++++++++++++++- core/src/components/toast/toast.tsx | 2 +- 4 files changed, 29 insertions(+), 5 deletions(-) diff --git a/core/api.txt b/core/api.txt index 56db72b84a6..54c1190f310 100644 --- a/core/api.txt +++ b/core/api.txt @@ -1382,7 +1382,7 @@ ion-toast,prop,animated,boolean,true,false,false ion-toast,prop,buttons,(string | ToastButton)[] | undefined,undefined,false,false ion-toast,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-toast,prop,cssClass,string | string[] | undefined,undefined,false,false -ion-toast,prop,duration,number,0,false,false +ion-toast,prop,duration,number,config.getNumber('toastDuration', 0),false,false ion-toast,prop,enterAnimation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false ion-toast,prop,header,string | undefined,undefined,false,false ion-toast,prop,htmlAttributes,undefined | { [key: string]: any; },undefined,false,false diff --git a/core/src/components.d.ts b/core/src/components.d.ts index f04d50b071c..22d6ffc4eea 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -2953,7 +2953,7 @@ export namespace Components { /** * How many milliseconds to wait before hiding the toast. By default, it will show until `dismiss()` is called. */ - "duration": any; + "duration": number; /** * Animation to use when the toast is presented. */ @@ -6954,7 +6954,7 @@ declare namespace LocalJSX { /** * How many milliseconds to wait before hiding the toast. By default, it will show until `dismiss()` is called. */ - "duration"?: any; + "duration"?: number; /** * Animation to use when the toast is presented. */ diff --git a/core/src/components/toast/test/basic/toast.e2e.ts b/core/src/components/toast/test/basic/toast.e2e.ts index 21e23008bd6..05812052cd5 100644 --- a/core/src/components/toast/test/basic/toast.e2e.ts +++ b/core/src/components/toast/test/basic/toast.e2e.ts @@ -1,5 +1,5 @@ -import { expect } from '@playwright/test'; import type { Locator, TestInfo } from '@playwright/test'; +import { expect } from '@playwright/test'; import type { E2EPage, EventSpy } from '@utils/test/playwright'; import { test } from '@utils/test/playwright'; @@ -134,3 +134,27 @@ test.describe('toast: properties', () => { await expect(toast).toHaveClass(/my-custom-class/); }); }); + +test.describe('toast: duration config', () => { + test('should have duration set to 0', async ({ page }) => { + await page.setContent(` + + `); + const toast = page.locator('ion-toast'); + await expect(toast).toHaveAttribute('duration', '0'); + }); + + test('should have duration set to 5000', async ({ page }) => { + await page.setContent(` + + + `); + + const toast = page.locator('ion-toast'); + await expect(toast).toHaveAttribute('duration', '5000'); + }); +}); diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx index 0af3249c6c9..5422eab4223 100644 --- a/core/src/components/toast/toast.tsx +++ b/core/src/components/toast/toast.tsx @@ -78,7 +78,7 @@ export class Toast implements ComponentInterface, OverlayInterface { * How many milliseconds to wait before hiding the toast. By default, it will show * until `dismiss()` is called. */ - @Prop() duration = config.get('toastDuration', 0); + @Prop() duration = config.getNumber('toastDuration', 0); /** * Header to be shown in the toast. From 7563b54f4fc01226fd8f529501f798049f54f4b9 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 5 Dec 2022 14:50:34 -0500 Subject: [PATCH 4/6] Update core/src/components/toast/test/basic/toast.e2e.ts --- core/src/components/toast/test/basic/toast.e2e.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/core/src/components/toast/test/basic/toast.e2e.ts b/core/src/components/toast/test/basic/toast.e2e.ts index 05812052cd5..f97fdfbbb8b 100644 --- a/core/src/components/toast/test/basic/toast.e2e.ts +++ b/core/src/components/toast/test/basic/toast.e2e.ts @@ -136,6 +136,10 @@ test.describe('toast: properties', () => { }); test.describe('toast: duration config', () => { + test.beforeEach(({ skip }) => { + skip.rtl(); + skip.mode('ios'); + }); test('should have duration set to 0', async ({ page }) => { await page.setContent(` From 7cd1e664955ce26707c0552344f0e20b68ac206a Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 5 Dec 2022 15:26:08 -0500 Subject: [PATCH 5/6] Update core/src/components/toast/test/basic/toast.e2e.ts --- core/src/components/toast/test/basic/toast.e2e.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/components/toast/test/basic/toast.e2e.ts b/core/src/components/toast/test/basic/toast.e2e.ts index f97fdfbbb8b..430d62cc56b 100644 --- a/core/src/components/toast/test/basic/toast.e2e.ts +++ b/core/src/components/toast/test/basic/toast.e2e.ts @@ -159,6 +159,6 @@ test.describe('toast: duration config', () => { `); const toast = page.locator('ion-toast'); - await expect(toast).toHaveAttribute('duration', '5000'); + await expect(toast).toHaveJSProperty('duration', 5000); }); }); From bac51cb8e3299df252362d117696143d643f7126 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 5 Dec 2022 15:26:31 -0500 Subject: [PATCH 6/6] Update core/src/components/toast/test/basic/toast.e2e.ts --- core/src/components/toast/test/basic/toast.e2e.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/components/toast/test/basic/toast.e2e.ts b/core/src/components/toast/test/basic/toast.e2e.ts index 430d62cc56b..4bea4beddab 100644 --- a/core/src/components/toast/test/basic/toast.e2e.ts +++ b/core/src/components/toast/test/basic/toast.e2e.ts @@ -145,7 +145,7 @@ test.describe('toast: duration config', () => { `); const toast = page.locator('ion-toast'); - await expect(toast).toHaveAttribute('duration', '0'); + await expect(toast).toHaveJSProperty('duration', 0); }); test('should have duration set to 5000', async ({ page }) => {