fix(datetime): clear button clears the selected date (#26264)

Resolves #26258

Author: sean-perkins

core/src/components/datetime/datetime.tsx

@@ -1220,6 +1220,13 @@ export class Datetime implements ComponentInterface {
           ampm,
         };
       }
+    } else {
+      /**
+       * Reset the active parts if the value is not set.
+       * This will clear the selected calendar day when
+       * performing a clear action or using the reset() method.
+       */
+      this.activeParts = [];
     }
   };
 

core/src/components/datetime/test/basic/datetime.e2e.ts

@@ -327,3 +327,31 @@ test.describe('datetime: RTL set on component', () => {
     await expect(nextPrevIcons.last()).toHaveClass(/flip-rtl/);
   });
 });
+
+test.describe('datetime: clear button', () => {
+  test('should clear the active calendar day', async ({ page, skip }, testInfo) => {
+    skip.rtl();
+    skip.mode('md');
+
+    testInfo.annotations.push({
+      type: 'issue',
+      description: 'https://github.com/ionic-team/ionic-framework/issues/26258',
+    });
+
+    await page.setContent(`
+      <ion-datetime value="2022-11-10" show-clear-button="true"></ion-datetime>
+    `);
+
+    await page.waitForSelector('.datetime-ready');
+
+    const selectedDay = page.locator('ion-datetime .calendar-day-active');
+
+    await expect(selectedDay).toHaveText('10');
+
+    await page.click('ion-datetime #clear-button');
+
+    await page.waitForChanges();
+
+    await expect(selectedDay).toHaveCount(0);
+  });
+});