mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
fix(datetime): closing time picker no longer changes month (#25478)
resolves #25438
This commit is contained in:
@ -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(`
|
||||
<ion-datetime></ion-datetime>
|
||||
`);
|
||||
|
||||
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();
|
||||
|
@ -84,7 +84,6 @@ export const createOverlay = <T extends HTMLIonOverlayElement>(
|
||||
|
||||
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();
|
||||
|
Reference in New Issue
Block a user