diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts b/core/src/components/datetime/test/basic/datetime.e2e.ts
index e884249a74..aac79a479f 100644
--- a/core/src/components/datetime/test/basic/datetime.e2e.ts
+++ b/core/src/components/datetime/test/basic/datetime.e2e.ts
@@ -2,6 +2,35 @@ import { expect } from '@playwright/test';
import type { E2EPage } from '@utils/test/playwright';
import { test } from '@utils/test/playwright';
+test.describe('datetime: closing time popover', () => {
+ test('it should not change months', async ({ page }) => {
+ test.info().annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/25438',
+ });
+
+ await page.setContent(`
+
+ `);
+
+ const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
+ const ionPopoverDidDismiss = await page.spyOnEvent('ionPopoverDidDismiss');
+ const timeButton = page.locator('.time-body');
+ const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
+ const currentMonthAndYear = await calendarMonthYear.evaluate((el: HTMLElement) => el.innerText);
+
+ await timeButton.click();
+ await ionPopoverDidPresent.next();
+
+ await page.keyboard.press('Escape');
+
+ await ionPopoverDidDismiss.next();
+ await page.waitForChanges();
+
+ expect(calendarMonthYear).toHaveText(currentMonthAndYear);
+ });
+});
+
test.describe('datetime: selecting a day', () => {
const testHighlight = async (page: E2EPage, datetimeID: string) => {
const today = new Date();
diff --git a/core/src/utils/overlays.ts b/core/src/utils/overlays.ts
index 48be57b788..5233f292b6 100644
--- a/core/src/utils/overlays.ts
+++ b/core/src/utils/overlays.ts
@@ -84,7 +84,6 @@ export const createOverlay = (
const focusableQueryString =
'[tabindex]:not([tabindex^="-"]), input:not([type=hidden]):not([tabindex^="-"]), textarea:not([tabindex^="-"]), button:not([tabindex^="-"]), select:not([tabindex^="-"]), .ion-focusable:not([tabindex^="-"])';
-const innerFocusableQueryString = 'input:not([type=hidden]), textarea, button, select';
export const focusFirstDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
let firstInput = ref.querySelector(focusableQueryString) as HTMLElement | null;
@@ -92,7 +91,7 @@ export const focusFirstDescendant = (ref: Element, overlay: HTMLIonOverlayElemen
const shadowRoot = firstInput?.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
- firstInput = shadowRoot.querySelector(innerFocusableQueryString) || firstInput;
+ firstInput = shadowRoot.querySelector(focusableQueryString) || firstInput;
}
if (firstInput) {
@@ -112,7 +111,7 @@ const focusLastDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
const shadowRoot = lastInput?.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
- lastInput = shadowRoot.querySelector(innerFocusableQueryString) || lastInput;
+ lastInput = shadowRoot.querySelector(focusableQueryString) || lastInput;
}
if (lastInput) {
@@ -460,7 +459,7 @@ const focusPreviousElementOnDismiss = async (overlayEl: any) => {
const shadowRoot = previousElement?.shadowRoot;
if (shadowRoot) {
// If there are no inner focusable elements, just focus the host element.
- previousElement = shadowRoot.querySelector(innerFocusableQueryString) || previousElement;
+ previousElement = shadowRoot.querySelector(focusableQueryString) || previousElement;
}
await overlayEl.onDidDismiss();