diff --git a/CHANGELOG.md b/CHANGELOG.md index 82608cd199..8873fae52b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,20 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic-framework/compare/v6.2.5...v6.2.6) (2022-09-07) + + +### Bug Fixes + +* **datetime:** calendar day and years are now localized ([#25847](https://github.com/ionic-team/ionic-framework/issues/25847)) ([cbd1268](https://github.com/ionic-team/ionic-framework/commit/cbd1268a03204f05314f2ba284ad433457a9cf33)), closes [#25843](https://github.com/ionic-team/ionic-framework/issues/25843) +* **datetime:** hourCycle formats hour correctly ([#25869](https://github.com/ionic-team/ionic-framework/issues/25869)) ([1a1491d](https://github.com/ionic-team/ionic-framework/commit/1a1491df0242da1cb3c9a7f128bbd4d5ce4dbf3e)), closes [#25862](https://github.com/ionic-team/ionic-framework/issues/25862) +* **datetime:** month grid no longer loops on ios ([#25857](https://github.com/ionic-team/ionic-framework/issues/25857)) ([c938054](https://github.com/ionic-team/ionic-framework/commit/c938054605dffb6c3002a64a3d8aaf36892c7a93)), closes [#25752](https://github.com/ionic-team/ionic-framework/issues/25752) +* **vue:** custom animation plays when replacing ([#25863](https://github.com/ionic-team/ionic-framework/issues/25863)) ([2d3661a](https://github.com/ionic-team/ionic-framework/commit/2d3661ae3894b98ac4b8b158594b8de0f0823073)), closes [#25831](https://github.com/ionic-team/ionic-framework/issues/25831) + + + + + ## [6.2.5](https://github.com/ionic-team/ionic-framework/compare/v6.2.4...v6.2.5) (2022-08-31) diff --git a/angular/CHANGELOG.md b/angular/CHANGELOG.md index 0a63cb5b83..4d87824145 100644 --- a/angular/CHANGELOG.md +++ b/angular/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/angular + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) diff --git a/angular/package-lock.json b/angular/package-lock.json index b6eae42ad0..192bca16fb 100644 --- a/angular/package-lock.json +++ b/angular/package-lock.json @@ -1,15 +1,15 @@ { "name": "@ionic/angular", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/angular", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "jsonc-parser": "^3.0.0", "tslib": "^2.0.0" }, @@ -1023,9 +1023,9 @@ "dev": true }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dependencies": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -7951,9 +7951,9 @@ "dev": true }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "requires": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", diff --git a/angular/package.json b/angular/package.json index d1dea9928a..d692384800 100644 --- a/angular/package.json +++ b/angular/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/angular", - "version": "6.2.5", + "version": "6.2.6", "description": "Angular specific wrappers for @ionic/core", "keywords": [ "ionic", @@ -44,7 +44,7 @@ "validate": "npm i && npm run lint && npm run test && npm run build" }, "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "jsonc-parser": "^3.0.0", "tslib": "^2.0.0" }, diff --git a/angular/src/directives/navigation/ion-router-outlet.ts b/angular/src/directives/navigation/ion-router-outlet.ts index 6b4ec47ba4..60362d757b 100644 --- a/angular/src/directives/navigation/ion-router-outlet.ts +++ b/angular/src/directives/navigation/ion-router-outlet.ts @@ -308,8 +308,19 @@ export class IonRouterOutlet implements OnDestroy, OnInit { } this.activatedView = enteringView; + + /** + * The top outlet is set prior to the entering view's transition completing, + * so that when we have nested outlets (e.g. ion-tabs inside an ion-router-outlet), + * the tabs outlet will be assigned as the top outlet when a view inside tabs is + * activated. + * + * In this scenario, activeWith is called for both the tabs and the root router outlet. + * To avoid a race condition, we assign the top outlet synchronously. + */ + this.navCtrl.setTopOutlet(this); + this.stackCtrl.setActive(enteringView).then((data) => { - this.navCtrl.setTopOutlet(this); this.activateEvents.emit(cmpRef.instance); this.stackEvents.emit(data); }); diff --git a/angular/test/base/e2e/src/tabs.spec.ts b/angular/test/base/e2e/src/tabs.spec.ts index 589e8a1740..17db2d3467 100644 --- a/angular/test/base/e2e/src/tabs.spec.ts +++ b/angular/test/base/e2e/src/tabs.spec.ts @@ -115,6 +115,16 @@ describe('Tabs', () => { ]); cy.get('#tab-button-account').click(); + + /** + * Wait for the leaving view to + * be unmounted otherwise testTabTitle + * may get the leaving view before it + * is unmounted. + */ + cy.ionPageVisible('app-tabs-tab1'); + cy.ionPageDoesNotExist('app-tabs-tab1-nested'); + testTabTitle('Tab 1 - Page 1'); cy.testStack('ion-tabs ion-router-outlet', [ 'app-tabs-tab1', @@ -243,6 +253,74 @@ describe('Tabs', () => { }); }) + describe('entry url - /tabs/account', () => { + beforeEach(() => { + cy.visit('/tabs/account'); + }); + it('should pop to previous view when leaving tabs outlet', () => { + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 1'); + + cy.get('#goto-tab1-page2').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 2 (1)'); + + cy.get('#goto-global').click(); + + cy.get('ion-title').should('contain.text', 'Global Page'); + + cy.get('#goto-prev-pop').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 2 (1)'); + + cy.get('#goto-prev').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 1'); + + /** + * Verifies that when entering the tabs outlet directly, + * the navController.pop() method does not pop the previous view, + * when you are at the root of the tabs outlet. + */ + cy.get('#goto-previous-page').click(); + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 1'); + }); + }); + + describe('entry url - /', () => { + it('should pop to the root outlet from the tabs outlet', () => { + cy.visit('/'); + + cy.get('ion-title').should('contain.text', 'Test App'); + + cy.get('ion-item').contains('Tabs test').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 1'); + + cy.get('#goto-tab1-page2').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 2 (1)'); + + cy.get('#goto-global').click(); + + cy.get('ion-title').should('contain.text', 'Global Page'); + + cy.get('#goto-prev-pop').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 2 (1)'); + + cy.get('#goto-prev').click(); + + cy.get('ion-title').should('contain.text', 'Tab 1 - Page 1'); + + cy.get('#goto-previous-page').click(); + + cy.get('ion-title').should('contain.text', 'Test App'); + + }); + }); + + describe('entry url - /tabs/account/nested/1', () => { beforeEach(() => { cy.visit('/tabs/account/nested/1'); diff --git a/angular/test/base/src/app/app-routing.module.ts b/angular/test/base/src/app/app-routing.module.ts index cef9059c70..c1988c52c0 100644 --- a/angular/test/base/src/app/app-routing.module.ts +++ b/angular/test/base/src/app/app-routing.module.ts @@ -49,6 +49,10 @@ const routes: Routes = [ path: 'tabs', loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule) }, + { + path: 'tabs-global', + loadChildren: () => import('./tabs-global/tabs-global.module').then(m => m.TabsGlobalModule) + }, { path: 'nested-outlet', component: NestedOutletComponent, @@ -62,7 +66,7 @@ const routes: Routes = [ component: NestedOutletPage2Component } ] - } + }, ]; @NgModule({ diff --git a/angular/test/base/src/app/tabs-global/tabs-global-routing.module.ts b/angular/test/base/src/app/tabs-global/tabs-global-routing.module.ts new file mode 100644 index 0000000000..e7ddb717b5 --- /dev/null +++ b/angular/test/base/src/app/tabs-global/tabs-global-routing.module.ts @@ -0,0 +1,16 @@ +import { NgModule } from "@angular/core"; +import { RouterModule } from "@angular/router"; +import { TabsGlobalComponent } from "./tabs-global.component"; + +@NgModule({ + imports: [ + RouterModule.forChild([ + { + path: '', + component: TabsGlobalComponent + } + ]) + ], + exports: [RouterModule] +}) +export class TabsGlobalRoutingModule { } diff --git a/angular/test/base/src/app/tabs-global/tabs-global.component.html b/angular/test/base/src/app/tabs-global/tabs-global.component.html new file mode 100644 index 0000000000..ec31c49344 --- /dev/null +++ b/angular/test/base/src/app/tabs-global/tabs-global.component.html @@ -0,0 +1,17 @@ + + + + + + + + Global Page + + + + + + + Go To Previous + + diff --git a/angular/test/base/src/app/tabs-global/tabs-global.component.ts b/angular/test/base/src/app/tabs-global/tabs-global.component.ts new file mode 100644 index 0000000000..0c49539541 --- /dev/null +++ b/angular/test/base/src/app/tabs-global/tabs-global.component.ts @@ -0,0 +1,17 @@ +import { Component } from "@angular/core"; +import { NavController } from "@ionic/angular"; + +/** + * This component is used in conjunction with a tabs router-outlet, + * to validate the behavior of different routing APIs (e.g. NavController) + * when leaving and re-entering a router-outlet. + */ +@Component({ + selector: 'app-tabs-global', + templateUrl: 'tabs-global.component.html' +}) +export class TabsGlobalComponent { + + constructor(public navCtrl: NavController) { } + +} diff --git a/angular/test/base/src/app/tabs-global/tabs-global.module.ts b/angular/test/base/src/app/tabs-global/tabs-global.module.ts new file mode 100644 index 0000000000..06a8530c0a --- /dev/null +++ b/angular/test/base/src/app/tabs-global/tabs-global.module.ts @@ -0,0 +1,13 @@ +import { NgModule } from "@angular/core"; +import { IonicModule } from "@ionic/angular"; +import { TabsGlobalRoutingModule } from "./tabs-global-routing.module"; +import { TabsGlobalComponent } from "./tabs-global.component"; + +@NgModule({ + imports: [ + IonicModule, + TabsGlobalRoutingModule + ], + declarations: [TabsGlobalComponent] +}) +export class TabsGlobalModule { } diff --git a/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.html b/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.html index 8187f666a9..8c3980c956 100644 --- a/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.html +++ b/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.html @@ -12,6 +12,9 @@

Go to Tab 1 - Page 1 Go to Tab 2 - Page 1 + Go to Global Page + Go to Previous Page (NavController). + Go to Next

diff --git a/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.ts b/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.ts index 9130a78ea9..69ff9c11eb 100644 --- a/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.ts +++ b/angular/test/base/src/app/tabs-tab1-nested/tabs-tab1-nested.component.ts @@ -1,5 +1,6 @@ import { ActivatedRoute } from '@angular/router'; import { Component, OnInit } from '@angular/core'; +import { NavController } from '@ionic/angular'; @Component({ selector: 'app-tabs-tab1-nested', @@ -9,7 +10,8 @@ export class TabsTab1NestedComponent implements OnInit { id = ''; constructor( private route: ActivatedRoute, - ) {} + public navCtrl: NavController + ) { } ngOnInit() { this.id = this.route.snapshot.paramMap.get('id'); @@ -18,4 +20,5 @@ export class TabsTab1NestedComponent implements OnInit { next() { return parseInt(this.id, 10) + 1; } + } diff --git a/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.html b/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.html index fabccd1fca..986ca90c1b 100644 --- a/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.html +++ b/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.html @@ -19,5 +19,6 @@ id="goto-nested-page1-with-query-params">Go to Page 2 with Query Params Go to Tab 3 - Page 2 Go to nested + Go to Previous Page

diff --git a/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.ts b/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.ts index 0e1bcc5318..f0b414adbd 100644 --- a/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.ts +++ b/angular/test/base/src/app/tabs-tab1/tabs-tab1.component.ts @@ -1,4 +1,5 @@ import { Component, NgZone } from '@angular/core'; +import { NavController } from '@ionic/angular'; @Component({ selector: 'app-tabs-tab1', @@ -9,6 +10,8 @@ export class TabsTab1Component { segment = 'one'; changed = 'false'; + constructor(public navCtrl: NavController) {} + ionViewWillEnter() { NgZone.assertInAngularZone(); setTimeout(() => { diff --git a/core/CHANGELOG.md b/core/CHANGELOG.md index c3017c11a2..9a65b9520f 100644 --- a/core/CHANGELOG.md +++ b/core/CHANGELOG.md @@ -3,6 +3,19 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + + +### Bug Fixes + +* **datetime:** calendar day and years are now localized ([#25847](https://github.com/ionic-team/ionic/issues/25847)) ([cbd1268](https://github.com/ionic-team/ionic/commit/cbd1268a03204f05314f2ba284ad433457a9cf33)), closes [#25843](https://github.com/ionic-team/ionic/issues/25843) +* **datetime:** hourCycle formats hour correctly ([#25869](https://github.com/ionic-team/ionic/issues/25869)) ([1a1491d](https://github.com/ionic-team/ionic/commit/1a1491df0242da1cb3c9a7f128bbd4d5ce4dbf3e)), closes [#25862](https://github.com/ionic-team/ionic/issues/25862) +* **datetime:** month grid no longer loops on ios ([#25857](https://github.com/ionic-team/ionic/issues/25857)) ([c938054](https://github.com/ionic-team/ionic/commit/c938054605dffb6c3002a64a3d8aaf36892c7a93)), closes [#25752](https://github.com/ionic-team/ionic/issues/25752) + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) diff --git a/core/package-lock.json b/core/package-lock.json index 23f9c3b917..cc37305ae1 100644 --- a/core/package-lock.json +++ b/core/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/core", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/core", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { "@stencil/core": "^2.17.4", diff --git a/core/package.json b/core/package.json index f72b1d2718..eda5204b32 100644 --- a/core/package.json +++ b/core/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/core", - "version": "6.2.5", + "version": "6.2.6", "description": "Base components for Ionic", "keywords": [ "ionic", diff --git a/core/src/components/datetime/test/format.spec.ts b/core/src/components/datetime/test/format.spec.ts index ef9fb4ea2f..a79411c349 100644 --- a/core/src/components/datetime/test/format.spec.ts +++ b/core/src/components/datetime/test/format.spec.ts @@ -155,4 +155,17 @@ describe('getLocalizedTime', () => { expect(getLocalizedTime('en-US', datetimeParts, false)).toEqual('9:40 AM'); }); + + it('should avoid Chromium bug when using 12 hour time in a 24 hour locale', () => { + const datetimeParts = { + day: 1, + month: 1, + year: 2022, + hour: 0, + minute: 0, + tzOffset: 0, + }; + + expect(getLocalizedTime('en-GB', datetimeParts, false)).toEqual('12:00 am'); + }); }); diff --git a/core/src/components/datetime/utils/format.ts b/core/src/components/datetime/utils/format.ts index 2ea4980381..beddc2319f 100644 --- a/core/src/components/datetime/utils/format.ts +++ b/core/src/components/datetime/utils/format.ts @@ -19,7 +19,11 @@ export const getLocalizedTime = (locale: string, refParts: DatetimeParts, use24H hour: 'numeric', minute: 'numeric', timeZone: 'UTC', - hour12: !use24Hour, + /** + * We use hourCycle here instead of hour12 due to: + * https://bugs.chromium.org/p/chromium/issues/detail?id=1347316&q=hour12&can=2 + */ + hourCycle: use24Hour ? 'h23' : 'h12', }).format( new Date( convertDataToISO({ diff --git a/core/src/components/label/label.scss b/core/src/components/label/label.scss index f2041041e4..8cd1606ccc 100644 --- a/core/src/components/label/label.scss +++ b/core/src/components/label/label.scss @@ -6,7 +6,7 @@ :host-context(.item) { /** - * @prop --color: Color of the label + * @prop --color: Color of the label. This property is only available when using `ion-label` inside of an `ion-item`. */ --color: initial; diff --git a/core/src/components/refresher/test/basic/refresher.e2e.ts b/core/src/components/refresher/test/basic/refresher.e2e.ts index c67fca972a..e5000898b2 100644 --- a/core/src/components/refresher/test/basic/refresher.e2e.ts +++ b/core/src/components/refresher/test/basic/refresher.e2e.ts @@ -3,7 +3,8 @@ import { test } from '@utils/test/playwright'; import { pullToRefresh } from '../test.utils'; -test.describe('refresher: basic', () => { +// TODO: Enable this test when touch events/gestures are better supported in Playwright: https://github.com/microsoft/playwright/issues/2903 +test.skip('refresher: basic', () => { test.beforeEach(async ({ page }) => { await page.goto('/src/components/refresher/test/basic'); }); diff --git a/core/src/components/refresher/test/scroll-target/refresher.e2e.ts b/core/src/components/refresher/test/scroll-target/refresher.e2e.ts index 751de7c63f..255f96ad98 100644 --- a/core/src/components/refresher/test/scroll-target/refresher.e2e.ts +++ b/core/src/components/refresher/test/scroll-target/refresher.e2e.ts @@ -3,7 +3,8 @@ import { test } from '@utils/test/playwright'; import { pullToRefresh } from '../test.utils'; -test.describe('refresher: custom scroll target', () => { +// TODO: Enable this test when touch events/gestures are better supported in Playwright: https://github.com/microsoft/playwright/issues/2903 +test.skip('refresher: custom scroll target', () => { test.beforeEach(async ({ page }) => { await page.goto('/src/components/refresher/test/scroll-target'); }); diff --git a/core/src/components/tab-bar/tab-bar.tsx b/core/src/components/tab-bar/tab-bar.tsx index 2ca61f5eb5..0448d98ecd 100644 --- a/core/src/components/tab-bar/tab-bar.tsx +++ b/core/src/components/tab-bar/tab-bar.tsx @@ -1,10 +1,10 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core'; import { Component, Element, Event, Host, Prop, State, Watch, h } from '@stencil/core'; -import type { KeyboardController } from '@utils/keyboard/keyboard-controller'; -import { createKeyboardController } from '@utils/keyboard/keyboard-controller'; import { getIonMode } from '../../global/ionic-global'; import type { Color, TabBarChangedEventDetail } from '../../interface'; +import type { KeyboardController } from '../../utils/keyboard/keyboard-controller'; +import { createKeyboardController } from '../../utils/keyboard/keyboard-controller'; import { createColorClasses } from '../../utils/theme'; /** diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 0f9c6eaab0..38d05a29f4 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic-docs/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/docs + + + + + ## [6.2.5](https://github.com/ionic-team/ionic-docs/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/docs diff --git a/docs/package-lock.json b/docs/package-lock.json index 4d34e2424c..7974cd5cba 100644 --- a/docs/package-lock.json +++ b/docs/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/docs", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/docs", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT" } } diff --git a/docs/package.json b/docs/package.json index 7aedce5c1d..ca9b297b55 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/docs", - "version": "6.2.5", + "version": "6.2.6", "description": "Pre-packaged API documentation for the Ionic docs.", "main": "core.json", "types": "core.d.ts", diff --git a/lerna.json b/lerna.json index e0a664c565..fcdb462350 100644 --- a/lerna.json +++ b/lerna.json @@ -5,5 +5,5 @@ "angular", "packages/*" ], - "version": "6.2.5" + "version": "6.2.6" } diff --git a/packages/angular-server/CHANGELOG.md b/packages/angular-server/CHANGELOG.md index c5aca1590c..734787d431 100644 --- a/packages/angular-server/CHANGELOG.md +++ b/packages/angular-server/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/angular-server + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/angular-server diff --git a/packages/angular-server/package-lock.json b/packages/angular-server/package-lock.json index 58c0d46a5c..da9e59e297 100644 --- a/packages/angular-server/package-lock.json +++ b/packages/angular-server/package-lock.json @@ -1,12 +1,12 @@ { "name": "@ionic/angular-server", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/angular-server", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "devDependencies": { "@angular-eslint/eslint-plugin": "^12.6.1", @@ -18,7 +18,7 @@ "@angular/platform-browser": "^12.0.0", "@angular/platform-browser-dynamic": "^12.2.10", "@angular/platform-server": "^12.0.0", - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "@ionic/eslint-config": "^0.3.0", "@ionic/prettier-config": "^2.0.0", "@typescript-eslint/eslint-plugin": "^5.2.0", @@ -786,9 +786,9 @@ "license": "BSD-3-Clause" }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dev": true, "dependencies": { "@stencil/core": "^2.17.4", @@ -7116,9 +7116,9 @@ "dev": true }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dev": true, "requires": { "@stencil/core": "^2.17.4", diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json index 8bd0e3e5da..17b24624eb 100644 --- a/packages/angular-server/package.json +++ b/packages/angular-server/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/angular-server", - "version": "6.2.5", + "version": "6.2.6", "description": "Angular SSR Module for Ionic", "keywords": [ "ionic", @@ -56,7 +56,7 @@ "@angular/platform-browser": "^12.0.0", "@angular/platform-browser-dynamic": "^12.2.10", "@angular/platform-server": "^12.0.0", - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "@ionic/eslint-config": "^0.3.0", "@ionic/prettier-config": "^2.0.0", "@typescript-eslint/eslint-plugin": "^5.2.0", diff --git a/packages/react-router/CHANGELOG.md b/packages/react-router/CHANGELOG.md index 73be6c9034..373c6809d5 100644 --- a/packages/react-router/CHANGELOG.md +++ b/packages/react-router/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/react-router + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/react-router diff --git a/packages/react-router/package-lock.json b/packages/react-router/package-lock.json index 147a751e40..d6bdc96fa6 100644 --- a/packages/react-router/package-lock.json +++ b/packages/react-router/package-lock.json @@ -1,15 +1,15 @@ { "name": "@ionic/react-router", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/react-router", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { - "@ionic/react": "^6.2.5", + "@ionic/react": "^6.2.6", "tslib": "*" }, "devDependencies": { @@ -147,9 +147,9 @@ } }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dependencies": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -157,11 +157,11 @@ } }, "node_modules/@ionic/react": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.5.tgz", - "integrity": "sha512-dvne9iY97uCb7+Wen0cRAY0nxL+ecKAMVBK6CLWMLec6Eh8NVE3BU2tG/4ZjheNrclWCPAv20us8zLbJVIht0g==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.6.tgz", + "integrity": "sha512-sV1mMg5Wj62v/0+XTiH890biaAOHNmPw8xaWP3HOnjhtIJlT+Mr32RTs2e3LapH3lUYlIs2iNTW2q2gCnylW0Q==", "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2", "tslib": "*" }, @@ -1157,9 +1157,9 @@ } }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "requires": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -1167,11 +1167,11 @@ } }, "@ionic/react": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.5.tgz", - "integrity": "sha512-dvne9iY97uCb7+Wen0cRAY0nxL+ecKAMVBK6CLWMLec6Eh8NVE3BU2tG/4ZjheNrclWCPAv20us8zLbJVIht0g==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.6.tgz", + "integrity": "sha512-sV1mMg5Wj62v/0+XTiH890biaAOHNmPw8xaWP3HOnjhtIJlT+Mr32RTs2e3LapH3lUYlIs2iNTW2q2gCnylW0Q==", "requires": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2", "tslib": "*" } diff --git a/packages/react-router/package.json b/packages/react-router/package.json index e4d10f1125..6cf88b757a 100644 --- a/packages/react-router/package.json +++ b/packages/react-router/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/react-router", - "version": "6.2.5", + "version": "6.2.6", "description": "React Router wrapper for @ionic/react", "keywords": [ "ionic", @@ -37,7 +37,7 @@ "dist/" ], "dependencies": { - "@ionic/react": "^6.2.5", + "@ionic/react": "^6.2.6", "tslib": "*" }, "peerDependencies": { diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index d5eaf3d8d2..762dd20ea3 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/react + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/react diff --git a/packages/react/package-lock.json b/packages/react/package-lock.json index 1ebbd1f7fa..df385aae15 100644 --- a/packages/react/package-lock.json +++ b/packages/react/package-lock.json @@ -1,15 +1,15 @@ { "name": "@ionic/react", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/react", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2", "tslib": "*" }, @@ -607,9 +607,9 @@ } }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dependencies": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -9534,9 +9534,9 @@ } }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "requires": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", diff --git a/packages/react/package.json b/packages/react/package.json index b4fc9dabbc..bc593a4e78 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/react", - "version": "6.2.5", + "version": "6.2.6", "description": "React specific wrapper for @ionic/core", "keywords": [ "ionic", @@ -41,7 +41,7 @@ "css/" ], "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2", "tslib": "*" }, diff --git a/packages/vue-router/CHANGELOG.md b/packages/vue-router/CHANGELOG.md index 9606aa8b59..991361a73d 100644 --- a/packages/vue-router/CHANGELOG.md +++ b/packages/vue-router/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + +**Note:** Version bump only for package @ionic/vue-router + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/vue-router diff --git a/packages/vue-router/package-lock.json b/packages/vue-router/package-lock.json index b94983af4c..2403a23fb2 100644 --- a/packages/vue-router/package-lock.json +++ b/packages/vue-router/package-lock.json @@ -1,15 +1,15 @@ { "name": "@ionic/vue-router", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/vue-router", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { - "@ionic/vue": "^6.2.5" + "@ionic/vue": "^6.2.6" }, "devDependencies": { "@types/jest": "^28.1.1", @@ -578,9 +578,9 @@ "dev": true }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dependencies": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -588,11 +588,11 @@ } }, "node_modules/@ionic/vue": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-6.2.5.tgz", - "integrity": "sha512-8mfUVb6jogmw0NLTIzcrcCQztsTLCk3MEPFOGH6UqeynHUMqP0XT/RBzNTG/dYc1XcKDgO3LFod4sEY4aKuceg==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-6.2.6.tgz", + "integrity": "sha512-IsSeoCixH29SajNOQDMk9V3mUeVvZPsiL3wbLWGj4eHg5NZJ2cmwP7BHlkzcGCRQa8Uvh6RTIfXzMUuRh6fP5A==", "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2" } }, @@ -5233,9 +5233,9 @@ "dev": true }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "requires": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -5243,11 +5243,11 @@ } }, "@ionic/vue": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-6.2.5.tgz", - "integrity": "sha512-8mfUVb6jogmw0NLTIzcrcCQztsTLCk3MEPFOGH6UqeynHUMqP0XT/RBzNTG/dYc1XcKDgO3LFod4sEY4aKuceg==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-6.2.6.tgz", + "integrity": "sha512-IsSeoCixH29SajNOQDMk9V3mUeVvZPsiL3wbLWGj4eHg5NZJ2cmwP7BHlkzcGCRQa8Uvh6RTIfXzMUuRh6fP5A==", "requires": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2" } }, diff --git a/packages/vue-router/package.json b/packages/vue-router/package.json index 797f468b09..ca5efbd5bf 100644 --- a/packages/vue-router/package.json +++ b/packages/vue-router/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/vue-router", - "version": "6.2.5", + "version": "6.2.6", "description": "Vue Router integration for @ionic/vue", "scripts": { "prepublishOnly": "npm run build", @@ -44,7 +44,7 @@ }, "homepage": "https://github.com/ionic-team/ionic#readme", "dependencies": { - "@ionic/vue": "^6.2.5" + "@ionic/vue": "^6.2.6" }, "devDependencies": { "@types/jest": "^28.1.1", diff --git a/packages/vue/CHANGELOG.md b/packages/vue/CHANGELOG.md index f713b32f83..0ff69e353f 100644 --- a/packages/vue/CHANGELOG.md +++ b/packages/vue/CHANGELOG.md @@ -3,6 +3,17 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [6.2.6](https://github.com/ionic-team/ionic/compare/v6.2.5...v6.2.6) (2022-09-07) + + +### Bug Fixes + +* **vue:** custom animation plays when replacing ([#25863](https://github.com/ionic-team/ionic/issues/25863)) ([2d3661a](https://github.com/ionic-team/ionic/commit/2d3661ae3894b98ac4b8b158594b8de0f0823073)), closes [#25831](https://github.com/ionic-team/ionic/issues/25831) + + + + + ## [6.2.5](https://github.com/ionic-team/ionic/compare/v6.2.4...v6.2.5) (2022-08-31) **Note:** Version bump only for package @ionic/vue diff --git a/packages/vue/package-lock.json b/packages/vue/package-lock.json index 616d1f2d28..967e7ecffd 100644 --- a/packages/vue/package-lock.json +++ b/packages/vue/package-lock.json @@ -1,15 +1,15 @@ { "name": "@ionic/vue", - "version": "6.2.5", + "version": "6.2.6", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@ionic/vue", - "version": "6.2.5", + "version": "6.2.6", "license": "MIT", "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2" }, "devDependencies": { @@ -59,9 +59,9 @@ } }, "node_modules/@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "dependencies": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", @@ -768,9 +768,9 @@ } }, "@ionic/core": { - "version": "6.2.5", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.5.tgz", - "integrity": "sha512-PLnG182RYydXB71cjkMk2TLxFVKabvEc9wjeK5SsvxI1/QE9+wPfxDnvKWag8UeXgaGUhby1bitWkV5pniDaXA==", + "version": "6.2.6", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.6.tgz", + "integrity": "sha512-79VGvJ33YlCX/rhepfamL2YUQnqu3cruKMo0yFbrhyJWzoF3GTT/p371FHu1e+SdIZsMu/xcn+dkcTxQjEEcdA==", "requires": { "@stencil/core": "^2.17.4", "ionicons": "^6.0.3", diff --git a/packages/vue/package.json b/packages/vue/package.json index 05ca878e7d..bbb4e25aa6 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -1,6 +1,6 @@ { "name": "@ionic/vue", - "version": "6.2.5", + "version": "6.2.6", "description": "Vue specific wrapper for @ionic/core", "scripts": { "prepublishOnly": "npm run build", @@ -61,7 +61,7 @@ "vue-router": "^4.0.16" }, "dependencies": { - "@ionic/core": "^6.2.5", + "@ionic/core": "^6.2.6", "ionicons": "^6.0.2" }, "vetur": { diff --git a/packages/vue/src/components/IonRouterOutlet.ts b/packages/vue/src/components/IonRouterOutlet.ts index ebd52b25cb..6ab254557a 100644 --- a/packages/vue/src/components/IonRouterOutlet.ts +++ b/packages/vue/src/components/IonRouterOutlet.ts @@ -217,9 +217,18 @@ export const IonRouterOutlet = /*@__PURE__*/ defineComponent({ requestAnimationFrame(async () => { enteringEl.classList.add('ion-page-invisible'); + const hasRootDirection = direction === undefined || direction === 'root' || direction === 'none'; const result = await ionRouterOutlet.value.commit(enteringEl, leavingEl, { deepWait: true, - duration: direction === undefined || direction === 'root' || direction === 'none' ? 0 : undefined, + /** + * replace operations result in a direction of none. + * These typically do not have need animations, so we set + * the duration to 0. However, if a developer explicitly + * passes an animationBuilder, we should assume that + * they want an animation to be played even + * though it is a replace operation. + */ + duration: hasRootDirection && animationBuilder === undefined ? 0 : undefined, direction, showGoBack, progressAnimation, diff --git a/packages/vue/test/base/tests/unit/hooks.spec.ts b/packages/vue/test/base/tests/unit/hooks.spec.ts index 3b6701ce2e..0d2a45a65b 100644 --- a/packages/vue/test/base/tests/unit/hooks.spec.ts +++ b/packages/vue/test/base/tests/unit/hooks.spec.ts @@ -203,7 +203,9 @@ describe('useIonRouter', () => { await waitForRouter(); expect(router.currentRoute.value.path).toEqual('/page2'); - expect(animFn).not.toHaveBeenCalled(); + + // Animation should still be called even though this is a replace operation + expect(animFn).toHaveBeenCalled(); expect(vm.ionRouter.canGoBack()).toEqual(false); }) diff --git a/packages/vue/test/base/tests/unit/router-outlet.spec.ts b/packages/vue/test/base/tests/unit/router-outlet.spec.ts new file mode 100644 index 0000000000..cafd158055 --- /dev/null +++ b/packages/vue/test/base/tests/unit/router-outlet.spec.ts @@ -0,0 +1,157 @@ +import { enableAutoUnmount, mount } from '@vue/test-utils'; +import { createRouter, createWebHistory } from '@ionic/vue-router'; +import { + IonicVue, + IonApp, + IonRouterOutlet, + IonPage, + useIonRouter, + createAnimation +} from '@ionic/vue'; +import { onBeforeRouteLeave } from 'vue-router'; +import { mockAnimation, waitForRouter } from './utils'; + +enableAutoUnmount(afterEach); + +const App = { + components: { IonApp, IonRouterOutlet }, + template: '', +} + +const BasePage = { + template: '', + components: { IonPage }, +} + +/** + * While these tests use useIonRouter, + * they are different from the tests in hook.spec.ts + * in that they are testing that the correct parameters + * are passed to IonRouterOutlet as opposed to hook.spec.ts + * which makes sure that the animation function is called when + * specifically using useIonRouter. + */ +describe('Routing', () => { + it('should have an animation duration of 0 if replacing without an explicit animation', async () => { + const Page1 = { + ...BasePage, + setup() { + const ionRouter = useIonRouter(); + const redirect = () => { + ionRouter.replace('/page2') + } + + return { redirect } + } + }; + + const Page2 = { + ...BasePage + }; + + const router = createRouter({ + history: createWebHistory(process.env.BASE_URL), + routes: [ + { path: '/', component: Page1 }, + { path: '/page2', component: Page2 } + ] + }); + + router.push('/'); + await router.isReady(); + const wrapper = mount(App, { + global: { + plugins: [router, IonicVue] + } + }); + + /** + * Mock the commit function on IonRouterOutlet + */ + const commitFn = jest.fn(); + const routerOutlet = wrapper.findComponent(IonRouterOutlet); + routerOutlet.vm.$el.commit = commitFn; + + // call redirect method on Page1 + const cmp = wrapper.findComponent(Page1); + cmp.vm.redirect(); + await waitForRouter(); + + expect(commitFn).toBeCalledWith( + /** + * We are not checking the first 2 + * params in this test, + * so we can use expect.anything(). + */ + expect.anything(), + expect.anything(), + expect.objectContaining({ + direction: "none", + duration: 0, + animationBuilder: undefined + }) + ) + }); + + it('should have an animation duration of null if replacing with an explicit animation', async () => { + const animation = mockAnimation(); + const Page1 = { + ...BasePage, + setup() { + const ionRouter = useIonRouter(); + const redirect = () => { + ionRouter.replace('/page2', animation) + } + + return { redirect } + } + }; + + const Page2 = { + ...BasePage + }; + + const router = createRouter({ + history: createWebHistory(process.env.BASE_URL), + routes: [ + { path: '/', component: Page1 }, + { path: '/page2', component: Page2 } + ] + }); + + router.push('/'); + await router.isReady(); + const wrapper = mount(App, { + global: { + plugins: [router, IonicVue] + } + }); + + /** + * Mock the commit function on IonRouterOutlet + */ + const commitFn = jest.fn(); + const routerOutlet = wrapper.findComponent(IonRouterOutlet); + routerOutlet.vm.$el.commit = commitFn; + + // call redirect method on Page1 + const cmp = wrapper.findComponent(Page1); + cmp.vm.redirect(); + await waitForRouter(); + + expect(commitFn).toBeCalledWith( + /** + * We are not checking the first 2 + * params in this test, + * so we can use expect.anything(). + */ + expect.anything(), + expect.anything(), + expect.objectContaining({ + direction: "none", + duration: undefined, + animationBuilder: animation + }) + ) + }); +}); diff --git a/packages/vue/test/base/tests/unit/utils.ts b/packages/vue/test/base/tests/unit/utils.ts index c49f54e7cc..2fb0a6144e 100644 --- a/packages/vue/test/base/tests/unit/utils.ts +++ b/packages/vue/test/base/tests/unit/utils.ts @@ -1,4 +1,5 @@ import { flushPromises } from '@vue/test-utils'; +import { createAnimation } from '@ionic/vue'; export const waitForRouter = async () => { await flushPromises(); @@ -6,10 +7,5 @@ export const waitForRouter = async () => { } export const mockAnimation = () => { - return jest.fn(() => { - return { - onFinish: () => {}, - play: () => {} - } - }) + return jest.fn(() => createAnimation()); }