diff --git a/core/src/components/datetime/test/cancel/datetime.e2e.ts b/core/src/components/datetime/test/cancel/datetime.e2e.ts
new file mode 100644
index 0000000000..a2a9ab1f3d
--- /dev/null
+++ b/core/src/components/datetime/test/cancel/datetime.e2e.ts
@@ -0,0 +1,69 @@
+import { configs, test } from '@utils/test/playwright';
+import { expect } from '@playwright/test';
+
+configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => {
+ test.describe.only(title('datetime: cancel method'), () => {
+ test('should emit ionCancel', async ({ page }) => {
+ await page.setContent(
+ `
+
+ `,
+ config
+ );
+
+ const ionCancel = await page.spyOnEvent('ionCancel');
+ const datetime = page.locator('ion-datetime');
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.cancel());
+
+ await ionCancel.next();
+ });
+
+ test('parent overlay should be dismissed when true is passed', async ({ page }) => {
+ await page.setContent(
+ `
+
+
+
+ `,
+ config
+ );
+
+ const ionModalDidPresent = await page.spyOnEvent('ionModalDidPresent');
+ const ionModalDidDismiss = await page.spyOnEvent('ionModalDidDismiss');
+
+ const datetime = page.locator('ion-datetime');
+ const modal = page.locator('ion-modal');
+
+ await modal.evaluate((el: HTMLIonModalElement) => el.present());
+
+ await ionModalDidPresent.next();
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.cancel(true));
+
+ await ionModalDidDismiss.next();
+ });
+
+ test('should reset the internal state of datetime', async ({ page }) => {
+ await page.setContent(
+ `
+
+ `,
+ config
+ );
+
+ const datetime = page.locator('ion-datetime');
+
+ const day = datetime.locator('.calendar-day[data-month="6"][data-day="1"][data-year="2023"]');
+ await day.click();
+ await page.waitForChanges();
+
+ await expect(day).toHaveClass(/calendar-day-active/);
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.cancel());
+ await page.waitForChanges();
+
+ await expect(day).not.toHaveClass(/calendar-day-active/);
+ });
+ });
+});
diff --git a/core/src/components/datetime/test/reset/datetime.e2e.ts b/core/src/components/datetime/test/reset/datetime.e2e.ts
new file mode 100644
index 0000000000..0cc207ec37
--- /dev/null
+++ b/core/src/components/datetime/test/reset/datetime.e2e.ts
@@ -0,0 +1,100 @@
+import { configs, test } from '@utils/test/playwright';
+import { expect } from '@playwright/test';
+
+configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => {
+ test.describe.only(title('datetime: reset method'), () => {
+ test('should reset the internal state of datetime to the set value', async ({ page }) => {
+ await page.setContent(
+ `
+
+ `,
+ config
+ );
+
+ const datetime = page.locator('ion-datetime');
+
+ const dayOne = datetime.locator('.calendar-day[data-month="6"][data-day="1"][data-year="2023"]');
+ const daySix = datetime.locator('.calendar-day[data-month="6"][data-day="6"][data-year="2023"]');
+ await dayOne.click();
+ await page.waitForChanges();
+
+ await expect(dayOne).toHaveClass(/calendar-day-active/);
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.reset());
+ await page.waitForChanges();
+
+ await expect(daySix).toHaveClass(/calendar-day-active/);
+ });
+
+ test('should reset the internal state of datetime to the provided value', async ({ page }) => {
+ await page.setContent(
+ `
+
+
+
+ `,
+ config
+ );
+
+ const datetime = page.locator('ion-datetime');
+
+ const dayOne = datetime.locator('.calendar-day[data-month="6"][data-day="1"][data-year="2023"]');
+ const daySix = datetime.locator('.calendar-day[data-month="6"][data-day="6"][data-year="2023"]');
+ await dayOne.click();
+ await page.waitForChanges();
+
+ await expect(dayOne).toHaveClass(/calendar-day-active/);
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.reset('2023-06-06T16:30'));
+ await page.waitForChanges();
+
+ await expect(daySix).toHaveClass(/calendar-day-active/);
+ });
+
+ test('should reset the internal state of datetime to today when value is set or passed', async ({ page }) => {
+ await page.setContent(
+ `
+
+
+
+ `,
+ config
+ );
+
+ const datetime = page.locator('ion-datetime');
+
+ const dayOne = datetime.locator('.calendar-day[data-month="6"][data-day="1"][data-year="2023"]');
+ await dayOne.click();
+ await page.waitForChanges();
+
+ await expect(dayOne).toHaveClass(/calendar-day-active/);
+
+ await datetime.evaluate((el: HTMLIonDatetimeElement) => el.reset());
+ await page.waitForChanges();
+
+ await expect(await datetime.locator('.calendar-day-active').count()).toBe(0);
+ });
+ });
+});