From c6897dfa9851b715d06d0084e734c58a8a71b06c Mon Sep 17 00:00:00 2001 From: hanskrywalsky Date: Fri, 14 Feb 2020 16:07:06 +0100 Subject: [PATCH 1/9] feat(back-button): add 'backButtonDefaultHref' property to IonicConfig closes #19305 --- core/src/components/back-button/back-button.tsx | 2 +- core/src/utils/config.ts | 5 +++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/core/src/components/back-button/back-button.tsx b/core/src/components/back-button/back-button.tsx index 7e4fc8a4d8b..f8d569ef1cc 100644 --- a/core/src/components/back-button/back-button.tsx +++ b/core/src/components/back-button/back-button.tsx @@ -96,7 +96,7 @@ export class BackButton implements ComponentInterface, ButtonInterface { if (nav && await nav.canGoBack()) { return nav.pop({ skipIfBusy: true }); } - return openURL(this.defaultHref, ev, 'back'); + return openURL(this.defaultHref || config.get('backButtonDefaultHref'), ev, 'back'); } render() { diff --git a/core/src/utils/config.ts b/core/src/utils/config.ts index 4fcb15e6e4b..f89d5a66611 100644 --- a/core/src/utils/config.ts +++ b/core/src/utils/config.ts @@ -40,6 +40,11 @@ export interface IonicConfig { */ backButtonText?: string; + /** + * Overrides the default defaultHref in all `` components. + */ + backButtonDefaultHref?: string; + /** * Overrides the default icon in all `` components. */ From 3ac3da9ebec17fa670233e8dcfd9bad9cbc0f00b Mon Sep 17 00:00:00 2001 From: HansKrywaa Date: Sat, 15 Feb 2020 16:05:41 +0100 Subject: [PATCH 2/9] fixed and tests added --- .../components/back-button/back-button.tsx | 10 +++++--- .../back-button/test/back-button.spec.ts | 24 +++++++++++++++++++ 2 files changed, 31 insertions(+), 3 deletions(-) diff --git a/core/src/components/back-button/back-button.tsx b/core/src/components/back-button/back-button.tsx index f8d569ef1cc..59054c662a5 100644 --- a/core/src/components/back-button/back-button.tsx +++ b/core/src/components/back-button/back-button.tsx @@ -75,6 +75,10 @@ export class BackButton implements ComponentInterface, ButtonInterface { return this.text != null ? this.text : config.get('backButtonText', defaultBackButtonText); } + get backButtonDefaultHref() { + return this.defaultHref || config.get('backButtonDefaultHref'); + } + get hasIconOnly() { return this.backButtonIcon && !this.backButtonText; } @@ -96,12 +100,12 @@ export class BackButton implements ComponentInterface, ButtonInterface { if (nav && await nav.canGoBack()) { return nav.pop({ skipIfBusy: true }); } - return openURL(this.defaultHref || config.get('backButtonDefaultHref'), ev, 'back'); + return openURL(this.backButtonDefaultHref, ev, 'back'); } render() { - const { color, defaultHref, disabled, type, mode, hasIconOnly, backButtonIcon, backButtonText } = this; - const showBackButton = defaultHref !== undefined; + const { color, disabled, type, mode, hasIconOnly, backButtonIcon, backButtonText, backButtonDefaultHref } = this; + const showBackButton = backButtonDefaultHref !== undefined; return ( { }); + describe('backButtonDefaultHref', () => { + + it('set custom defaultHref on the instance, override config', () => { + bb.defaultHref = 'custom-default-href'; + config.reset({ + backButtonDefaultHref: 'custom-default-href-config' + }); + expect(bb.backButtonDefaultHref).toBe('custom-default-href'); + }); + + it('set custom defaultHref in the config', () => { + config.reset({ + backButtonDefaultHref: 'custom-default-href-config' + }); + expect(bb.backButtonDefaultHref).toBe('custom-default-href-config'); + }); + + it('set custom defaultHref on the instance', () => { + bb.defaultHref = 'custom-default-href'; + expect(bb.backButtonDefaultHref).toBe('custom-default-href'); + }); + + }); + }); From bc58fda6a8bdb96d2d5754da4c3d267bc2d06c00 Mon Sep 17 00:00:00 2001 From: HansKrywaa Date: Wed, 1 Apr 2020 08:50:40 +0200 Subject: [PATCH 3/9] mode error fixed --- core/src/components/back-button/back-button.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/core/src/components/back-button/back-button.tsx b/core/src/components/back-button/back-button.tsx index a6d6c1f0e26..f32e89675cb 100644 --- a/core/src/components/back-button/back-button.tsx +++ b/core/src/components/back-button/back-button.tsx @@ -103,8 +103,9 @@ export class BackButton implements ComponentInterface, ButtonInterface { } render() { - const { color, disabled, type, mode, hasIconOnly, backButtonIcon, backButtonText, backButtonDefaultHref } = this; + const { color, disabled, type, hasIconOnly, backButtonIcon, backButtonText, backButtonDefaultHref } = this; const showBackButton = backButtonDefaultHref !== undefined; + const mode = getIonMode(this); return ( Date: Wed, 1 Apr 2020 09:06:11 +0200 Subject: [PATCH 4/9] Tests adjust --- core/src/components/back-button/test/back-button.spec.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/core/src/components/back-button/test/back-button.spec.ts b/core/src/components/back-button/test/back-button.spec.ts index 31814fa1c6f..facee637712 100644 --- a/core/src/components/back-button/test/back-button.spec.ts +++ b/core/src/components/back-button/test/back-button.spec.ts @@ -72,7 +72,8 @@ describe('back button', () => { describe('backButtonDefaultHref', () => { - it('set custom defaultHref on the instance, override config', () => { + it('set custom defaultHref on the instance, override config', async () => { + const bb = await newBackButton(); bb.defaultHref = 'custom-default-href'; config.reset({ backButtonDefaultHref: 'custom-default-href-config' @@ -80,14 +81,16 @@ describe('back button', () => { expect(bb.backButtonDefaultHref).toBe('custom-default-href'); }); - it('set custom defaultHref in the config', () => { + it('set custom defaultHref in the config', async () => { + const bb = await newBackButton(); config.reset({ backButtonDefaultHref: 'custom-default-href-config' }); expect(bb.backButtonDefaultHref).toBe('custom-default-href-config'); }); - it('set custom defaultHref on the instance', () => { + it('set custom defaultHref on the instance', async () => { + const bb = await newBackButton(); bb.defaultHref = 'custom-default-href'; expect(bb.backButtonDefaultHref).toBe('custom-default-href'); }); From 9ea9f2c74963862bee518d9579517f0fbbb5f492 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Fri, 24 Apr 2020 12:58:10 -0400 Subject: [PATCH 5/9] fix(back-button): set defaultHref so visibility will work properly --- core/api.txt | 2 +- .../src/components/back-button/back-button.tsx | 18 ++++++++++-------- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/core/api.txt b/core/api.txt index 260b420bf95..078df04c6c0 100644 --- a/core/api.txt +++ b/core/api.txt @@ -81,7 +81,7 @@ ion-avatar,css-prop,--border-radius ion-back-button,shadow ion-back-button,prop,color,string | undefined,undefined,false,false -ion-back-button,prop,defaultHref,string | undefined,undefined,false,false +ion-back-button,prop,defaultHref,string | undefined,undefined,false,true ion-back-button,prop,disabled,boolean,false,false,true ion-back-button,prop,icon,null | string | undefined,undefined,false,false ion-back-button,prop,mode,"ios" | "md",undefined,false,false diff --git a/core/src/components/back-button/back-button.tsx b/core/src/components/back-button/back-button.tsx index f32e89675cb..e93e082f028 100644 --- a/core/src/components/back-button/back-button.tsx +++ b/core/src/components/back-button/back-button.tsx @@ -31,7 +31,7 @@ export class BackButton implements ComponentInterface, ButtonInterface { /** * The url to navigate back to by default when there is no history. */ - @Prop() defaultHref?: string; + @Prop({ mutable: true }) defaultHref?: string; /** * If `true`, the user cannot interact with the button. @@ -53,6 +53,12 @@ export class BackButton implements ComponentInterface, ButtonInterface { */ @Prop() type: 'submit' | 'reset' | 'button' = 'button'; + componentWillLoad() { + if (this.defaultHref === undefined) { + this.defaultHref = config.get('backButtonDefaultHref'); + } + } + get backButtonIcon() { const icon = this.icon; if (icon != null) { @@ -74,10 +80,6 @@ export class BackButton implements ComponentInterface, ButtonInterface { return this.text != null ? this.text : config.get('backButtonText', defaultBackButtonText); } - get backButtonDefaultHref() { - return this.defaultHref || config.get('backButtonDefaultHref'); - } - get hasIconOnly() { return this.backButtonIcon && !this.backButtonText; } @@ -99,12 +101,12 @@ export class BackButton implements ComponentInterface, ButtonInterface { if (nav && await nav.canGoBack()) { return nav.pop({ skipIfBusy: true }); } - return openURL(this.backButtonDefaultHref, ev, 'back'); + return openURL(this.defaultHref, ev, 'back'); } render() { - const { color, disabled, type, hasIconOnly, backButtonIcon, backButtonText, backButtonDefaultHref } = this; - const showBackButton = backButtonDefaultHref !== undefined; + const { color, defaultHref, disabled, type, hasIconOnly, backButtonIcon, backButtonText } = this; + const showBackButton = defaultHref !== undefined; const mode = getIonMode(this); return ( From c6dee23cf08b6baeb5bd8546ada4ba379d9ea690 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Fri, 24 Apr 2020 12:58:32 -0400 Subject: [PATCH 6/9] fix(back-button): check the config for backButtonDefaultHref in Angular --- angular/src/directives/navigation/ion-back-button.ts | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/angular/src/directives/navigation/ion-back-button.ts b/angular/src/directives/navigation/ion-back-button.ts index 2b3ec313c0c..d4ba31407cf 100644 --- a/angular/src/directives/navigation/ion-back-button.ts +++ b/angular/src/directives/navigation/ion-back-button.ts @@ -1,5 +1,6 @@ import { Directive, HostListener, Optional } from '@angular/core'; +import { Config } from '../../providers/config'; import { NavController } from '../../providers/nav-controller'; import { IonRouterOutlet } from './ion-router-outlet'; @@ -14,7 +15,8 @@ export class IonBackButtonDelegate { constructor( @Optional() private routerOutlet: IonRouterOutlet, - private navCtrl: NavController + private navCtrl: NavController, + private config: Config ) {} /** @@ -22,11 +24,13 @@ export class IonBackButtonDelegate { */ @HostListener('click', ['$event']) onClick(ev: Event) { + const defaultHref = this.defaultHref || this.config.get('backButtonDefaultHref'); + if (this.routerOutlet && this.routerOutlet.canGoBack()) { this.routerOutlet.pop(); ev.preventDefault(); - } else if (this.defaultHref != null) { - this.navCtrl.navigateBack(this.defaultHref); + } else if (defaultHref != null) { + this.navCtrl.navigateBack(defaultHref); ev.preventDefault(); } } From 76aa9033e58f89d6f110af3b0fd31e9f5ac21bf1 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Fri, 24 Apr 2020 15:04:02 -0400 Subject: [PATCH 7/9] chore(build): remove api change --- core/api.txt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/api.txt b/core/api.txt index 078df04c6c0..260b420bf95 100644 --- a/core/api.txt +++ b/core/api.txt @@ -81,7 +81,7 @@ ion-avatar,css-prop,--border-radius ion-back-button,shadow ion-back-button,prop,color,string | undefined,undefined,false,false -ion-back-button,prop,defaultHref,string | undefined,undefined,false,true +ion-back-button,prop,defaultHref,string | undefined,undefined,false,false ion-back-button,prop,disabled,boolean,false,false,true ion-back-button,prop,icon,null | string | undefined,undefined,false,false ion-back-button,prop,mode,"ios" | "md",undefined,false,false From fb3c191489fe9d15ccfcf679ea55ef6502b62583 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Fri, 24 Apr 2020 15:05:14 -0400 Subject: [PATCH 8/9] fix(react-router): account for backButtonDefaultHref in navigate --- packages/react-router/src/ReactRouter/Router.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-router/src/ReactRouter/Router.tsx b/packages/react-router/src/ReactRouter/Router.tsx index ff33813f667..57f522d1b66 100644 --- a/packages/react-router/src/ReactRouter/Router.tsx +++ b/packages/react-router/src/ReactRouter/Router.tsx @@ -448,6 +448,9 @@ export class RouteManager extends React.Component Date: Fri, 24 Apr 2020 15:53:55 -0400 Subject: [PATCH 9/9] test(back-button): fix test so the config is before button creation --- .../back-button/test/back-button.spec.ts | 28 +++++++++++-------- 1 file changed, 17 insertions(+), 11 deletions(-) diff --git a/core/src/components/back-button/test/back-button.spec.ts b/core/src/components/back-button/test/back-button.spec.ts index facee637712..ff7d68a3ad8 100644 --- a/core/src/components/back-button/test/back-button.spec.ts +++ b/core/src/components/back-button/test/back-button.spec.ts @@ -72,27 +72,33 @@ describe('back button', () => { describe('backButtonDefaultHref', () => { - it('set custom defaultHref on the instance, override config', async () => { - const bb = await newBackButton(); - bb.defaultHref = 'custom-default-href'; + it('set custom defaultHref in the config', async () => { config.reset({ backButtonDefaultHref: 'custom-default-href-config' }); - expect(bb.backButtonDefaultHref).toBe('custom-default-href'); + const bb = await newBackButton(); + expect(bb.defaultHref).toBe('custom-default-href-config'); }); - it('set custom defaultHref in the config', async () => { + it('set custom defaultHref on the instance', async () => { const bb = await newBackButton(); - config.reset({ - backButtonDefaultHref: 'custom-default-href-config' - }); - expect(bb.backButtonDefaultHref).toBe('custom-default-href-config'); + bb.defaultHref = 'custom-default-href'; + expect(bb.defaultHref).toBe('custom-default-href'); }); - it('set custom defaultHref on the instance', async () => { + it('set custom defaultHref on the instance, override config', async () => { const bb = await newBackButton(); bb.defaultHref = 'custom-default-href'; - expect(bb.backButtonDefaultHref).toBe('custom-default-href'); + + config.reset({ + backButtonDefaultHref: 'custom-default-href-config' + }); + + expect(bb.defaultHref).toBe('custom-default-href'); + + const bb2 = await newBackButton(); + bb2.defaultHref = 'custom-default-href-second'; + expect(bb2.defaultHref).toBe('custom-default-href-second'); }); });