add poc

test(toast): reset config to avoid unnecessary setTimeouts (#29004 )
Issue number: Internal ---------   ## What is the current behavior?  Team members are running into unexpected errors running spec tests: ``` TypeError: Cannot read properties of undefined (reading '$instanceValues$') ``` This line is the culprit: f885a5526a/core/src/components/toast/test/toast.spec.tsx (L108) We set the Ionic config for toastDuration to 5000. This means that on present a setTimeout callback will fire after 5000ms and dismiss the toast. For this test, this is fine because we never present the toast therefore the setTimeout is never created. The problem is that this config is not automatically reset between tests. As a result, when we have tests that only present the toast (and never dismiss it) the duration is also 5000 there: f885a5526a/core/src/components/toast/test/toast.spec.tsx (L179-L184) This results in a bunch of setTimeouts being created. The timeout callback runs dismiss, and the body of that function tries to access data on the host toast. Since the toast instance has already been torn down (since the tests are done), the undefined error occurs. ## What is the new behavior?  - Reset the Ionic config after the test that sets `toastDuration` to `5000` ## Does this introduce a breaking change? - [ ] Yes - [x] No  ## Other information
2026-03-13 10:22:08 +08:00 · 2024-02-09 10:04:11 -05:00 · 2024-02-08 18:50:48 +00:00 · 2024-02-08 18:36:24 +00:00 · 2024-02-07 19:00:01 +00:00 · 2024-02-07 13:39:32 -05:00
95 changed files with 785 additions and 204 deletions
--- a/.github/workflows/stencil-nightly.yml
+++ b/.github/workflows/stencil-nightly.yml
@@ -150,7 +150,7 @@ jobs:
    strategy:
      fail-fast: false
      matrix:
-        apps: [ng12, ng13, ng14, ng15]
+        apps: [ng16, ng17]
    needs: [build-angular, build-angular-server]
    runs-on: ubuntu-latest
    steps:
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,31 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **action-sheet:** iOS dismiss animation respects safe area ([#28915](https://github.com/ionic-team/ionic-framework/issues/28915)) ([7449fb4](https://github.com/ionic-team/ionic-framework/commit/7449fb4fed4048f5d01ba068dc6f8e2d7727e95d)), closes [#28541](https://github.com/ionic-team/ionic-framework/issues/28541)
+* **overlays:** tear down animations after dismiss ([#28907](https://github.com/ionic-team/ionic-framework/issues/28907)) ([950fa40](https://github.com/ionic-team/ionic-framework/commit/950fa40c5597c81d5cbaeb9276b09adfea5e79fb)), closes [#28352](https://github.com/ionic-team/ionic-framework/issues/28352)
+* **react:** route with redirect will mount page ([#28961](https://github.com/ionic-team/ionic-framework/issues/28961)) ([5777ce2](https://github.com/ionic-team/ionic-framework/commit/5777ce258119d2715b1326cdc103bd4ad7612bd1)), closes [#28838](https://github.com/ionic-team/ionic-framework/issues/28838)
+* **select:** popover can be scrolled ([#28965](https://github.com/ionic-team/ionic-framework/issues/28965)) ([35ab6b4](https://github.com/ionic-team/ionic-framework/commit/35ab6b4816bd627239de8d8b25ce0c86db8c74b4)), closes [#28963](https://github.com/ionic-team/ionic-framework/issues/28963)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+
+### Features
+
+* add experimental hardware back button support in browsers ([#28705](https://github.com/ionic-team/ionic-framework/issues/28705)) ([658d1ca](https://github.com/ionic-team/ionic-framework/commit/658d1caccd530350843b85c0e24544ec27dd9eb4)), closes [#28703](https://github.com/ionic-team/ionic-framework/issues/28703)
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)


--- a/core/CHANGELOG.md
+++ b/core/CHANGELOG.md
@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **action-sheet:** iOS dismiss animation respects safe area ([#28915](https://github.com/ionic-team/ionic-framework/issues/28915)) ([7449fb4](https://github.com/ionic-team/ionic-framework/commit/7449fb4fed4048f5d01ba068dc6f8e2d7727e95d)), closes [#28541](https://github.com/ionic-team/ionic-framework/issues/28541)
+* **overlays:** tear down animations after dismiss ([#28907](https://github.com/ionic-team/ionic-framework/issues/28907)) ([950fa40](https://github.com/ionic-team/ionic-framework/commit/950fa40c5597c81d5cbaeb9276b09adfea5e79fb)), closes [#28352](https://github.com/ionic-team/ionic-framework/issues/28352)
+* **select:** popover can be scrolled ([#28965](https://github.com/ionic-team/ionic-framework/issues/28965)) ([35ab6b4](https://github.com/ionic-team/ionic-framework/commit/35ab6b4816bd627239de8d8b25ce0c86db8c74b4)), closes [#28963](https://github.com/ionic-team/ionic-framework/issues/28963)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+
+### Features
+
+* add experimental hardware back button support in browsers ([#28705](https://github.com/ionic-team/ionic-framework/issues/28705)) ([658d1ca](https://github.com/ionic-team/ionic-framework/commit/658d1caccd530350843b85c0e24544ec27dd9eb4)), closes [#28703](https://github.com/ionic-team/ionic-framework/issues/28703)
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)


--- a/core/package-lock.json
+++ b/core/package-lock.json
@@ -1,22 +1,22 @@
 {
  "name": "@ionic/core",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/core",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@stencil/core": "^4.12.0",
+        "@stencil/core": "^4.12.1",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      },
      "devDependencies": {
        "@axe-core/playwright": "^4.8.4",
        "@capacitor/core": "^5.6.0",
-        "@capacitor/haptics": "^5.0.6",
+        "@capacitor/haptics": "^5.0.7",
        "@capacitor/keyboard": "^5.0.8",
        "@capacitor/status-bar": "^5.0.7",
        "@ionic/eslint-config": "^0.3.0",
@@ -24,7 +24,7 @@
        "@playwright/test": "^1.39.0",
        "@rollup/plugin-node-resolve": "^8.4.0",
        "@rollup/plugin-virtual": "^2.0.3",
-        "@stencil/angular-output-target": "^0.8.3",
+        "@stencil/angular-output-target": "^0.8.4",
        "@stencil/react-output-target": "^0.5.3",
        "@stencil/sass": "^3.0.9",
        "@stencil/vue-output-target": "^0.8.7",
@@ -643,9 +643,9 @@
      }
    },
    "node_modules/@capacitor/haptics": {
-      "version": "5.0.6",
-      "resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-5.0.6.tgz",
-      "integrity": "sha512-UrMcR7p2X10ql4VLlowUuH/VckTeu0lj+RQpekxox14uxDmu5AGIFDK/iDTi8W6QZkxTJRZK6sbCjgwYgNJ7Pw==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-5.0.7.tgz",
+      "integrity": "sha512-/j+7Qa4BxQA5aOU43cwXuiudfSXfoHFsAVfcehH5DkSjxLykZKWHEuE4uFJXqdkSIbAHjS37D0Sde6ENP6G/MA==",
      "dev": true,
      "peerDependencies": {
        "@capacitor/core": "^5.0.0"
@@ -1816,18 +1816,18 @@
      }
    },
    "node_modules/@stencil/angular-output-target": {
-      "version": "0.8.3",
-      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.8.3.tgz",
-      "integrity": "sha512-I/QO1sEx09WWUaNlA30EBhlXYftOSfSBTwYBwC65qlpHDIlD5WU3EAtKhU5IphfwhxnD63kvOoU1YvTUXFHNng==",
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.8.4.tgz",
+      "integrity": "sha512-QvmHTueXXs5vB9W2L12uEzFmAuR8sqATJV2b+SCFmYsjJSaymiSqR3dKo2wnr0tZiTgU1t16BWaUKiSh3wPXpw==",
      "dev": true,
      "peerDependencies": {
        "@stencil/core": ">=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0"
      }
    },
    "node_modules/@stencil/core": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
-      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -11333,9 +11333,9 @@
      }
    },
    "@capacitor/haptics": {
-      "version": "5.0.6",
-      "resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-5.0.6.tgz",
-      "integrity": "sha512-UrMcR7p2X10ql4VLlowUuH/VckTeu0lj+RQpekxox14uxDmu5AGIFDK/iDTi8W6QZkxTJRZK6sbCjgwYgNJ7Pw==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/@capacitor/haptics/-/haptics-5.0.7.tgz",
+      "integrity": "sha512-/j+7Qa4BxQA5aOU43cwXuiudfSXfoHFsAVfcehH5DkSjxLykZKWHEuE4uFJXqdkSIbAHjS37D0Sde6ENP6G/MA==",
      "dev": true,
      "requires": {}
    },
@@ -12177,16 +12177,16 @@
      }
    },
    "@stencil/angular-output-target": {
-      "version": "0.8.3",
-      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.8.3.tgz",
-      "integrity": "sha512-I/QO1sEx09WWUaNlA30EBhlXYftOSfSBTwYBwC65qlpHDIlD5WU3EAtKhU5IphfwhxnD63kvOoU1YvTUXFHNng==",
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/@stencil/angular-output-target/-/angular-output-target-0.8.4.tgz",
+      "integrity": "sha512-QvmHTueXXs5vB9W2L12uEzFmAuR8sqATJV2b+SCFmYsjJSaymiSqR3dKo2wnr0tZiTgU1t16BWaUKiSh3wPXpw==",
      "dev": true,
      "requires": {}
    },
    "@stencil/core": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
-      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ=="
    },
    "@stencil/react-output-target": {
      "version": "0.5.3",
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/core",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Base components for Ionic",
  "keywords": [
    "ionic",
@@ -31,14 +31,14 @@
    "loader/"
  ],
  "dependencies": {
-    "@stencil/core": "^4.12.0",
+    "@stencil/core": "^4.12.1",
    "ionicons": "^7.2.2",
    "tslib": "^2.1.0"
  },
  "devDependencies": {
    "@axe-core/playwright": "^4.8.4",
    "@capacitor/core": "^5.6.0",
-    "@capacitor/haptics": "^5.0.6",
+    "@capacitor/haptics": "^5.0.7",
    "@capacitor/keyboard": "^5.0.8",
    "@capacitor/status-bar": "^5.0.7",
    "@ionic/eslint-config": "^0.3.0",
@@ -46,7 +46,7 @@
    "@playwright/test": "^1.39.0",
    "@rollup/plugin-node-resolve": "^8.4.0",
    "@rollup/plugin-virtual": "^2.0.3",
-    "@stencil/angular-output-target": "^0.8.3",
+    "@stencil/angular-output-target": "^0.8.4",
    "@stencil/react-output-target": "^0.5.3",
    "@stencil/sass": "^3.0.9",
    "@stencil/vue-output-target": "^0.8.7",
--- a/core/src/components.d.ts
+++ b/core/src/components.d.ts
@@ -160,7 +160,7 @@ export namespace Components {
        /**
          * Dismiss the action sheet overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -239,7 +239,7 @@ export namespace Components {
        /**
          * Dismiss the alert overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -1527,7 +1527,7 @@ export namespace Components {
        /**
          * Dismiss the loading overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -1720,7 +1720,7 @@ export namespace Components {
        /**
          * Dismiss the modal overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+          * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -1948,6 +1948,9 @@ export namespace Components {
         */
        "mode"?: "ios" | "md";
    }
+    interface IonPasswordStrength {
+        "strength"?: 'weak' | 'medium' | 'strong';
+    }
    interface IonPicker {
        /**
          * If `true`, the picker will animate.
@@ -1973,7 +1976,7 @@ export namespace Components {
        /**
          * Dismiss the picker overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -2110,7 +2113,7 @@ export namespace Components {
          * Dismiss the popover overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
          * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
-          * @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`.
+          * @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string, dismissParentPopover?: boolean) => Promise<boolean>;
        /**
@@ -3111,7 +3114,7 @@ export namespace Components {
        /**
          * Dismiss the toast overlay after it has been presented.
          * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
         */
        "dismiss": (data?: any, role?: string) => Promise<boolean>;
        /**
@@ -4035,6 +4038,12 @@ declare global {
        prototype: HTMLIonNoteElement;
        new (): HTMLIonNoteElement;
    };
+    interface HTMLIonPasswordStrengthElement extends Components.IonPasswordStrength, HTMLStencilElement {
+    }
+    var HTMLIonPasswordStrengthElement: {
+        prototype: HTMLIonPasswordStrengthElement;
+        new (): HTMLIonPasswordStrengthElement;
+    };
    interface HTMLIonPickerElementEventMap {
        "ionPickerDidPresent": void;
        "ionPickerWillPresent": void;
@@ -4672,6 +4681,7 @@ declare global {
        "ion-nav": HTMLIonNavElement;
        "ion-nav-link": HTMLIonNavLinkElement;
        "ion-note": HTMLIonNoteElement;
+        "ion-password-strength": HTMLIonPasswordStrengthElement;
        "ion-picker": HTMLIonPickerElement;
        "ion-picker-column": HTMLIonPickerColumnElement;
        "ion-picker-column-internal": HTMLIonPickerColumnInternalElement;
@@ -6606,6 +6616,9 @@ declare namespace LocalJSX {
         */
        "mode"?: "ios" | "md";
    }
+    interface IonPasswordStrength {
+        "strength"?: 'weak' | 'medium' | 'strong';
+    }
    interface IonPicker {
        /**
          * If `true`, the picker will animate.
@@ -8127,6 +8140,7 @@ declare namespace LocalJSX {
        "ion-nav": IonNav;
        "ion-nav-link": IonNavLink;
        "ion-note": IonNote;
+        "ion-password-strength": IonPasswordStrength;
        "ion-picker": IonPicker;
        "ion-picker-column": IonPickerColumn;
        "ion-picker-column-internal": IonPickerColumnInternal;
@@ -8224,6 +8238,7 @@ declare module "@stencil/core" {
            "ion-nav": LocalJSX.IonNav & JSXBase.HTMLAttributes<HTMLIonNavElement>;
            "ion-nav-link": LocalJSX.IonNavLink & JSXBase.HTMLAttributes<HTMLIonNavLinkElement>;
            "ion-note": LocalJSX.IonNote & JSXBase.HTMLAttributes<HTMLIonNoteElement>;
+            "ion-password-strength": LocalJSX.IonPasswordStrength & JSXBase.HTMLAttributes<HTMLIonPasswordStrengthElement>;
            "ion-picker": LocalJSX.IonPicker & JSXBase.HTMLAttributes<HTMLIonPickerElement>;
            "ion-picker-column": LocalJSX.IonPickerColumn & JSXBase.HTMLAttributes<HTMLIonPickerColumnElement>;
            "ion-picker-column-internal": LocalJSX.IonPickerColumnInternal & JSXBase.HTMLAttributes<HTMLIonPickerColumnInternalElement>;
--- a/core/src/components/action-sheet/action-sheet.ios.scss
+++ b/core/src/components/action-sheet/action-sheet.ios.scss
@@ -26,7 +26,24 @@
 // ---------------------------------------------------

 .action-sheet-wrapper {
-  @include margin(var(--ion-safe-area-top, 0), auto, var(--ion-safe-area-bottom, 0), auto);
+  @include margin(var(--ion-safe-area-top, 0), auto, null, auto);
+  /**
+   * Bottom safe area is applied as padding so that it impacts the bounding box.
+   * When the action sheet is shown/hidden, this element is transformed by translating
+   * 100% of its height. This translation needs to include the bottom safe area
+   * otherwise part of the action sheet will still be visible at the end of
+   * the show transition.
+   *
+   * If this code is changed, reviewers should verify that the action
+   * sheet still translates out of the viewport completely when the bottom
+   * safe area is a positive value.
+   */
+  @include padding(null, null, var(--ion-safe-area-bottom, 0), null);
+
+  // Using content-box to increase the height of the action sheet
+  // wrapper by the bottom padding (safe area) to animate the
+  // action sheet completely off the screen when safe area is set.
+  box-sizing: content-box;
 }

 // iOS Action Sheet Container
--- a/core/src/components/action-sheet/action-sheet.tsx
+++ b/core/src/components/action-sheet/action-sheet.tsx
@@ -216,6 +216,10 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the action sheet.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
--- a/core/src/components/alert/alert.tsx
+++ b/core/src/components/alert/alert.tsx
@@ -411,6 +411,10 @@ export class Alert implements ComponentInterface, OverlayInterface {
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the alert.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
--- a/core/src/components/app/app.tsx
+++ b/core/src/components/app/app.tsx
@@ -1,6 +1,8 @@
 import type { ComponentInterface } from '@stencil/core';
 import { Build, Component, Element, Host, Method, h } from '@stencil/core';
 import type { FocusVisibleUtility } from '@utils/focus-visible';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';
+import { printIonWarning } from '@utils/logging';
 import { isPlatform } from '@utils/platform';

 import { config } from '../../global/config';
@@ -34,9 +36,20 @@ export class App implements ComponentInterface {
          import('../../utils/input-shims/input-shims').then((module) => module.startInputShims(config, platform));
        }
        const hardwareBackButtonModule = await import('../../utils/hardware-back-button');
-        if (config.getBoolean('hardwareBackButton', isHybrid)) {
+        const supportsHardwareBackButtonEvents = isHybrid || shoudUseCloseWatcher();
+        if (config.getBoolean('hardwareBackButton', supportsHardwareBackButtonEvents)) {
          hardwareBackButtonModule.startHardwareBackButton();
        } else {
+          /**
+           * If an app sets hardwareBackButton: false and experimentalCloseWatcher: true
+           * then the close watcher will not be used.
+           */
+          if (shoudUseCloseWatcher()) {
+            printIonWarning(
+              'experimentalCloseWatcher was set to `true`, but hardwareBackButton was set to `false`. Both config options must be `true` for the Close Watcher API to be used.'
+            );
+          }
+
          hardwareBackButtonModule.blockHardwareBackButton();
        }
        if (typeof (window as any) !== 'undefined') {
--- a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/loading/loading.tsx
+++ b/core/src/components/loading/loading.tsx
@@ -268,6 +268,10 @@ export class Loading implements ComponentInterface, OverlayInterface {
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the loading.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
--- a/core/src/components/menu/menu.tsx
+++ b/core/src/components/menu/menu.tsx
@@ -2,6 +2,7 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core';
 import { Build, Component, Element, Event, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';
 import { getTimeGivenProgression } from '@utils/animation/cubic-bezier';
 import { GESTURE_CONTROLLER } from '@utils/gesture';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';
 import type { Attributes } from '@utils/helpers';
 import { inheritAriaAttributes, assert, clamp, isEndSide as isEnd } from '@utils/helpers';
 import { menuController } from '@utils/menu-controller';
@@ -321,7 +322,6 @@ export class Menu implements ComponentInterface, MenuI {
    }
  }

-  @Listen('keydown')
  onKeydown(ev: KeyboardEvent) {
    if (ev.key === 'Escape') {
      this.close();
@@ -781,8 +781,14 @@ export class Menu implements ComponentInterface, MenuI {
    const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
    const mode = getIonMode(this);

+    /**
+     * If the Close Watcher is enabled then
+     * the ionBackButton listener in the menu controller
+     * will handle closing the menu when Escape is pressed.
+     */
    return (
      <Host
+        onKeyDown={shoudUseCloseWatcher() ? null : this.onKeydown}
        role="navigation"
        aria-label={inheritedAttributes['aria-label'] || 'menu'}
        class={{
--- a/core/src/components/modal/modal.tsx
+++ b/core/src/components/modal/modal.tsx
@@ -10,7 +10,6 @@ import { Style as StatusBarStyle, StatusBar } from '@utils/native/status-bar';
 import {
  GESTURE,
  BACKDROP,
-  activeAnimations,
  dismiss,
  eventMethod,
  prepareOverlay,
@@ -663,6 +662,10 @@ export class Modal implements ComponentInterface, OverlayInterface {
   *
   * @param data Any data to emit in the dismiss events.
   * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
@@ -705,8 +708,6 @@ export class Modal implements ComponentInterface, OverlayInterface {
      this.keyboardOpenCallback = undefined;
    }

-    const enteringAnimation = activeAnimations.get(this) || [];
-
    const dismissed = await dismiss<ModalDismissOptions>(
      this,
      data,
@@ -733,8 +734,6 @@ export class Modal implements ComponentInterface, OverlayInterface {
      if (this.gesture) {
        this.gesture.destroy();
      }
-
-      enteringAnimation.forEach((ani) => ani.destroy());
    }
    this.currentBreakpoint = undefined;
    this.animation = undefined;
--- a/core/src/components/modal/test/animations/modal.e2e.ts
+++ b/core/src/components/modal/test/animations/modal.e2e.ts
@@ -0,0 +1,45 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ config, title }) => {
+  test.describe(title('modal: animations'), () => {
+    test.beforeEach(async ({ page }) => {
+      await page.setContent(
+        `
+        <ion-modal is-open="true" trigger="open-modal"></ion-modal>
+      `,
+        config
+      );
+    });
+    test('card modal should clean up animations on dismiss', async ({ page }, testInfo) => {
+      testInfo.annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/28352',
+      });
+
+      const ionModalDidDismiss = await page.spyOnEvent('ionModalDidDismiss');
+
+      const modal = page.locator('ion-modal');
+
+      const initialAnimations = await modal.evaluate((el: HTMLIonModalElement) => {
+        return el.shadowRoot!.getAnimations();
+      });
+
+      // While the modal is open, it should have animations
+      expect(initialAnimations.length).toBeGreaterThan(0);
+
+      await modal.evaluate((el: HTMLIonModalElement) => {
+        el.dismiss();
+      });
+
+      await ionModalDidDismiss.next();
+
+      const currentAnimations = await modal.evaluate((el: HTMLIonModalElement) => {
+        return el.shadowRoot!.getAnimations();
+      });
+
+      // Once the modal has finished closing, there should be no animations
+      expect(currentAnimations.length).toBe(0);
+    });
+  });
+});
--- a/core/src/components/password-strength/password-strength.tsx
+++ b/core/src/components/password-strength/password-strength.tsx
@@ -0,0 +1,34 @@
+import type { ComponentInterface } from '@stencil/core';
+import { Component, Host, Prop, h } from '@stencil/core';
+
+const progressBarValue: any = {
+  'weak': {
+    value: 0.2,
+  },
+  'medium': {
+    value: 0.6,
+  },
+  'strong': {
+    value: 1,
+  }
+}
+
+@Component({
+  tag: 'ion-password-strength',
+  shadow: true
+})
+export class PasswordStrength implements ComponentInterface {
+  @Prop() strength?: 'weak' | 'medium' | 'strong';
+
+  render() {
+    // TODO need a mode virtual prop
+    // TODO need to add colors
+    const data = this.strength !== undefined ? progressBarValue[this.strength] : undefined;
+    return (
+      <Host>
+        <ion-progress-bar value={data?.value || 0}></ion-progress-bar>
+        { this.strength !== undefined && <slot name={this.strength}></slot> }
+      </Host>
+    );
+  }
+}
--- a/core/src/components/password-strength/test/basic/index.html
+++ b/core/src/components/password-strength/test/basic/index.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="UTF-8" />
+    <title>Password Strength - Basic</title>
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
+    />
+    <link href="../../../../../css/ionic.bundle.css" rel="stylesheet" />
+    <link href="../../../../../scripts/testing/styles.css" rel="stylesheet" />
+    <script src="../../../../../scripts/testing/scripts.js"></script>
+    <script nomodule src="../../../../../dist/ionic/ionic.js"></script>
+    <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
+  </head>
+
+  <body class="ion-padding">
+    <ion-input label="Password" type="password" fill="outline"></ion-input>
+
+    <br />
+
+    <ion-password-strength>
+      <div slot="weak">Your password is weak</div>
+      <div slot="medium">Your password is medium</div>
+      <div slot="strong">Your password is strong</div>
+    </ion-password-strength>
+
+    <script>
+      const input = document.querySelector('ion-input');
+      const ps = document.querySelector('ion-password-strength');
+      input.addEventListener('ionInput', () => {
+        const val = input.value;
+
+        if (val.length === 0) {
+          ps.strength = undefined;
+        } else if (val.length < 4) {
+          ps.strength = 'weak';
+        } else if (val.length < 8) {
+          ps.strength = 'medium';
+        } else {
+          ps.strength = 'strong';
+        }
+      });
+    </script>
+  </body>
+</html>
--- a/core/src/components/picker/picker.tsx
+++ b/core/src/components/picker/picker.tsx
@@ -248,6 +248,10 @@ export class Picker implements ComponentInterface, OverlayInterface {
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the picker.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
--- a/core/src/components/popover/popover.ios.scss
+++ b/core/src/components/popover/popover.ios.scss
@@ -35,6 +35,13 @@
  height: 10px;

  overflow: hidden;
+  /*
+   * Required for the arrow to render above the backdrop.
+   * Otherwise, the arrow will appear slightly transparent.
+   * The value is set to 11 since it's the minimum value that
+   * will allow the arrow to render above the backdrop.
+   */
+  z-index: 11;
 }

 .popover-arrow::after {
--- a/core/src/components/popover/popover.tsx
+++ b/core/src/components/popover/popover.tsx
@@ -525,6 +525,10 @@ export class Popover implements ComponentInterface, PopoverInterface {
   * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
   * @param dismissParentPopover If `true`, dismissing this popover will also dismiss
   * a parent popover if this popover is nested. Defaults to `true`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string, dismissParentPopover = true): Promise<boolean> {
--- a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/select-popover/select-popover.scss
+++ b/core/src/components/select-popover/select-popover.scss
@@ -8,3 +8,14 @@ ion-list-header,
 ion-label {
  @include margin(0);
 }
+
+
+/**
+ * The main content inside of a popover has overflow: hidden
+ * so that a descendant ion-content can be scrolled.
+ * However, select-popover does not use ion-content so we need
+ * to explicitly make this container scrollable.
+ */
+:host {
+  overflow-y: auto;
+}
--- a/core/src/components/split-pane/split-pane.tsx
+++ b/core/src/components/split-pane/split-pane.tsx
@@ -112,17 +112,16 @@ export class SplitPane implements ComponentInterface {
      return;
    }

-    if ((window as any).matchMedia) {
-      // Listen on media query
-      const callback = (q: MediaQueryList) => {
-        this.visible = q.matches;
-      };
+    // Listen on media query
+    const callback = (q: MediaQueryList) => {
+      this.visible = q.matches;
+    };

-      const mediaList = window.matchMedia(mediaQuery);
-      mediaList.addListener(callback as any);
-      this.rmL = () => mediaList.removeListener(callback as any);
-      this.visible = mediaList.matches;
-    }
+    const mediaList = window.matchMedia(mediaQuery);
+    // TODO FW-5869
+    mediaList.addListener(callback as any);
+    this.rmL = () => mediaList.removeListener(callback as any);
+    this.visible = mediaList.matches;
  }

  private isPane(element: HTMLElement): boolean {
--- a/core/src/components/toast/test/toast.spec.tsx
+++ b/core/src/components/toast/test/toast.spec.tsx
@@ -93,6 +93,19 @@ describe('toast: a11y smoke test', () => {
 });

 describe('toast: duration config', () => {
+  afterEach(() => {
+    /**
+     * Important: Reset the config
+     * after each test as it is not
+     * automatically reset.
+     * Otherwise, toasts in other tests
+     * will take on any toastDuration value
+     * set and timeouts will potentially run
+     * after tests are finished.
+     */
+    config.reset({});
+  });
+
  it('should have duration set to 0', async () => {
    const page = await newSpecPage({
      components: [Toast],
--- a/core/src/components/toast/toast.tsx
+++ b/core/src/components/toast/toast.tsx
@@ -401,6 +401,10 @@ export class Toast implements ComponentInterface, OverlayInterface {
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the toast.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
--- a/core/src/utils/browser/index.ts
+++ b/core/src/utils/browser/index.ts
@@ -72,7 +72,32 @@ type IonicEvents = {
  ): void;
 };

-type IonicWindow = Window & IonicEvents;
+export interface CloseWatcher extends EventTarget {
+  new (options?: CloseWatcherOptions): any;
+  requestClose(): void;
+  close(): void;
+  destroy(): void;
+
+  oncancel: (event: Event) => void | null;
+  onclose: (event: Event) => void | null;
+}
+
+interface CloseWatcherOptions {
+  signal: AbortSignal;
+}
+
+/**
+ * Experimental browser features that
+ * are selectively used inside of Ionic
+ * Since they are experimental they typically
+ * do not have types yet, so we can add custom ones
+ * here until types are available.
+ */
+type ExperimentalWindowFeatures = {
+  CloseWatcher?: CloseWatcher;
+};
+
+type IonicWindow = Window & IonicEvents & ExperimentalWindowFeatures;
 type IonicDocument = Document & IonicEvents;

 export const win: IonicWindow | undefined = typeof window !== 'undefined' ? window : undefined;
--- a/core/src/utils/config.ts
+++ b/core/src/utils/config.ts
@@ -204,6 +204,14 @@ export interface IonicConfig {
   */
  platform?: PlatformConfig;

+  /**
+   * @experimental
+   * If `true`, the [CloseWatcher API](https://github.com/WICG/close-watcher) will be used to handle
+   * all Escape key and hardware back button presses to dismiss menus and overlays and to navigate.
+   * Note that the `hardwareBackButton` config option must also be `true`.
+   */
+  experimentalCloseWatcher?: boolean;
+
  // PRIVATE configs
  keyboardHeight?: number;
  inputShims?: boolean;
--- a/core/src/utils/hardware-back-button.ts
+++ b/core/src/utils/hardware-back-button.ts
@@ -1,3 +1,8 @@
+import { win } from '@utils/browser';
+import type { CloseWatcher } from '@utils/browser';
+
+import { config } from '../global/config';
+
 // TODO(FW-2832): type
 type Handler = (processNextHandler: () => void) => Promise<any> | void | null;

@@ -13,6 +18,21 @@ interface HandlerRegister {
  id: number;
 }

+/**
+ * CloseWatcher is a newer API that lets
+ * use detect the hardware back button event
+ * in a web browser: https://caniuse.com/?search=closewatcher
+ * However, not every browser supports it yet.
+ *
+ * This needs to be a function so that we can
+ * check the config once it has been set.
+ * Otherwise, this code would be evaluated the
+ * moment this file is evaluated which could be
+ * before the config is set.
+ */
+export const shoudUseCloseWatcher = () =>
+  config.get('experimentalCloseWatcher', false) && win !== undefined && 'CloseWatcher' in win;
+
 /**
 * When hardwareBackButton: false in config,
 * we need to make sure we also block the default
@@ -29,9 +49,9 @@ export const blockHardwareBackButton = () => {

 export const startHardwareBackButton = () => {
  const doc = document;
-
  let busy = false;
-  doc.addEventListener('backbutton', () => {
+
+  const backButtonCallback = () => {
    if (busy) {
      return;
    }
@@ -81,7 +101,38 @@ export const startHardwareBackButton = () => {
    };

    processHandlers();
-  });
+  };
+
+  /**
+   * If the CloseWatcher is defined then
+   * we don't want to also listen for the native
+   * backbutton event otherwise we may get duplicate
+   * events firing.
+   */
+  if (shoudUseCloseWatcher()) {
+    let watcher: CloseWatcher | undefined;
+
+    const configureWatcher = () => {
+      watcher?.destroy();
+      watcher = new win!.CloseWatcher!();
+
+      /**
+       * Once a close request happens
+       * the watcher gets destroyed.
+       * As a result, we need to re-configure
+       * the watcher so we can respond to other
+       * close requests.
+       */
+      watcher!.onclose = () => {
+        backButtonCallback();
+        configureWatcher();
+      };
+    };
+
+    configureWatcher();
+  } else {
+    doc.addEventListener('backbutton', backButtonCallback);
+  }
 };

 export const OVERLAY_BACK_BUTTON_PRIORITY = 100;
--- a/core/src/utils/helpers.ts
+++ b/core/src/utils/helpers.ts
@@ -22,7 +22,7 @@ export const transitionEndAsync = (el: HTMLElement | null, expectedDuration = 0)
 */
 const transitionEnd = (el: HTMLElement | null, expectedDuration = 0, callback: (ev?: TransitionEvent) => void) => {
  let unRegTrans: (() => void) | undefined;
-  let animationTimeout: any;
+  let animationTimeout: number | undefined;
  const opts: AddEventListenerOptions = { passive: true };
  const ANIMATION_FALLBACK_TIMEOUT = 500;

@@ -45,7 +45,7 @@ const transitionEnd = (el: HTMLElement | null, expectedDuration = 0, callback: (
    animationTimeout = setTimeout(onTransitionEnd, expectedDuration + ANIMATION_FALLBACK_TIMEOUT);

    unRegTrans = () => {
-      if (animationTimeout) {
+      if (animationTimeout !== undefined) {
        clearTimeout(animationTimeout);
        animationTimeout = undefined;
      }
--- a/core/src/utils/overlays.ts
+++ b/core/src/utils/overlays.ts
@@ -1,5 +1,6 @@
 import { doc } from '@utils/browser';
 import type { BackButtonEvent } from '@utils/hardware-back-button';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';

 import { config } from '../global/config';
 import { getIonMode } from '../global/ionic-global';
@@ -353,20 +354,39 @@ const connectListeners = (doc: Document) => {
      const lastOverlay = getPresentedOverlay(doc);
      if (lastOverlay?.backdropDismiss) {
        (ev as BackButtonEvent).detail.register(OVERLAY_BACK_BUTTON_PRIORITY, () => {
-          return lastOverlay.dismiss(undefined, BACKDROP);
+          /**
+           * Do not return this promise otherwise
+           * the hardware back button utility will
+           * be blocked until the overlay dismisses.
+           * This is important for a modal with canDismiss.
+           * If the application presents a confirmation alert
+           * in the "canDismiss" callback, then it will be impossible
+           * to use the hardware back button to dismiss the alert
+           * dialog because the hardware back button utility
+           * is blocked on waiting for the modal to dismiss.
+           */
+          lastOverlay.dismiss(undefined, BACKDROP);
        });
      }
    });

-    // handle ESC to close overlay
-    doc.addEventListener('keydown', (ev) => {
-      if (ev.key === 'Escape') {
-        const lastOverlay = getPresentedOverlay(doc);
-        if (lastOverlay?.backdropDismiss) {
-          lastOverlay.dismiss(undefined, BACKDROP);
+    /**
+     * Handle ESC to close overlay.
+     * CloseWatcher also handles pressing the Esc
+     * key, so if a browser supports CloseWatcher then
+     * this behavior will be handled via the ionBackButton
+     * event.
+     */
+    if (!shoudUseCloseWatcher()) {
+      doc.addEventListener('keydown', (ev) => {
+        if (ev.key === 'Escape') {
+          const lastOverlay = getPresentedOverlay(doc);
+          if (lastOverlay?.backdropDismiss) {
+            lastOverlay.dismiss(undefined, BACKDROP);
+          }
        }
-      }
-    });
+      });
+    }
  }
 };

@@ -577,6 +597,12 @@ export const dismiss = async <OverlayDismissOptions>(
    overlay.didDismiss.emit({ data, role });
    overlay.didDismissShorthand?.emit({ data, role });

+    // Get a reference to all animations currently assigned to this overlay
+    // Then tear them down to return the overlay to its initial visual state
+    const animations = activeAnimations.get(overlay) || [];
+
+    animations.forEach((ani) => ani.destroy());
+
    activeAnimations.delete(overlay);

    /**
--- a/core/src/utils/test/hardware-back-button.spec.ts
+++ b/core/src/utils/test/hardware-back-button.spec.ts
@@ -1,5 +1,7 @@
 import type { BackButtonEvent } from '../../../src/interface';
 import { startHardwareBackButton } from '../hardware-back-button';
+import { config } from '../../global/config';
+import { win } from '@utils/browser';

 describe('Hardware Back Button', () => {
  beforeEach(() => startHardwareBackButton());
@@ -54,6 +56,56 @@ describe('Hardware Back Button', () => {
  });
 });

+describe('Experimental Close Watcher', () => {
+  test('should not use the Close Watcher API when available', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: false });
+
+    startHardwareBackButton();
+
+    expect(mockAPI.mock.calls).toHaveLength(0);
+  });
+  test('should use the Close Watcher API when available', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: true });
+
+    startHardwareBackButton();
+
+    expect(mockAPI.mock.calls).toHaveLength(1);
+  });
+  test('Close Watcher should dispatch ionBackButton events', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: true });
+
+    startHardwareBackButton();
+
+    const cbSpy = jest.fn();
+    document.addEventListener('ionBackButton', cbSpy);
+
+    // Call onclose on Ionic's instance of CloseWatcher
+    mockAPI.getMockImplementation()!().onclose();
+
+    expect(cbSpy).toHaveBeenCalled();
+  });
+});
+
+const mockCloseWatcher = () => {
+  const mockCloseWatcher = jest.fn();
+  mockCloseWatcher.mockReturnValue({
+    requestClose: () => null,
+    close: () => null,
+    destroy: () => null,
+    oncancel: () => null,
+    onclose: () => null,
+  });
+  (win as any).CloseWatcher = mockCloseWatcher;
+
+  return mockCloseWatcher;
+};
+
 const dispatchBackButtonEvent = () => {
  const ev = new Event('backbutton');
  document.dispatchEvent(ev);
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/docs
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "@ionic/docs",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/docs",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT"
    }
  }
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/docs",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Pre-packaged API documentation for the Ionic docs.",
  "main": "core.json",
  "types": "core.d.ts",
--- a/lerna.json
+++ b/lerna.json
@@ -4,5 +4,5 @@
    "docs",
    "packages/*"
  ],
-  "version": "7.6.7"
+  "version": "7.7.1"
 }
--- a/packages/angular-server/CHANGELOG.md
+++ b/packages/angular-server/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/angular-server
--- a/packages/angular-server/package-lock.json
+++ b/packages/angular-server/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/angular-server",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/angular-server",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/core": "^7.6.7"
+        "@ionic/core": "^7.7.1"
      },
      "devDependencies": {
        "@angular-eslint/eslint-plugin": "^14.0.0",
@@ -1060,11 +1060,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -1462,9 +1462,9 @@
      "license": "MIT"
    },
    "node_modules/@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w==",
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -7330,11 +7330,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -7581,9 +7581,9 @@
      }
    },
    "@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
    },
    "@types/estree": {
      "version": "0.0.39",
--- a/packages/angular-server/package.json
+++ b/packages/angular-server/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/angular-server",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Angular SSR Module for Ionic",
  "keywords": [
    "ionic",
@@ -62,6 +62,6 @@
  },
  "prettier": "@ionic/prettier-config",
  "dependencies": {
-    "@ionic/core": "^7.6.7"
+    "@ionic/core": "^7.7.1"
  }
 }
--- a/packages/angular/CHANGELOG.md
+++ b/packages/angular/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/angular
--- a/packages/angular/package-lock.json
+++ b/packages/angular/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/angular",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/angular",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/core": "^7.6.7",
+        "@ionic/core": "^7.7.1",
        "ionicons": "^7.0.0",
        "jsonc-parser": "^3.0.0",
        "tslib": "^2.3.0"
@@ -1407,11 +1407,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -1845,9 +1845,9 @@
      }
    },
    "node_modules/@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w==",
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -9697,11 +9697,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -9994,9 +9994,9 @@
      }
    },
    "@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
    },
    "@tootallnate/once": {
      "version": "2.0.0",
--- a/packages/angular/package.json
+++ b/packages/angular/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/angular",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Angular specific wrappers for @ionic/core",
  "keywords": [
    "ionic",
@@ -47,7 +47,7 @@
    }
  },
  "dependencies": {
-    "@ionic/core": "^7.6.7",
+    "@ionic/core": "^7.7.1",
    "ionicons": "^7.0.0",
    "jsonc-parser": "^3.0.0",
    "tslib": "^2.3.0"
--- a/packages/angular/test/README.md
+++ b/packages/angular/test/README.md
@@ -113,4 +113,6 @@ Note: You may encounter some other peer dependency issues not covered by the Ang
 7. Open `./github/workflows/build.yml` and find the `test-angular-e2e` job.
 8. Find the `apps` field under `matrix`.
 9. Add "ng14" to the `apps` field.
-10. Commit these changes and push.
+10. Open `./github/workflows/stencil-nightly.yml` and find the `test-angular-e2e` job.
+11. Repeat steps 8 and 9.
+12. Commit these changes and push.
--- a/packages/angular/test/build.sh
+++ b/packages/angular/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"

+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR

--- a/packages/react-router/CHANGELOG.md
+++ b/packages/react-router/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/react-router
--- a/packages/react-router/package-lock.json
+++ b/packages/react-router/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/react-router",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/react-router",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/react": "^7.6.7",
+        "@ionic/react": "^7.7.1",
        "tslib": "*"
      },
      "devDependencies": {
@@ -238,11 +238,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -414,11 +414,11 @@
      }
    },
    "node_modules/@ionic/react": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-7.6.6.tgz",
-      "integrity": "sha512-3J18wUMMGBS2jkTwBRWYpkXvhFYpBcLqKF9nq/9aJL55GtFbu3uAnvM8Km3LkQUYqk4ddpGQr5bvzTvhYcxMMQ==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-7.7.1.tgz",
+      "integrity": "sha512-rfTUAUSqVMzg+R1CEMclSOLwXByJ06qtRXhpyVvJetQFUUVHA8inHdULTJqKN10c0XeZr+WyapGX04IktB9WfQ==",
      "dependencies": {
-        "@ionic/core": "7.6.6",
+        "@ionic/core": "7.7.1",
        "ionicons": "^7.0.0",
        "tslib": "*"
      },
@@ -667,9 +667,9 @@
      ]
    },
    "node_modules/@stencil/core": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.11.0.tgz",
-      "integrity": "sha512-zsKhgIkTGo+s7IthitxR/MKiMS3Ck1yIypOdXr0aE6ofboKqe9NdffTcxZ0vel0wD2bZYOb6WfPMzuhRKk6+FA==",
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -4050,11 +4050,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -4156,11 +4156,11 @@
      "requires": {}
    },
    "@ionic/react": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-7.6.6.tgz",
-      "integrity": "sha512-3J18wUMMGBS2jkTwBRWYpkXvhFYpBcLqKF9nq/9aJL55GtFbu3uAnvM8Km3LkQUYqk4ddpGQr5bvzTvhYcxMMQ==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-7.7.1.tgz",
+      "integrity": "sha512-rfTUAUSqVMzg+R1CEMclSOLwXByJ06qtRXhpyVvJetQFUUVHA8inHdULTJqKN10c0XeZr+WyapGX04IktB9WfQ==",
      "requires": {
-        "@ionic/core": "7.6.6",
+        "@ionic/core": "7.7.1",
        "ionicons": "^7.0.0",
        "tslib": "*"
      }
@@ -4297,9 +4297,9 @@
      "optional": true
    },
    "@stencil/core": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.11.0.tgz",
-      "integrity": "sha512-zsKhgIkTGo+s7IthitxR/MKiMS3Ck1yIypOdXr0aE6ofboKqe9NdffTcxZ0vel0wD2bZYOb6WfPMzuhRKk6+FA=="
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ=="
    },
    "@types/estree": {
      "version": "1.0.4",
--- a/packages/react-router/package.json
+++ b/packages/react-router/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/react-router",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "React Router wrapper for @ionic/react",
  "keywords": [
    "ionic",
@@ -36,7 +36,7 @@
    "dist/"
  ],
  "dependencies": {
-    "@ionic/react": "^7.6.7",
+    "@ionic/react": "^7.7.1",
    "tslib": "*"
  },
  "peerDependencies": {
--- a/packages/react/CHANGELOG.md
+++ b/packages/react/CHANGELOG.md
@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **react:** route with redirect will mount page ([#28961](https://github.com/ionic-team/ionic-framework/issues/28961)) ([5777ce2](https://github.com/ionic-team/ionic-framework/commit/5777ce258119d2715b1326cdc103bd4ad7612bd1)), closes [#28838](https://github.com/ionic-team/ionic-framework/issues/28838)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/react
--- a/packages/react/package-lock.json
+++ b/packages/react/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/react",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/react",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/core": "^7.6.7",
+        "@ionic/core": "^7.7.1",
        "ionicons": "^7.0.0",
        "tslib": "*"
      },
@@ -811,11 +811,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -1674,9 +1674,9 @@
      }
    },
    "node_modules/@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w==",
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -12857,11 +12857,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -13453,9 +13453,9 @@
      }
    },
    "@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
    },
    "@szmarczak/http-timer": {
      "version": "4.0.6",
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/react",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "React specific wrapper for @ionic/core",
  "keywords": [
    "ionic",
@@ -39,7 +39,7 @@
    "css/"
  ],
  "dependencies": {
-    "@ionic/core": "^7.6.7",
+    "@ionic/core": "^7.7.1",
    "ionicons": "^7.0.0",
    "tslib": "*"
  },
--- a/packages/react/src/routing/PageManager.tsx
+++ b/packages/react/src/routing/PageManager.tsx
@@ -54,7 +54,13 @@ export class PageManager extends React.PureComponent<PageManagerProps> {
      this.ionPageElementRef.current.removeEventListener('ionViewWillEnter', this.ionViewWillEnterHandler);
      this.ionPageElementRef.current.removeEventListener('ionViewDidEnter', this.ionViewDidEnterHandler);
      this.ionPageElementRef.current.removeEventListener('ionViewWillLeave', this.ionViewWillLeaveHandler);
-      this.ionPageElementRef.current.removeEventListener('ionViewDidLeave', this.ionViewDidLeaveHandler);
+      /**
+       * We deliberately do not remove the `ionViewDidLeave` listener.
+       * The registered callback is used to unmount and remove the page.
+       * Removing the event listener prevents the callback from being called.
+       * The browser will automatically remove the event listener when the
+       * page element is removed from the DOM and garbage collected.
+       */
    }
  }

--- a/packages/react/test/build.sh
+++ b/packages/react/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"

+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR

--- a/packages/vue-router/CHANGELOG.md
+++ b/packages/vue-router/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/vue-router
--- a/packages/vue-router/package-lock.json
+++ b/packages/vue-router/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/vue-router",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/vue-router",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/vue": "^7.6.7"
+        "@ionic/vue": "^7.7.1"
      },
      "devDependencies": {
        "@ionic/eslint-config": "^0.3.0",
@@ -661,11 +661,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -852,11 +852,11 @@
      }
    },
    "node_modules/@ionic/vue": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.6.6.tgz",
-      "integrity": "sha512-Ct992mndUmyTKq2vBFX/3gFcyNW/QKScYydAvG0Jtl9fPHrMZ7fYj+Hk1OEuLQDbsBMH3gUXjUV0OV5pYABsEA==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.7.1.tgz",
+      "integrity": "sha512-hEfmCwuLJTH0QSiSp4jhZApOvZ3RtHBzTvN2LAD+xJ0kPPj2aAtEgR7fqp/7/7ZRbGhSZO5XTzwskQsZTS5HdQ==",
      "dependencies": {
-        "@ionic/core": "7.6.6",
+        "@ionic/core": "7.7.1",
        "ionicons": "^7.0.0"
      }
    },
@@ -1508,9 +1508,9 @@
      }
    },
    "node_modules/@stencil/core": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.11.0.tgz",
-      "integrity": "sha512-zsKhgIkTGo+s7IthitxR/MKiMS3Ck1yIypOdXr0aE6ofboKqe9NdffTcxZ0vel0wD2bZYOb6WfPMzuhRKk6+FA==",
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -7878,11 +7878,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -7993,11 +7993,11 @@
      "requires": {}
    },
    "@ionic/vue": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.6.6.tgz",
-      "integrity": "sha512-Ct992mndUmyTKq2vBFX/3gFcyNW/QKScYydAvG0Jtl9fPHrMZ7fYj+Hk1OEuLQDbsBMH3gUXjUV0OV5pYABsEA==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.7.1.tgz",
+      "integrity": "sha512-hEfmCwuLJTH0QSiSp4jhZApOvZ3RtHBzTvN2LAD+xJ0kPPj2aAtEgR7fqp/7/7ZRbGhSZO5XTzwskQsZTS5HdQ==",
      "requires": {
-        "@ionic/core": "7.6.6",
+        "@ionic/core": "7.7.1",
        "ionicons": "^7.0.0"
      }
    },
@@ -8461,9 +8461,9 @@
      }
    },
    "@stencil/core": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.11.0.tgz",
-      "integrity": "sha512-zsKhgIkTGo+s7IthitxR/MKiMS3Ck1yIypOdXr0aE6ofboKqe9NdffTcxZ0vel0wD2bZYOb6WfPMzuhRKk6+FA=="
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.1.tgz",
+      "integrity": "sha512-l7UUCEV+4Yr1i6BL2DGSQPAzM3x/V4Fx9n9Z0/gdAgX11I25xY0MnH5jbQ69ug6ms/8KUV6SouS1R7MjjM/JnQ=="
    },
    "@tootallnate/once": {
      "version": "2.0.0",
--- a/packages/vue-router/package.json
+++ b/packages/vue-router/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/vue-router",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Vue Router integration for @ionic/vue",
  "scripts": {
    "test.spec": "jest",
@@ -44,7 +44,7 @@
  },
  "homepage": "https://github.com/ionic-team/ionic#readme",
  "dependencies": {
-    "@ionic/vue": "^7.6.7"
+    "@ionic/vue": "^7.7.1"
  },
  "devDependencies": {
    "@ionic/eslint-config": "^0.3.0",
--- a/packages/vue/CHANGELOG.md
+++ b/packages/vue/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
 ## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)

 **Note:** Version bump only for package @ionic/vue
--- a/packages/vue/package-lock.json
+++ b/packages/vue/package-lock.json
@@ -1,15 +1,15 @@
 {
  "name": "@ionic/vue",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@ionic/vue",
-      "version": "7.6.7",
+      "version": "7.7.1",
      "license": "MIT",
      "dependencies": {
-        "@ionic/core": "^7.6.7",
+        "@ionic/core": "^7.7.1",
        "ionicons": "^7.0.0"
      },
      "devDependencies": {
@@ -208,11 +208,11 @@
      "dev": true
    },
    "node_modules/@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "dependencies": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      }
@@ -628,9 +628,9 @@
      ]
    },
    "node_modules/@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w==",
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg==",
      "bin": {
        "stencil": "bin/stencil"
      },
@@ -3959,11 +3959,11 @@
      "dev": true
    },
    "@ionic/core": {
-      "version": "7.6.6",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.6.tgz",
-      "integrity": "sha512-WstnLHiR8ipW2ASdO/eqSwgMHCuVvJE3qsUNPHWkup9f08/bcbKYZpOfaWNLw/ftNqEpFbjiRuocoYYyLP0/gw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.1.tgz",
+      "integrity": "sha512-Su4VFwztN8vKyHsIgHMmzQ1ZrIajNzMR7hg2fcv15Y2yrzLpK06PcUf9QutBM9KyP0wQIngwfnO68vrAnqR+xQ==",
      "requires": {
-        "@stencil/core": "^4.10.0",
+        "@stencil/core": "^4.12.0",
        "ionicons": "^7.2.2",
        "tslib": "^2.1.0"
      },
@@ -4203,9 +4203,9 @@
      "optional": true
    },
    "@stencil/core": {
-      "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.10.0.tgz",
-      "integrity": "sha512-7lDTPY1IxXN2/C+wQPHt3e/dYgY4YgelA8MxOsU3ZftXtpzWad/QNWhSAtKisJMrSjQh41jMDOgD0yLBwV6E7w=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.0.tgz",
+      "integrity": "sha512-qAQcfNmp2sdxAh1DlyUhHfDmIUS7mhI+5LAhPphg74zK9sKgFL5vpLzgjs0wohpjlmI4msgJFYiRB8lxVPqjPg=="
    },
    "@types/estree": {
      "version": "1.0.4",
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/vue",
-  "version": "7.6.7",
+  "version": "7.7.1",
  "description": "Vue specific wrapper for @ionic/core",
  "scripts": {
    "eslint": "eslint src",
@@ -66,7 +66,7 @@
    "vue-router": "^4.0.16"
  },
  "dependencies": {
-    "@ionic/core": "^7.6.7",
+    "@ionic/core": "^7.7.1",
    "ionicons": "^7.0.0"
  },
  "vetur": {
--- a/packages/vue/test/build.sh
+++ b/packages/vue/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"

+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR