diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index b0b54c2ac62..f6abf07b8d5 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -1963,10 +1963,13 @@ export class Datetime implements ComponentInterface {
month: ev.detail.value,
});
- this.setActiveParts({
- ...activePart,
- month: ev.detail.value,
- });
+ // Month wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
+ if (!this.multiple) {
+ this.setActiveParts({
+ ...activePart,
+ month: ev.detail.value,
+ });
+ }
ev.stopPropagation();
}}
@@ -2007,10 +2010,13 @@ export class Datetime implements ComponentInterface {
year: ev.detail.value,
});
- this.setActiveParts({
- ...activePart,
- year: ev.detail.value,
- });
+ // Year wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
+ if (!this.multiple) {
+ this.setActiveParts({
+ ...activePart,
+ year: ev.detail.value,
+ });
+ }
ev.stopPropagation();
}}
diff --git a/core/src/components/datetime/test/multiple/datetime.e2e.ts b/core/src/components/datetime/test/multiple/datetime.e2e.ts
index 55a386f6f27..22fada77bda 100644
--- a/core/src/components/datetime/test/multiple/datetime.e2e.ts
+++ b/core/src/components/datetime/test/multiple/datetime.e2e.ts
@@ -337,3 +337,124 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
});
});
});
+
+configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
+ test.describe(
+ title('datetime: interaction between month/year wheels and selected date(s) with different values of multiple'),
+ () => {
+ test('using month wheel should change selection when multiple=false', async ({ page }, testInfo) => {
+ testInfo.annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/29673',
+ });
+
+ await page.setContent(``, config);
+ const datetime = page.locator('ion-datetime');
+
+ await page.waitForSelector('.datetime-ready');
+
+ const dropdownButton = page.locator('.calendar-month-year-toggle');
+ await dropdownButton.click();
+ await page.waitForChanges();
+
+ const monthOption = page.locator('.month-column ion-picker-column-option').nth(0);
+ await monthOption.click();
+ await page.waitForChanges();
+
+ await expect(datetime).toHaveJSProperty('value', '2026-01-26T10:36:00');
+ });
+
+ test('using month wheel should not change selection when multiple=true', async ({ page }, testInfo) => {
+ testInfo.annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/29673',
+ });
+
+ await page.setContent(
+ `
+
+
+ `,
+ config
+ );
+ const datetime = page.locator('ion-datetime');
+
+ await page.waitForSelector('.datetime-ready');
+
+ const dropdownButton = page.locator('.calendar-month-year-toggle');
+ await dropdownButton.click();
+ await page.waitForChanges();
+
+ const monthOption = page.locator('.month-column ion-picker-column-option').nth(0);
+ await monthOption.click();
+ await page.waitForChanges();
+
+ await expect(datetime).toHaveJSProperty('value', [
+ '2026-06-26T10:36:00',
+ '2026-06-28T10:36:00',
+ '2026-01-01T10:36:00',
+ ]);
+ });
+
+ test('using year wheel should change selection when multiple=false', async ({ page }, testInfo) => {
+ testInfo.annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/29673',
+ });
+
+ await page.setContent(``, config);
+ const datetime = page.locator('ion-datetime');
+
+ await page.waitForSelector('.datetime-ready');
+
+ const dropdownButton = page.locator('.calendar-month-year-toggle');
+ await dropdownButton.click();
+ await page.waitForChanges();
+
+ const yearOption = page.locator('.year-column ion-picker-column-option').nth(0);
+ await yearOption.click();
+ await page.waitForChanges();
+
+ await expect(datetime).toHaveJSProperty('value', '1926-06-26T10:36:00');
+ });
+
+ test('using year wheel should not change selection when multiple=true', async ({ page }, testInfo) => {
+ testInfo.annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/29673',
+ });
+
+ await page.setContent(
+ `
+
+
+ `,
+ config
+ );
+ const datetime = page.locator('ion-datetime');
+
+ await page.waitForSelector('.datetime-ready');
+
+ const dropdownButton = page.locator('.calendar-month-year-toggle');
+ await dropdownButton.click();
+ await page.waitForChanges();
+
+ const yearOption = page.locator('.year-column ion-picker-column-option').nth(0);
+ await yearOption.click();
+ await page.waitForChanges();
+
+ await expect(datetime).toHaveJSProperty('value', [
+ '2026-06-26T10:36:00',
+ '2026-06-28T10:36:00',
+ '2026-01-01T10:36:00',
+ ]);
+ });
+ }
+ );
+});