From b18e24dd1936b69757082bf05ef587b89d34c84b Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 6 Nov 2023 13:00:52 -0500 Subject: [PATCH 1/4] refactor(angular): provider imports correct instance from core --- .../common/src/providers/action-sheet-controller.ts | 8 ++------ packages/angular/common/src/utils/overlay.ts | 2 +- packages/angular/src/index.ts | 2 +- .../angular/src/providers/action-sheet-controller.ts | 12 ++++++++++++ packages/angular/standalone/src/index.ts | 2 +- .../src/providers/action-sheet-controller.ts | 12 ++++++++++++ 6 files changed, 29 insertions(+), 9 deletions(-) create mode 100644 packages/angular/src/providers/action-sheet-controller.ts create mode 100644 packages/angular/standalone/src/providers/action-sheet-controller.ts diff --git a/packages/angular/common/src/providers/action-sheet-controller.ts b/packages/angular/common/src/providers/action-sheet-controller.ts index 7b42cede950..f03a1b861ec 100644 --- a/packages/angular/common/src/providers/action-sheet-controller.ts +++ b/packages/angular/common/src/providers/action-sheet-controller.ts @@ -1,14 +1,10 @@ -import { Injectable } from '@angular/core'; import type { ActionSheetOptions } from '@ionic/core/components'; -import { actionSheetController } from '@ionic/core/components'; +import type { ControllerShape } from '../utils/overlay'; import { OverlayBaseController } from '../utils/overlay'; -@Injectable({ - providedIn: 'root', -}) export class ActionSheetController extends OverlayBaseController { - constructor() { + constructor(protected actionSheetController: ControllerShape) { super(actionSheetController); } } diff --git a/packages/angular/common/src/utils/overlay.ts b/packages/angular/common/src/utils/overlay.ts index 1141eeb0da6..7f9d0aa0fa3 100644 --- a/packages/angular/common/src/utils/overlay.ts +++ b/packages/angular/common/src/utils/overlay.ts @@ -1,6 +1,6 @@ // TODO(FW-2827): types -interface ControllerShape { +export interface ControllerShape { create(options: Opts): Promise; dismiss(data?: any, role?: string, id?: string): Promise; getTop(): Promise; diff --git a/packages/angular/src/index.ts b/packages/angular/src/index.ts index 6db8e3d7d2b..06b7e767b7c 100644 --- a/packages/angular/src/index.ts +++ b/packages/angular/src/index.ts @@ -20,7 +20,6 @@ export * from './directives/validators'; // PROVIDERS export { - ActionSheetController, AlertController, LoadingController, ModalController, @@ -42,6 +41,7 @@ export { ViewDidLeave, } from '@ionic/angular/common'; export { MenuController } from './providers/menu-controller'; +export { ActionSheetController } from './providers/action-sheet-controller'; // PACKAGE MODULE export { IonicModule } from './ionic-module'; diff --git a/packages/angular/src/providers/action-sheet-controller.ts b/packages/angular/src/providers/action-sheet-controller.ts new file mode 100644 index 00000000000..013df905845 --- /dev/null +++ b/packages/angular/src/providers/action-sheet-controller.ts @@ -0,0 +1,12 @@ +import { Injectable } from '@angular/core'; +import { ActionSheetController as ActionSheetControllerBase } from '@ionic/angular/common'; +import { actionSheetController } from '@ionic/core'; + +@Injectable({ + providedIn: 'root', +}) +export class ActionSheetController extends ActionSheetControllerBase { + constructor() { + super(actionSheetController); + } +} diff --git a/packages/angular/standalone/src/index.ts b/packages/angular/standalone/src/index.ts index 36d8c2bf274..94e24efffec 100644 --- a/packages/angular/standalone/src/index.ts +++ b/packages/angular/standalone/src/index.ts @@ -6,8 +6,8 @@ export { IonRouterLink, IonRouterLinkWithHref } from './navigation/router-link-d export { IonTabs } from './navigation/tabs'; export { provideIonicAngular } from './providers/ionic-angular'; export { MenuController } from './providers/menu-controller'; +export { ActionSheetController } from './providers/action-sheet-controller'; export { - ActionSheetController, AlertController, LoadingController, ModalController, diff --git a/packages/angular/standalone/src/providers/action-sheet-controller.ts b/packages/angular/standalone/src/providers/action-sheet-controller.ts new file mode 100644 index 00000000000..30338d2e6a7 --- /dev/null +++ b/packages/angular/standalone/src/providers/action-sheet-controller.ts @@ -0,0 +1,12 @@ +import { Injectable } from '@angular/core'; +import { ActionSheetController as ActionSheetControllerBase } from '@ionic/angular/common'; +import { actionSheetController } from '@ionic/core/components'; + +@Injectable({ + providedIn: 'root', +}) +export class ActionSheetController extends ActionSheetControllerBase { + constructor() { + super(actionSheetController); + } +} From 78b4716ad8a9ccd96c0250d01e83cb39bb5467cd Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 6 Nov 2023 13:20:30 -0500 Subject: [PATCH 2/4] add tests --- .../test/base/e2e/src/lazy/providers.spec.ts | 6 ++++++ .../action-sheet-controller.spec.ts | 11 ++++++++++ .../lazy/providers/providers.component.html | 1 + .../app/lazy/providers/providers.component.ts | 8 +++++++ .../action-sheet-controller.component.html | 4 ++++ .../action-sheet-controller.component.ts | 21 +++++++++++++++++++ .../standalone/app-standalone/app.routes.ts | 1 + 7 files changed, 52 insertions(+) create mode 100644 packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts create mode 100644 packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html create mode 100644 packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts diff --git a/packages/angular/test/base/e2e/src/lazy/providers.spec.ts b/packages/angular/test/base/e2e/src/lazy/providers.spec.ts index 0920ed35cda..82eddd6405b 100644 --- a/packages/angular/test/base/e2e/src/lazy/providers.spec.ts +++ b/packages/angular/test/base/e2e/src/lazy/providers.spec.ts @@ -33,5 +33,11 @@ describe('Providers', () => { cy.get('#set-menu-count').click(); cy.get('#registered-menu-count').should('have.text', '1'); }); + + it('should open an action sheet', () => { + cy.get('button#open-action-sheet').click(); + + cy.get('ion-action-sheet').should('be.visible'); + }); }); diff --git a/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts b/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts new file mode 100644 index 00000000000..05cb1c8016c --- /dev/null +++ b/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts @@ -0,0 +1,11 @@ +describe('Action Sheet Controller', () => { + beforeEach(() => { + cy.visit('/standalone/action-sheet-controller'); + }) + + it('should open an action sheet', () => { + cy.get('button#open-action-sheet').click(); + + cy.get('ion-action-sheet').should('be.visible'); + }); +}) diff --git a/packages/angular/test/base/src/app/lazy/providers/providers.component.html b/packages/angular/test/base/src/app/lazy/providers/providers.component.html index 981847ac241..e4a1e92d53e 100644 --- a/packages/angular/test/base/src/app/lazy/providers/providers.component.html +++ b/packages/angular/test/base/src/app/lazy/providers/providers.component.html @@ -45,4 +45,5 @@

+ diff --git a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts index c65a85600fa..da56d6d954e 100644 --- a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts +++ b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts @@ -88,4 +88,12 @@ export class ProvidersComponent { const menus = await this.menuCtrl.getMenus(); this.registeredMenuCount = menus.length; } + + async openActionSheet() { + const actionSheet = await this.actionSheetCtrl.create({ + buttons: ['Button'] + }); + + await actionSheet.present(); + } } diff --git a/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html new file mode 100644 index 00000000000..22bda81810a --- /dev/null +++ b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html @@ -0,0 +1,4 @@ +
    + +
+ diff --git a/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts new file mode 100644 index 00000000000..a0b169adb75 --- /dev/null +++ b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts @@ -0,0 +1,21 @@ +import { Component } from '@angular/core'; +import { ActionSheetController } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-action-sheet-controller', + templateUrl: './action-sheet-controller.component.html', + standalone: true +}) +export class ActionSheetControllerComponent { + registeredMenuCount = 0; + + constructor(private actionSheetCtrl: ActionSheetController) {} + + async openActionSheet() { + const actionSheet = await this.actionSheetCtrl.create({ + buttons: ['Button'] + }); + + await actionSheet.present(); + } +} diff --git a/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts b/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts index 3e2499ca112..68213d8375e 100644 --- a/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts +++ b/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts @@ -7,6 +7,7 @@ export const routes: Routes = [ component: AppComponent, children: [ { path: 'menu-controller', loadComponent: () => import('../menu-controller/menu-controller.component').then(c => c.MenuControllerComponent) }, + { path: 'action-sheet-controller', loadComponent: () => import('../action-sheet-controller/action-sheet-controller.component').then(c => c.ActionSheetControllerComponent) }, { path: 'popover', loadComponent: () => import('../popover/popover.component').then(c => c.PopoverComponent) }, { path: 'modal', loadComponent: () => import('../modal/modal.component').then(c => c.ModalComponent) }, { path: 'router-outlet', loadComponent: () => import('../router-outlet/router-outlet.component').then(c => c.RouterOutletComponent) }, From 8d556e85adf64238c9b94c237d6b156add992776 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 6 Nov 2023 13:22:31 -0500 Subject: [PATCH 3/4] add private --- .../test/base/src/app/lazy/providers/providers.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts index da56d6d954e..7e881bd1bdb 100644 --- a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts +++ b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts @@ -24,7 +24,7 @@ export class ProvidersComponent { registeredMenuCount = 0; constructor( - actionSheetCtrl: ActionSheetController, + private actionSheetCtrl: ActionSheetController, alertCtrl: AlertController, loadingCtrl: LoadingController, private menuCtrl: MenuController, From b230059bd6597eea949446848c08d8a7bf9a6216 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Tue, 7 Nov 2023 13:56:17 -0500 Subject: [PATCH 4/4] chore: simplify controller --- packages/angular/common/src/index.ts | 2 +- .../common/src/providers/action-sheet-controller.ts | 10 ---------- packages/angular/common/src/utils/overlay.ts | 2 +- .../angular/src/providers/action-sheet-controller.ts | 5 +++-- .../src/providers/action-sheet-controller.ts | 5 +++-- 5 files changed, 8 insertions(+), 16 deletions(-) delete mode 100644 packages/angular/common/src/providers/action-sheet-controller.ts diff --git a/packages/angular/common/src/index.ts b/packages/angular/common/src/index.ts index bd432ea3bac..a2e611b0b4e 100644 --- a/packages/angular/common/src/index.ts +++ b/packages/angular/common/src/index.ts @@ -1,4 +1,3 @@ -export { ActionSheetController } from './providers/action-sheet-controller'; export { AlertController } from './providers/alert-controller'; export { LoadingController } from './providers/loading-controller'; export { MenuController } from './providers/menu-controller'; @@ -39,5 +38,6 @@ export * from './directives/control-value-accessors'; export { ProxyCmp } from './utils/proxy'; export { IonicRouteStrategy } from './utils/routing'; +export { OverlayBaseController } from './utils/overlay'; export { raf } from './utils/util'; diff --git a/packages/angular/common/src/providers/action-sheet-controller.ts b/packages/angular/common/src/providers/action-sheet-controller.ts deleted file mode 100644 index f03a1b861ec..00000000000 --- a/packages/angular/common/src/providers/action-sheet-controller.ts +++ /dev/null @@ -1,10 +0,0 @@ -import type { ActionSheetOptions } from '@ionic/core/components'; - -import type { ControllerShape } from '../utils/overlay'; -import { OverlayBaseController } from '../utils/overlay'; - -export class ActionSheetController extends OverlayBaseController { - constructor(protected actionSheetController: ControllerShape) { - super(actionSheetController); - } -} diff --git a/packages/angular/common/src/utils/overlay.ts b/packages/angular/common/src/utils/overlay.ts index 7f9d0aa0fa3..1141eeb0da6 100644 --- a/packages/angular/common/src/utils/overlay.ts +++ b/packages/angular/common/src/utils/overlay.ts @@ -1,6 +1,6 @@ // TODO(FW-2827): types -export interface ControllerShape { +interface ControllerShape { create(options: Opts): Promise; dismiss(data?: any, role?: string, id?: string): Promise; getTop(): Promise; diff --git a/packages/angular/src/providers/action-sheet-controller.ts b/packages/angular/src/providers/action-sheet-controller.ts index 013df905845..739de4b9db9 100644 --- a/packages/angular/src/providers/action-sheet-controller.ts +++ b/packages/angular/src/providers/action-sheet-controller.ts @@ -1,11 +1,12 @@ import { Injectable } from '@angular/core'; -import { ActionSheetController as ActionSheetControllerBase } from '@ionic/angular/common'; +import { OverlayBaseController } from '@ionic/angular/common'; +import type { ActionSheetOptions } from '@ionic/core'; import { actionSheetController } from '@ionic/core'; @Injectable({ providedIn: 'root', }) -export class ActionSheetController extends ActionSheetControllerBase { +export class ActionSheetController extends OverlayBaseController { constructor() { super(actionSheetController); } diff --git a/packages/angular/standalone/src/providers/action-sheet-controller.ts b/packages/angular/standalone/src/providers/action-sheet-controller.ts index 30338d2e6a7..826d47e5aa5 100644 --- a/packages/angular/standalone/src/providers/action-sheet-controller.ts +++ b/packages/angular/standalone/src/providers/action-sheet-controller.ts @@ -1,11 +1,12 @@ import { Injectable } from '@angular/core'; -import { ActionSheetController as ActionSheetControllerBase } from '@ionic/angular/common'; +import { OverlayBaseController } from '@ionic/angular/common'; +import type { ActionSheetOptions } from '@ionic/core/components'; import { actionSheetController } from '@ionic/core/components'; @Injectable({ providedIn: 'root', }) -export class ActionSheetController extends ActionSheetControllerBase { +export class ActionSheetController extends OverlayBaseController { constructor() { super(actionSheetController); }