diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
index f715831465..7a8d6527b5 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.yml
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -21,6 +21,7 @@ body:
         - label: v4.x
         - label: v5.x
         - label: v6.x
+        - label: Nightly
   - type: textarea
     attributes:
       label: Current Behavior
diff --git a/.github/workflows/nightly.yml b/.github/workflows/nightly.yml
new file mode 100644
index 0000000000..39096fd906
--- /dev/null
+++ b/.github/workflows/nightly.yml
@@ -0,0 +1,60 @@
+name: 'Ionic Nightly Build'
+
+on:
+  schedule:
+    # Run every Monday-Friday
+    # at 6:00 UTC (6:00 am UTC)
+    - cron: '00 06 * * 1-5'
+
+jobs:
+  nightly-build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - uses: actions/setup-node@v2
+        with:
+          node-version: 16
+      - name: Install Dependencies
+        run: npm ci --no-package-lock && lerna bootstrap --ignore-scripts -- --legacy-peer-deps
+        shell: bash
+      - name: Prepare NPM Token
+        run: echo //registry.npmjs.org/:_authToken=${NPM_TOKEN} > .npmrc
+        shell: bash
+        env:
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      - name: Configure Identity
+        run: |
+          git config user.name github-actions
+          git config user.email github-actions@github.com
+      # A 1 is required before the timestamp
+      # as lerna will fail when there is a leading 0
+      # See https://github.com/lerna/lerna/issues/2840
+      - name: Create Nightly Hash
+        # The date should output YYYYMMDD
+        # so that it is human readable
+        run: |
+          echo "DATE=$(date +%Y%m%d)" >> $GITHUB_ENV
+          echo "CURRENT_VERSION=$(node ./.scripts/bump-version.js)" >> $GITHUB_ENV
+        shell: bash
+      - name: Checkout Nightly Branch
+        run: |
+          git checkout -b nightly-$(echo "${{ env.DATE }}")
+          git push origin nightly-$(echo "${{ env.DATE }}")
+        shell: bash
+      - name: Create Nightly Build
+        run: |
+          HUSKY_SKIP_HOOKS=1 lerna publish $(echo "${{ env.CURRENT_VERSION }}")-nightly.$(echo "${{ env.DATE }}") --no-verify-access --yes --force-publish='*' --dist-tag nightly --conventional-commits --conventional-prerelease --exact --create-release github
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+      # We need to push the commit changes in order for the tags
+      # to get updated, but we don't need to keep the changelog
+      # changes around.
+      - name: Delete Nightly Branch
+        run: |
+          git checkout main
+          git branch -D nightly-$(echo "${{ env.DATE }}")
+          git push origin --delete nightly-$(echo "${{ env.DATE }}")
+        shell: bash
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0cc3f95650..37ec0df8c8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic-framework/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+
+### Bug Fixes
+
+* **datetime:** time picker display matches dynamically set value ([#25010](https://github.com/ionic-team/ionic-framework/issues/25010)) ([11493a0](https://github.com/ionic-team/ionic-framework/commit/11493a086a4e3f2a4e9d3acdf5a9d49e810a5ef0)), closes [#24967](https://github.com/ionic-team/ionic-framework/issues/24967)
+* **modal:** add canDismiss option to modal options ([#25144](https://github.com/ionic-team/ionic-framework/issues/25144)) ([2984ddf](https://github.com/ionic-team/ionic-framework/commit/2984ddf111b6acbd9e47ed90830b6522179b6cee)), closes [#25143](https://github.com/ionic-team/ionic-framework/issues/25143)
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic-framework/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 
diff --git a/angular/CHANGELOG.md b/angular/CHANGELOG.md
index 02e573273f..9142bf0b30 100644
--- a/angular/CHANGELOG.md
+++ b/angular/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/angular
diff --git a/angular/package-lock.json b/angular/package-lock.json
index 9f2d797221..71ee68ce0e 100644
--- a/angular/package-lock.json
+++ b/angular/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/angular/package.json b/angular/package.json
index e8b3e5475c..9569f13ad9 100644
--- a/angular/package.json
+++ b/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Angular specific wrappers for @ionic/core",
   "keywords": [
     "ionic",
@@ -44,7 +44,7 @@
     "validate": "npm i && npm run lint && npm run test && npm run build"
   },
   "dependencies": {
-    "@ionic/core": "^6.1.1",
+    "@ionic/core": "^6.1.2",
     "jsonc-parser": "^3.0.0",
     "tslib": "^2.0.0"
   },
diff --git a/core/CHANGELOG.md b/core/CHANGELOG.md
index 747f0ba634..59b8a73cfd 100644
--- a/core/CHANGELOG.md
+++ b/core/CHANGELOG.md
@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+
+### Bug Fixes
+
+* **datetime:** time picker display matches dynamically set value ([#25010](https://github.com/ionic-team/ionic/issues/25010)) ([11493a0](https://github.com/ionic-team/ionic/commit/11493a086a4e3f2a4e9d3acdf5a9d49e810a5ef0)), closes [#24967](https://github.com/ionic-team/ionic/issues/24967)
+* **modal:** add canDismiss option to modal options ([#25144](https://github.com/ionic-team/ionic/issues/25144)) ([2984ddf](https://github.com/ionic-team/ionic/commit/2984ddf111b6acbd9e47ed90830b6522179b6cee)), closes [#25143](https://github.com/ionic-team/ionic/issues/25143)
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 
diff --git a/core/package-lock.json b/core/package-lock.json
index 9a6e821adb..fd51eee0f2 100644
--- a/core/package-lock.json
+++ b/core/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/core/package.json b/core/package.json
index 217747749a..d55ac94241 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",
diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index 2afc860b16..c1200432a0 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -317,6 +317,8 @@ export class Datetime implements ComponentInterface {
       const valueDateParts = parseDate(this.value);
       if (valueDateParts) {
         const { month, day, year, hour, minute } = valueDateParts;
+        const ampm = hour >= 12 ? 'pm' : 'am';
+
         this.activePartsClone = {
           ...this.activeParts,
           month,
@@ -324,7 +326,17 @@ export class Datetime implements ComponentInterface {
           year,
           hour,
           minute,
+          ampm,
         };
+
+        /**
+         * The working parts am/pm value must be updated when the value changes, to
+         * ensure the time picker hour column values are generated correctly.
+         */
+        this.setWorkingParts({
+          ...this.workingParts,
+          ampm,
+        });
       } else {
         printIonWarning(`Unable to parse date string: ${this.value}. Please provide a valid ISO 8601 datetime string.`);
       }
@@ -1049,7 +1061,7 @@ export class Datetime implements ComponentInterface {
     const valueToProcess = value || getToday();
     const { month, day, year, hour, minute, tzOffset } = parseDate(valueToProcess);
 
-    this.workingParts = {
+    this.setWorkingParts({
       month,
       day,
       year,
@@ -1057,7 +1069,7 @@ export class Datetime implements ComponentInterface {
       minute,
       tzOffset,
       ampm: hour >= 12 ? 'pm' : 'am',
-    };
+    });
 
     this.activeParts = {
       month,
@@ -1628,7 +1640,7 @@ export class Datetime implements ComponentInterface {
     const timeOnlyPresentation = presentation === 'time';
     const use24Hour = is24Hour(this.locale, this.hourCycle);
     const { hours, minutes, am, pm } = generateTime(
-      this.workingParts,
+      workingParts,
       use24Hour ? 'h23' : 'h12',
       this.minParts,
       this.maxParts,
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts b/core/src/components/datetime/test/presentation/datetime.e2e.ts
new file mode 100644
index 0000000000..94ad22e9c4
--- /dev/null
+++ b/core/src/components/datetime/test/presentation/datetime.e2e.ts
@@ -0,0 +1,112 @@
+import type { Locator } from '@playwright/test';
+import { expect } from '@playwright/test';
+import type { E2EPage } from '@utils/test/playwright';
+import { test } from '@utils/test/playwright';
+
+test.describe('datetime: presentation', () => {
+  test('should not have visual regressions', async ({ page }) => {
+    await page.goto(`/src/components/datetime/test/presentation`);
+
+    await page.setIonViewport();
+
+    const compares = [];
+    const presentations = ['date-time', 'time-date', 'time', 'date', 'month-year', 'month', 'year'];
+
+    for (const presentation of presentations) {
+      await page.locator('select').selectOption(presentation);
+      await page.waitForChanges();
+      compares.push({
+        presentation,
+        screenshot: await page.screenshot({ fullPage: true }),
+      });
+    }
+
+    for (const compare of compares) {
+      expect(compare.screenshot).toMatchSnapshot(
+        `datetime-presentation-${compare.presentation}-diff-${page.getSnapshotSettings()}.png`
+      );
+    }
+  });
+});
+
+test.describe('datetime: presentation: time', () => {
+  let timePickerFixture: TimePickerFixture;
+
+  test.beforeEach(async ({ page }) => {
+    timePickerFixture = new TimePickerFixture(page);
+    await timePickerFixture.goto();
+  });
+
+  test('changing value from AM to AM should update the text', async () => {
+    await timePickerFixture.setValue('04:20:00');
+    await timePickerFixture.expectTime('4', '20', 'AM');
+
+    await timePickerFixture.setValue('11:03:00');
+    await timePickerFixture.expectTime('11', '03', 'AM');
+  });
+
+  test('changing value from AM to PM should update the text', async () => {
+    await timePickerFixture.setValue('05:30:00');
+    await timePickerFixture.expectTime('5', '30', 'AM');
+
+    await timePickerFixture.setValue('16:40:00');
+    await timePickerFixture.expectTime('4', '40', 'PM');
+  });
+
+  test('changing the value from PM to AM should update the text', async () => {
+    await timePickerFixture.setValue('16:40:00');
+    await timePickerFixture.expectTime('4', '40', 'PM');
+
+    await timePickerFixture.setValue('04:20:00');
+    await timePickerFixture.expectTime('4', '20', 'AM');
+  });
+
+  test('changing the value from PM to PM should update the text', async () => {
+    await timePickerFixture.setValue('16:40:00');
+    await timePickerFixture.expectTime('4', '40', 'PM');
+
+    await timePickerFixture.setValue('19:32:00');
+    await timePickerFixture.expectTime('7', '32', 'PM');
+  });
+});
+
+class TimePickerFixture {
+  readonly page: E2EPage;
+
+  private timePicker!: Locator;
+
+  constructor(page: E2EPage) {
+    this.page = page;
+  }
+
+  async goto() {
+    await this.page.goto(`/src/components/datetime/test/presentation`);
+    await this.page.locator('select').selectOption('time');
+    await this.page.waitForSelector('.datetime-presentation-time');
+    this.timePicker = this.page.locator('ion-datetime');
+  }
+
+  async setValue(value: string) {
+    const ionChange = await this.page.spyOnEvent('ionChange');
+    await this.timePicker.evaluate((el: HTMLIonDatetimeElement, newValue: string) => {
+      el.value = newValue;
+    }, value);
+
+    await ionChange.next();
+
+    // Changing the value can take longer than the default 100ms to repaint
+    await this.page.waitForChanges(300);
+  }
+
+  async expectTime(hour: string, minute: string, ampm: string) {
+    expect(
+      await this.timePicker.locator('ion-picker-column-internal:nth-child(1) .picker-item-active').textContent()
+    ).toBe(hour);
+    expect(
+      await this.timePicker.locator('ion-picker-column-internal:nth-child(2) .picker-item-active').textContent()
+    ).toBe(minute);
+    expect(
+      await this.timePicker.locator('ion-picker-column-internal:nth-child(3) .picker-item-active').textContent()
+    ).toBe(ampm);
+  }
+}
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..51dd61beb6
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7aed4004bd
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..c9f2e7b2f2
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..2bea18dc17
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..83c2f6ff86
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..1a8115a5a8
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..8df46a9b4a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..6b3bd3f362
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..7ca78d161e
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..3e6e1c42ef
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..0422314df6
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..82bb40a6de
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..fe278c6e0f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..1e1890faa0
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..694ee855af
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6ee29b03f5
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..1042183977
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..fc687d8b8b
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..92b2d9502c
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..93ffe1d325
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..16cd4e8960
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..e329d13655
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..8bb84e6636
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..dce0e44438
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..d341b579f9
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..7d1196a364
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..60edcde7ca
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..a80867db63
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..2e5e6d9564
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..d5855e2459
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..8037d91c3f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5f0a594591
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..97cf092736
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..44423f4b06
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..298f488450
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..75d9fc97ba
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..82a799d264
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..d75548ea7d
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..fde72affb7
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..31b685e527
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-date-time-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..c3a682fc63
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..3698e0200f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..0cde0c40ec
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..915a6c48fb
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..0052c7d955
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..40e1e2af63
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..783ade0f4f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..2c8c9d847c
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..eccf74104d
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..b80527e680
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..fb8ce576a5
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..928ce449d5
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..415d5ed807
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..eb8d76c511
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..299003433f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..912e7ebe16
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7a0f371026
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..56823ec66a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..4381116d22
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..57850a445d
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..bcef14ad58
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..66e060a338
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..21c0c04b59
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..c7f474f911
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..29e3e78932
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..4835bc2cee
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..855b39e356
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..fd96ee7ad0
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..ee78895125
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..83d9ace509
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..9dd88fee55
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..adaad93054
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..eff01b2eb1
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..06454c98bd
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..2b93778f14
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..dd65f4b00f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..80be057cdc
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..5837379165
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..5a6eeae1dc
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..cb6832e4ef
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-month-year-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..35e1ddfd3c
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..f558aa381a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..ea00599517
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..7e66961ffd
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..e889c1b560
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..dd11ee01a6
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..8e22ee12ec
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..d801f7e431
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..3652d6b666
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..8699a549a1
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..03db8a1975
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..d3bb0a0a2c
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..205051b2af
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..a395dc15ef
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..5f3382ba32
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..aee8905bad
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..c39cf4363d
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..11e928ca48
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..a6ce5a218a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..ce9b6ac61f
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-date-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..5f28503b0a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..3aed5d7fba
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..78529de553
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..e4e3853998
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..dccd01ab13
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..7d2786e9f4
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..28b3f67d1e
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..d13f02e062
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..3c86f9e148
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..03eea96d57
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..c49501d2bb
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..b7a1a5a604
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..4138c15405
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..b4584ddccb
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..0362eb6bcf
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..1ed3bc8e39
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..246fb1cdd4
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..f32f32448a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..2b8abdc2a5
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..9797994dbb
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-time-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..cd182a049a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..dbfe5c1dc2
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-chromium-linux.png
new file mode 100644
index 0000000000..c4ad12e1cc
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-firefox-linux.png
new file mode 100644
index 0000000000..bd05494473
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-webkit-linux.png
new file mode 100644
index 0000000000..34188b821e
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..04b6ec5ca0
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..e6d20f93cf
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-chromium-linux.png
new file mode 100644
index 0000000000..744b035db2
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-firefox-linux.png
new file mode 100644
index 0000000000..0d889cd10b
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-webkit-linux.png
new file mode 100644
index 0000000000..7984fca0c1
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-ios-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..897fae965a
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..80114f7998
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-chromium-linux.png
new file mode 100644
index 0000000000..6fce599210
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-firefox-linux.png
new file mode 100644
index 0000000000..8ea1b6949b
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-webkit-linux.png
new file mode 100644
index 0000000000..a67aba9908
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-ltr-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..da7906dd09
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..bc13f3ea67
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-chromium-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-chromium-linux.png
new file mode 100644
index 0000000000..458db44df7
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-chromium-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-firefox-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-firefox-linux.png
new file mode 100644
index 0000000000..58006c9de0
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-firefox-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-webkit-linux.png b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-webkit-linux.png
new file mode 100644
index 0000000000..2e6cdc1fed
Binary files /dev/null and b/core/src/components/datetime/test/presentation/datetime.e2e.ts-snapshots/datetime-presentation-year-diff-md-rtl-webkit-linux.png differ
diff --git a/core/src/components/datetime/test/presentation/e2e.ts b/core/src/components/datetime/test/presentation/e2e.ts
deleted file mode 100644
index 69bc0168b8..0000000000
--- a/core/src/components/datetime/test/presentation/e2e.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import type { E2EPage } from '@stencil/core/testing';
-import { newE2EPage } from '@stencil/core/testing';
-
-test('presentation', async () => {
-  const page = await newE2EPage({
-    url: '/src/components/datetime/test/presentation?ionic:_testing=true',
-  });
-
-  const screenshotCompares = [];
-
-  screenshotCompares.push(await page.compareScreenshot());
-
-  for (const screenshotCompare of screenshotCompares) {
-    expect(screenshotCompare).toMatchScreenshot();
-  }
-});
-
-describe('presentation: time', () => {
-  let page: E2EPage;
-
-  beforeEach(async () => {
-    page = await newE2EPage({
-      url: '/src/components/datetime/test/presentation?ionic:_testing=true',
-    });
-  });
-
-  describe('when the time picker is visible in the view', () => {
-    it('manually setting the value should emit ionChange once', async () => {
-      const datetime = await page.find('ion-datetime[presentation="time"]');
-      const didChange = await datetime.spyOnEvent('ionChange');
-
-      await page.$eval('ion-datetime[presentation="time"]', (el: any) => {
-        el.scrollIntoView();
-      });
-
-      await page.$eval('ion-datetime[presentation="time"]', (el: any) => {
-        el.value = '06:02:40';
-      });
-
-      await page.waitForChanges();
-
-      expect(didChange).toHaveReceivedEventTimes(1);
-      expect(didChange).toHaveReceivedEventDetail({ value: '06:02:40' });
-    });
-  });
-});
diff --git a/core/src/components/datetime/test/presentation/index.html b/core/src/components/datetime/test/presentation/index.html
index a06f704c61..0a81bb3960 100644
--- a/core/src/components/datetime/test/presentation/index.html
+++ b/core/src/components/datetime/test/presentation/index.html
@@ -9,73 +9,45 @@
     <script src="../../../../../scripts/testing/scripts.js"></script>
     <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
     <style>
-      .grid {
-        display: grid;
-        grid-template-columns: repeat(3, minmax(250px, 1fr));
-        grid-gap: 60px 20px;
-      }
-      h2 {
-        font-size: 12px;
-        font-weight: normal;
-
-        color: #6f7378;
-
-        margin-top: 10px;
-        margin-left: 5px;
-      }
-
-      @media screen and (max-width: 800px) {
-        .grid {
-          grid-template-columns: 1fr;
-          padding: 0;
-        }
-      }
-
       ion-datetime {
         box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.25), 0px 8px 16px rgba(0, 0, 0, 0.25);
         border-radius: 8px;
       }
     </style>
   </head>
+
   <body>
     <ion-app>
       <ion-header translucent="true">
         <ion-toolbar>
           <ion-title>Datetime - Presentation</ion-title>
         </ion-toolbar>
+        <ion-toolbar>
+          <select class="ion-margin-end" slot="end">
+            <option value="date-time">date-time</option>
+            <option value="time-date">time-date</option>
+            <option value="time">time</option>
+            <option value="date">date</option>
+            <option value="month-year">month-year</option>
+            <option value="month">month</option>
+            <option value="year">year</option>
+          </select>
+        </ion-toolbar>
       </ion-header>
       <ion-content class="ion-padding">
-        <div class="grid">
-          <div class="grid-item">
-            <h2>date-time</h2>
-            <ion-datetime presentation="date-time"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>time-date</h2>
-            <ion-datetime presentation="time-date"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>time</h2>
-            <ion-datetime presentation="time"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>date</h2>
-            <ion-datetime presentation="date"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>month-year</h2>
-            <ion-datetime presentation="month-year"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>month</h2>
-            <ion-datetime presentation="month"></ion-datetime>
-          </div>
-          <div class="grid-item">
-            <h2>year</h2>
-            <ion-datetime presentation="year"></ion-datetime>
-          </div>
-        </div>
+        <ion-datetime presentation="date-time"></ion-datetime>
       </ion-content>
     </ion-app>
+    <script>
+      const datetime = document.querySelector('ion-datetime');
+      const select = document.querySelector('select');
+
+      datetime.value = '2022-03-10T13:00:00';
+
+      select.addEventListener('change', (ev) => {
+        const presentation = ev.target.value;
+        datetime.presentation = presentation;
+      });
+    </script>
   </body>
 </html>
diff --git a/core/src/components/datetime/test/set-value/e2e.ts b/core/src/components/datetime/test/set-value/e2e.ts
index 9c52340e1f..9649384cee 100644
--- a/core/src/components/datetime/test/set-value/e2e.ts
+++ b/core/src/components/datetime/test/set-value/e2e.ts
@@ -1,11 +1,16 @@
+import type { E2EPage } from '@stencil/core/testing';
 import { newE2EPage } from '@stencil/core/testing';
 
 describe('datetime: setting the value', () => {
-  it('should update the active date', async () => {
-    const page = await newE2EPage({
+  let page: E2EPage;
+
+  beforeEach(async () => {
+    page = await newE2EPage({
       url: '/src/components/datetime/test/set-value?ionic:_testing=true',
     });
+  });
 
+  it('should update the active date', async () => {
     await page.$eval('ion-datetime', (elm: any) => {
       elm.value = '2021-11-25T12:40:00.000Z';
     });
@@ -18,10 +23,6 @@ describe('datetime: setting the value', () => {
   });
 
   it('should update the active time', async () => {
-    const page = await newE2EPage({
-      url: '/src/components/datetime/test/set-value?ionic:_testing=true',
-    });
-
     await page.$eval('ion-datetime', (elm: any) => {
       elm.value = '2021-11-25T12:40:00.000Z';
     });
diff --git a/core/src/components/modal/modal-interface.ts b/core/src/components/modal/modal-interface.ts
index 7e693f1667..5c67ddc3ed 100644
--- a/core/src/components/modal/modal-interface.ts
+++ b/core/src/components/modal/modal-interface.ts
@@ -9,7 +9,12 @@ export interface ModalOptions<T extends ComponentRef = ComponentRef> {
   cssClass?: string | string[];
   delegate?: FrameworkDelegate;
   animated?: boolean;
+  /**
+ * If `true`, the modal can be swiped to dismiss. Only applies in iOS mode.
+ * @deprecated - To prevent modals from dismissing, use canDismiss instead.
+ */
   swipeToClose?: boolean;
+  canDismiss?: boolean | (() => Promise<boolean>);
 
   mode?: Mode;
   keyboardClose?: boolean;
diff --git a/core/src/components/popover/test/basic/e2e.ts b/core/src/components/popover/test/basic/e2e.ts
index 190fc6c14b..5ab79e6ed5 100644
--- a/core/src/components/popover/test/basic/e2e.ts
+++ b/core/src/components/popover/test/basic/e2e.ts
@@ -10,7 +10,7 @@ const DIRECTORY = 'basic';
  * to wait for the requestAnimationFrame to fire.
  */
 const expectActiveElementTextToEqual = async (page: E2EPage, textValue: string) => {
-  await page.evaluate((text) => document.activeElement!.textContent === text, textValue)
+  await page.evaluate((text) => document.activeElement!.textContent === text, textValue);
 };
 
 const getActiveElementSelectionStart = (page: E2EPage) => {
@@ -104,7 +104,6 @@ test('popover: htmlAttributes', async () => {
 });
 
 describe('popover: focus trap', () => {
-
   it('should focus the first ion-item on ArrowDown', async () => {
     const page = await newE2EPage({ url: '/src/components/popover/test/basic?ionic:_testing=true' });
 
diff --git a/core/src/components/popover/test/basic/index.html b/core/src/components/popover/test/basic/index.html
index 5ffefb9577..d29c3800b1 100644
--- a/core/src/components/popover/test/basic/index.html
+++ b/core/src/components/popover/test/basic/index.html
@@ -1,91 +1,147 @@
 <!DOCTYPE html>
 <html lang="en" dir="ltr">
+  <head>
+    <meta charset="UTF-8" />
+    <title>Popover - Basic</title>
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
+    />
+    <link href="../../../../../css/ionic.bundle.css" rel="stylesheet" />
+    <link href="../../../../../scripts/testing/styles.css" rel="stylesheet" />
+    <script src="../../../../../scripts/testing/scripts.js"></script>
+    <script nomodule src="../../../../../dist/ionic/ionic.js"></script>
+    <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
+  </head>
+  <script type="module">
+    import { popoverController } from '../../../../dist/ionic/index.esm.js';
+    window.popoverController = popoverController;
+  </script>
 
-<head>
-  <meta charset="UTF-8">
-  <title>Popover - Basic</title>
-  <meta name="viewport"
-    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
-  <link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
-  <link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
-  <script src="../../../../../scripts/testing/scripts.js"></script>
-  <script nomodule src="../../../../../dist/ionic/ionic.js"></script>
-  <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
-</head>
-<script type="module">
-  import { popoverController } from '../../../../dist/ionic/index.esm.js';
-  window.popoverController = popoverController;
-</script>
+  <body>
+    <ion-app>
+      <ion-content class="ion-padding" id="content">
+        <ion-button
+          id="basic-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'profile-page', event: event, htmlAttributes: { 'data-testid': 'basic-popover' } })"
+        >
+          Show Popover</ion-button
+        >
+        <ion-button
+          id="translucent-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'translucent-page', event: event, translucent: true })"
+          >Show Translucent Popover</ion-button
+        >
+        <ion-button
+          id="long-list-popover"
+          expand="block"
+          color="secondary"
+          onclick="presentPopover({ component: 'list-page', event: event })"
+          >Show Long List Popover</ion-button
+        >
+        <ion-button
+          id="no-event-popover"
+          expand="block"
+          color="danger"
+          onclick="presentPopover({ component: 'profile-page' })"
+          >No Event Popover</ion-button
+        >
+        <ion-button
+          id="custom-class-popover"
+          expand="block"
+          color="tertiary"
+          onclick="presentPopover({ component: 'translucent-page', event: event, cssClass: 'my-custom-class' })"
+          >Custom Class Popover</ion-button
+        >
+        <ion-button id="header-popover" expand="block" onclick="presentPopover({ component: 'header-page' })"
+          >Popover With Header</ion-button
+        >
+        <ion-button
+          id="translucent-header-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'translucent-header-page' })"
+          >Popover With Translucent Header</ion-button
+        >
+      </ion-content>
 
-<body>
-  <ion-app>
+      <ion-content class="ion-padding" id="content">
+        <ion-button
+          id="basic-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'profile-page', event: event, htmlAttributes: { 'data-testid': 'basic-popover' } })"
+        >
+          Show Popover</ion-button
+        >
+        <ion-button
+          id="translucent-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'translucent-page', event: event, translucent: true })"
+          >Show Translucent Popover</ion-button
+        >
+        <ion-button
+          id="long-list-popover"
+          expand="block"
+          color="secondary"
+          onclick="presentPopover({ component: 'list-page', event: event })"
+          >Show Long List Popover</ion-button
+        >
+        <ion-button
+          id="no-event-popover"
+          expand="block"
+          color="danger"
+          onclick="presentPopover({ component: 'profile-page' })"
+          >No Event Popover</ion-button
+        >
+        <ion-button
+          id="custom-class-popover"
+          expand="block"
+          color="tertiary"
+          onclick="presentPopover({ component: 'translucent-page', event: event, cssClass: 'my-custom-class' })"
+          >Custom Class Popover</ion-button
+        >
+        <ion-button id="header-popover" expand="block" onclick="presentPopover({ component: 'header-page' })"
+          >Popover With Header</ion-button
+        >
+        <ion-button
+          id="translucent-header-popover"
+          expand="block"
+          onclick="presentPopover({ component: 'translucent-header-page' })"
+          >Popover With Translucent Header</ion-button
+        >
+        <ion-button
+          id="popover-with-textarea"
+          expand="block"
+          onclick="presentPopover({ component: 'textarea-page', event: event, htmlAttributes: { 'data-testid': 'popover-with-textarea'} })"
+        >
+          Popover With Textarea</ion-button
+        >
+      </ion-content>
 
-    <ion-content class="ion-padding" id="content">
-      <ion-button id="basic-popover" expand="block"
-        onclick="presentPopover({ component: 'profile-page', event: event, htmlAttributes: { 'data-testid': 'basic-popover' } })">
-        Show Popover</ion-button>
-      <ion-button id="translucent-popover" expand="block"
-        onclick="presentPopover({ component: 'translucent-page', event: event, translucent: true })">Show Translucent
-        Popover</ion-button>
-      <ion-button id="long-list-popover" expand="block" color="secondary"
-        onclick="presentPopover({ component: 'list-page', event: event })">Show Long List Popover</ion-button>
-      <ion-button id="no-event-popover" expand="block" color="danger"
-        onclick="presentPopover({ component: 'profile-page' })">No Event Popover</ion-button>
-      <ion-button id="custom-class-popover" expand="block" color="tertiary"
-        onclick="presentPopover({ component: 'translucent-page', event: event, cssClass: 'my-custom-class' })">Custom
-        Class Popover</ion-button>
-      <ion-button id="header-popover" expand="block" onclick="presentPopover({ component: 'header-page' })">Popover With
-        Header</ion-button>
-      <ion-button id="translucent-header-popover" expand="block"
-        onclick="presentPopover({ component: 'translucent-header-page' })">Popover With Translucent Header</ion-button>
-    </ion-content>
+      <style>
+        .my-custom-class {
+          --background: rgba(40, 173, 218, 0.6);
+          --width: 300px;
+          --box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.6);
 
-    <ion-content class="ion-padding" id="content">
-      <ion-button id="basic-popover" expand="block"
-        onclick="presentPopover({ component: 'profile-page', event: event, htmlAttributes: { 'data-testid': 'basic-popover' } })">
-        Show Popover</ion-button>
-      <ion-button id="translucent-popover" expand="block"
-        onclick="presentPopover({ component: 'translucent-page', event: event, translucent: true })">Show Translucent
-        Popover</ion-button>
-      <ion-button id="long-list-popover" expand="block" color="secondary"
-        onclick="presentPopover({ component: 'list-page', event: event })">Show Long List Popover</ion-button>
-      <ion-button id="no-event-popover" expand="block" color="danger"
-        onclick="presentPopover({ component: 'profile-page' })">No Event Popover</ion-button>
-      <ion-button id="custom-class-popover" expand="block" color="tertiary"
-        onclick="presentPopover({ component: 'translucent-page', event: event, cssClass: 'my-custom-class' })">Custom
-        Class Popover</ion-button>
-      <ion-button id="header-popover" expand="block" onclick="presentPopover({ component: 'header-page' })">Popover With
-        Header</ion-button>
-      <ion-button id="translucent-header-popover" expand="block"
-        onclick="presentPopover({ component: 'translucent-header-page' })">Popover With Translucent Header</ion-button>
-      <ion-button id="popover-with-textarea" expand="block"
-        onclick="presentPopover({ component: 'textarea-page', event: event, htmlAttributes: { 'data-testid': 'popover-with-textarea'} })">
-        Popover With Textarea</ion-button>
-    </ion-content>
+          color: white;
+        }
+      </style>
 
-    <style>
-      .my-custom-class {
-        --background: rgba(40, 173, 218, 0.6);
-        --width: 300px;
-        --box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.6);
-
-        color: white;
-      }
-    </style>
-
-    <script>
-      async function presentPopover(opts) {
-        const popover = await popoverController.create(opts);
-        await popover.present();
-      }
-
-      class ProfilePage extends HTMLElement {
-        constructor() {
-          super();
+      <script>
+        async function presentPopover(opts) {
+          const popover = await popoverController.create(opts);
+          await popover.present();
         }
 
-        connectedCallback() {
-          this.innerHTML = `
+        class ProfilePage extends HTMLElement {
+          constructor() {
+            super();
+          }
+
+          connectedCallback() {
+            this.innerHTML = `
           <ion-content>
             <ion-list>
               <ion-list-header><ion-label>Ionic</ion-label></ion-list-header>
@@ -96,61 +152,61 @@
             </ion-list>
           </ion-content>
         `;
-        }
-      }
-
-      customElements.define('profile-page', ProfilePage);
-
-      class ListPage extends HTMLElement {
-        constructor() {
-          super();
+          }
         }
 
-        connectedCallback() {
-          let items = '';
-          for (var i = 0; i < 30; i++) {
-            items += '<ion-item><ion-label>Item ' + i + '</ion-label></ion-item>';
+        customElements.define('profile-page', ProfilePage);
+
+        class ListPage extends HTMLElement {
+          constructor() {
+            super();
           }
 
-          this.innerHTML =
-            `
+          connectedCallback() {
+            let items = '';
+            for (var i = 0; i < 30; i++) {
+              items += '<ion-item><ion-label>Item ' + i + '</ion-label></ion-item>';
+            }
+
+            this.innerHTML =
+              `
           <ion-content>
             <ion-list>
               <ion-list-header><ion-label>Ionic</ion-label></ion-list-header>
               ` +
-            items +
-            `
+              items +
+              `
             </ion-list>
           </ion-content>
         `;
-        }
-      }
-
-      customElements.define('list-page', ListPage);
-
-      class TranslucentPage extends HTMLElement {
-        constructor() {
-          super();
+          }
         }
 
-        connectedCallback() {
-          this.innerHTML = `
+        customElements.define('list-page', ListPage);
+
+        class TranslucentPage extends HTMLElement {
+          constructor() {
+            super();
+          }
+
+          connectedCallback() {
+            this.innerHTML = `
           <div class="ion-padding">
             <h1>Translucent Popover</h1>
           </div>
         `;
-        }
-      }
-
-      customElements.define('translucent-page', TranslucentPage);
-
-      class HeaderPage extends HTMLElement {
-        constructor() {
-          super();
+          }
         }
 
-        connectedCallback() {
-          this.innerHTML = `
+        customElements.define('translucent-page', TranslucentPage);
+
+        class HeaderPage extends HTMLElement {
+          constructor() {
+            super();
+          }
+
+          connectedCallback() {
+            this.innerHTML = `
           <ion-header>
             <ion-toolbar>
               <ion-title>Header</ion-title>
@@ -161,18 +217,18 @@
             Lorem ipsum dolor sit amet, consectetur adipiscing elit.In rutrum tortor lacus, ac interdum ipsum bibendum vel.Aenean non nibh gravida, ullamcorper mi at, tempor nulla.Proin malesuada tellus ut ullamcorper accumsan.Donec semper justo vulputate neque tempus ultricies.Proin non aliquet ipsum.Praesent mauris sem, facilisis eu justo nec, euismod imperdiet tellus.Duis eget justo congue, lacinia orci sed, fermentum urna.Quisque sed massa faucibus, interdum dolor rhoncus, molestie erat.Proin suscipit ante non mauris volutpat egestas.Donec a ultrices ligula.Mauris in felis vel dui consectetur viverra.Nam vitae quam in arcu aliquam aliquam.Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.Cras non velit nisl.Donec viverra, magna quis vestibulum volutpat, metus ante tincidunt augue, non porta nisi mi sit amet neque.Proin dapibus eros vitae nibh tincidunt, blandit rhoncus est porttitor.
           </ion-content>
         `;
-        }
-      }
-
-      customElements.define('header-page', HeaderPage);
-
-      class TranslucentHeaderPage extends HTMLElement {
-        constructor() {
-          super();
+          }
         }
 
-        connectedCallback() {
-          this.innerHTML = `
+        customElements.define('header-page', HeaderPage);
+
+        class TranslucentHeaderPage extends HTMLElement {
+          constructor() {
+            super();
+          }
+
+          connectedCallback() {
+            this.innerHTML = `
           <ion-header translucent>
             <ion-toolbar>
               <ion-title>Header</ion-title>
@@ -189,30 +245,28 @@
             </ion-toolbar>
           </ion-footer>
         `;
-        }
-      }
-
-      customElements.define('translucent-header-page', TranslucentHeaderPage);
-
-      class TextAreaPage extends HTMLElement {
-        constructor() {
-          super();
+          }
         }
 
-        connectedCallback() {
-          this.innerHTML = `
+        customElements.define('translucent-header-page', TranslucentHeaderPage);
+
+        class TextAreaPage extends HTMLElement {
+          constructor() {
+            super();
+          }
+
+          connectedCallback() {
+            this.innerHTML = `
           <ion-content>
             <ion-textarea rows="4" style="max-height: 44px; overflow-y: auto;" value="the cursor in this <ion-textarea>\nmust be able to be moved\nwith the arrow keys and\nhome and end keys"></ion-textarea>
             <textarea rows="4" style="display:block;width: 100%;border: 0;padding: 8px; max-height: 44px; overflow-y: auto">the cursor in this <textarea>\nmust be able to be moved\nwith the arrow keys and\nhome and end keys</textarea>
           </ion-content>
         `;
+          }
         }
-      }
-
-      customElements.define('textarea-page', TextAreaPage);
-    </script>
-
-  </ion-app>
-</body>
 
+        customElements.define('textarea-page', TextAreaPage);
+      </script>
+    </ion-app>
+  </body>
 </html>
diff --git a/core/src/components/popover/utils.ts b/core/src/components/popover/utils.ts
index 15aa095ed9..3457379591 100644
--- a/core/src/components/popover/utils.ts
+++ b/core/src/components/popover/utils.ts
@@ -361,7 +361,7 @@ export const configureKeyboardInteraction = (popoverEl: HTMLIonPopoverElement) =
         ) as NodeListOf<HTMLIonItemElement>
       );
       /* eslint-disable-next-line */
-    } catch { }
+    } catch {}
 
     switch (ev.key) {
       /**
diff --git a/core/src/components/refresher/test/scroll-target/index.html b/core/src/components/refresher/test/scroll-target/index.html
index f5b3fe5ede..fe38d97e99 100644
--- a/core/src/components/refresher/test/scroll-target/index.html
+++ b/core/src/components/refresher/test/scroll-target/index.html
@@ -59,7 +59,7 @@
       const refresher = document.getElementById('refresher');
 
       refresher.addEventListener('ionRefresh', async function () {
-        console.log('refresh fired')
+        console.log('refresh fired');
         const data = await getAsyncData();
         items = items.concat(data);
         refresher.complete();
diff --git a/core/src/components/ripple-effect/test/basic/ripple-effect.e2e.ts b/core/src/components/ripple-effect/test/basic/ripple-effect.e2e.ts
index ddc617e128..660e24f187 100644
--- a/core/src/components/ripple-effect/test/basic/ripple-effect.e2e.ts
+++ b/core/src/components/ripple-effect/test/basic/ripple-effect.e2e.ts
@@ -1,5 +1,5 @@
 import { expect } from '@playwright/test';
-import type { IonicPage } from '@utils/test/playwright';
+import type { E2EPage } from '@utils/test/playwright';
 import { test } from '@utils/test/playwright';
 
 test.describe('ripple-effect: basic', () => {
@@ -40,7 +40,7 @@ test.describe('ripple-effect: basic', () => {
   });
 });
 
-const verifyRippleEffect = async (page: IonicPage, selector: string) => {
+const verifyRippleEffect = async (page: E2EPage, selector: string) => {
   await page.goto(`/src/components/ripple-effect/test/basic?ionic:_testing=false&ionic:mode=md`);
 
   const el = page.locator(selector);
diff --git a/core/src/utils/test/playwright/fixtures.ts b/core/src/utils/test/playwright/fixtures.ts
deleted file mode 100644
index 208aa554e4..0000000000
--- a/core/src/utils/test/playwright/fixtures.ts
+++ /dev/null
@@ -1,156 +0,0 @@
-import type {
-  Page,
-  PlaywrightTestArgs,
-  PlaywrightTestOptions,
-  PlaywrightWorkerArgs,
-  PlaywrightWorkerOptions,
-  Response,
-  TestInfo,
-} from '@playwright/test';
-import { test as base } from '@playwright/test';
-
-import { EventSpy, initPageEvents, addE2EListener } from './eventSpy';
-
-export type IonicPage = Page & {
-  goto: (url: string) => Promise<null | Response>;
-  setIonViewport: () => Promise<void>;
-  getSnapshotSettings: () => string;
-  spyOnEvent: (eventName: string) => Promise<EventSpy>;
-  _e2eEventsIds: number;
-  _e2eEvents: Map<number, any>;
-};
-
-type CustomTestArgs = PlaywrightTestArgs &
-  PlaywrightTestOptions &
-  PlaywrightWorkerArgs &
-  PlaywrightWorkerOptions & {
-    page: IonicPage;
-  };
-
-type CustomFixtures = {
-  page: IonicPage;
-};
-
-export const test = base.extend<CustomFixtures>({
-  page: async ({ page }: CustomTestArgs, use: (r: IonicPage) => Promise<void>, testInfo: TestInfo) => {
-    const oldGoTo = page.goto.bind(page);
-
-    /**
-     * This is an extended version of Playwright's
-     * page.goto method. In addition to performing
-     * the normal page.goto work, this code also
-     * automatically waits for the Stencil components
-     * to be hydrated before proceeding with the test.
-     */
-    page.goto = async (url: string) => {
-      const { mode, rtl, _testing } = testInfo.project.metadata;
-
-      const splitUrl = url.split('?');
-      const paramsString = splitUrl[1];
-
-      /**
-       * This allows developers to force a
-       * certain mode or LTR/RTL config per test.
-       */
-      const urlToParams = new URLSearchParams(paramsString);
-      const formattedMode = urlToParams.get('ionic:mode') ?? mode;
-      const formattedRtl = urlToParams.get('rtl') ?? rtl;
-      const ionicTesting = urlToParams.get('ionic:_testing') ?? _testing;
-
-      const formattedUrl = `${splitUrl[0]}?ionic:_testing=${ionicTesting}&ionic:mode=${formattedMode}&rtl=${formattedRtl}`;
-
-      const results = await Promise.all([
-        page.waitForFunction(() => (window as any).testAppLoaded === true),
-        oldGoTo(formattedUrl),
-      ]);
-
-      return results[1];
-    };
-
-    /**
-     * This provides metadata that can be used to
-     * create a unique screenshot URL.
-     * For example, we need to be able to differentiate
-     * between iOS in LTR mode and iOS in RTL mode.
-     */
-    page.getSnapshotSettings = () => {
-      const url = page.url();
-      const splitUrl = url.split('?');
-      const paramsString = splitUrl[1];
-
-      const { mode, rtl } = testInfo.project.metadata;
-
-      /**
-       * Account for custom settings when overriding
-       * the mode/rtl setting. Fall back to the
-       * project metadata if nothing was found. This
-       * will happen if you call page.getSnapshotSettings
-       * before page.goto.
-       */
-      const urlToParams = new URLSearchParams(paramsString);
-      const formattedMode = urlToParams.get('ionic:mode') ?? mode;
-      const formattedRtl = urlToParams.get('rtl') ?? rtl;
-
-      /**
-       * If encoded in the search params, the rtl value
-       * can be `'true'` instead of `true`.
-       */
-      const rtlString = formattedRtl === true || formattedRtl === 'true' ? 'rtl' : 'ltr';
-      return `${formattedMode}-${rtlString}`;
-    };
-
-    /**
-     * Taking fullpage screenshots in Playwright
-     * does not work with ion-content by default.
-     * The reason is that full page screenshots do not
-     * expand any scrollable container on the page. Instead,
-     * they render the full scrollable content of the document itself.
-     * To work around this, we increase the size of the document
-     * so the full scrollable content inside of ion-content
-     * can be captured in a screenshot.
-     */
-    page.setIonViewport = async () => {
-      const currentViewport = page.viewportSize();
-
-      const pixelAmountRenderedOffscreen = await page.evaluate(() => {
-        const content = document.querySelector('ion-content');
-        if (content) {
-          const innerScroll = content.shadowRoot!.querySelector('.inner-scroll')!;
-          return innerScroll.scrollHeight - content.clientHeight;
-        }
-        return 0;
-      });
-
-      const width = currentViewport?.width ?? 640;
-      const height = (currentViewport?.height ?? 480) + pixelAmountRenderedOffscreen;
-
-      await page.setViewportSize({
-        width,
-        height,
-      });
-    };
-
-    /**
-     * Creates a new EventSpy and listens
-     * on the window for an event.
-     * The test will timeout if the event
-     * never fires.
-     *
-     * Usage:
-     * const ionChange = await page.spyOnEvent('ionChange');
-     * ...
-     * await ionChange.next();
-     */
-    page.spyOnEvent = async (eventName: string): Promise<EventSpy> => {
-      const spy = new EventSpy(eventName);
-
-      await addE2EListener(page, eventName, (ev: Event) => spy.push(ev));
-
-      return spy;
-    };
-
-    initPageEvents(page);
-
-    await use(page);
-  },
-});
diff --git a/core/src/utils/test/playwright/index.ts b/core/src/utils/test/playwright/index.ts
index 90dcacbd8b..9732f31107 100644
--- a/core/src/utils/test/playwright/index.ts
+++ b/core/src/utils/test/playwright/index.ts
@@ -1,2 +1,3 @@
-export * from './fixtures';
-export * from './eventSpy';
+export * from './playwright-page';
+export * from './playwright-declarations';
+export * from './page/event-spy';
diff --git a/core/src/utils/test/playwright/eventSpy.ts b/core/src/utils/test/playwright/page/event-spy.ts
similarity index 91%
rename from core/src/utils/test/playwright/eventSpy.ts
rename to core/src/utils/test/playwright/page/event-spy.ts
index 6e10808cf1..2fd2fa3843 100644
--- a/core/src/utils/test/playwright/eventSpy.ts
+++ b/core/src/utils/test/playwright/page/event-spy.ts
@@ -1,4 +1,4 @@
-import type { IonicPage } from './fixtures';
+import type { E2EPage } from '../playwright-declarations';
 
 /**
  * The EventSpy class allows
@@ -65,7 +65,7 @@ export class EventSpy {
  * respond to an event listener created within
  * the page itself.
  */
-export const initPageEvents = async (page: IonicPage) => {
+export const initPageEvents = async (page: E2EPage) => {
   page._e2eEventsIds = 0;
   page._e2eEvents = new Map();
 
@@ -82,7 +82,7 @@ export const initPageEvents = async (page: IonicPage) => {
  * page context to updates the _e2eEvents map
  * when an event is fired.
  */
-export const addE2EListener = async (page: IonicPage, eventName: string, callback: (ev: any) => void) => {
+export const addE2EListener = async (page: E2EPage, eventName: string, callback: (ev: any) => void) => {
   const id = page._e2eEventsIds++;
   page._e2eEvents.set(id, {
     eventName,
diff --git a/core/src/utils/test/playwright/page/utils/get-snapshot-settings.ts b/core/src/utils/test/playwright/page/utils/get-snapshot-settings.ts
new file mode 100644
index 0000000000..8e91d91a6e
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/get-snapshot-settings.ts
@@ -0,0 +1,33 @@
+import type { Page, TestInfo } from '@playwright/test';
+
+/**
+ * This provides metadata that can be used to
+ * create a unique screenshot URL.
+ * For example, we need to be able to differentiate
+ * between iOS in LTR mode and iOS in RTL mode.
+ */
+export const getSnapshotSettings = (page: Page, testInfo: TestInfo) => {
+  const url = page.url();
+  const splitUrl = url.split('?');
+  const paramsString = splitUrl[1];
+
+  const { mode, rtl } = testInfo.project.metadata;
+
+  /**
+   * Account for custom settings when overriding
+   * the mode/rtl setting. Fall back to the
+   * project metadata if nothing was found. This
+   * will happen if you call page.getSnapshotSettings
+   * before page.goto.
+   */
+  const urlToParams = new URLSearchParams(paramsString);
+  const formattedMode = urlToParams.get('ionic:mode') ?? mode;
+  const formattedRtl = urlToParams.get('rtl') ?? rtl;
+
+  /**
+   * If encoded in the search params, the rtl value
+   * can be `'true'` instead of `true`.
+   */
+  const rtlString = formattedRtl === true || formattedRtl === 'true' ? 'rtl' : 'ltr';
+  return `${formattedMode}-${rtlString}`;
+};
diff --git a/core/src/utils/test/playwright/page/utils/goto.ts b/core/src/utils/test/playwright/page/utils/goto.ts
new file mode 100644
index 0000000000..873f1461cc
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/goto.ts
@@ -0,0 +1,33 @@
+import type { Page, TestInfo } from '@playwright/test';
+
+/**
+ * This is an extended version of Playwright's
+ * page.goto method. In addition to performing
+ * the normal page.goto work, this code also
+ * automatically waits for the Stencil components
+ * to be hydrated before proceeding with the test.
+ */
+export const goto = async (page: Page, url: string, testInfo: TestInfo, originalFn: typeof page.goto) => {
+  const { mode, rtl, _testing } = testInfo.project.metadata;
+
+  const splitUrl = url.split('?');
+  const paramsString = splitUrl[1];
+
+  /**
+   * This allows developers to force a
+   * certain mode or LTR/RTL config per test.
+   */
+  const urlToParams = new URLSearchParams(paramsString);
+  const formattedMode = urlToParams.get('ionic:mode') ?? mode;
+  const formattedRtl = urlToParams.get('rtl') ?? rtl;
+  const ionicTesting = urlToParams.get('ionic:_testing') ?? _testing;
+
+  const formattedUrl = `${splitUrl[0]}?ionic:_testing=${ionicTesting}&ionic:mode=${formattedMode}&rtl=${formattedRtl}`;
+
+  const result = await Promise.all([
+    page.waitForFunction(() => (window as any).testAppLoaded === true, { timeout: 4750 }),
+    originalFn(formattedUrl),
+  ]);
+
+  return result[1];
+};
diff --git a/core/src/utils/test/playwright/page/utils/index.ts b/core/src/utils/test/playwright/page/utils/index.ts
new file mode 100644
index 0000000000..cccfbd8093
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/index.ts
@@ -0,0 +1,5 @@
+export * from './wait-for-changes';
+export * from './goto';
+export * from './get-snapshot-settings';
+export * from './set-ion-viewport';
+export * from './spy-on-event';
diff --git a/core/src/utils/test/playwright/page/utils/set-ion-viewport.ts b/core/src/utils/test/playwright/page/utils/set-ion-viewport.ts
new file mode 100644
index 0000000000..a5002bf30a
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/set-ion-viewport.ts
@@ -0,0 +1,33 @@
+import type { Page } from '@playwright/test';
+
+/**
+ * Taking fullpage screenshots in Playwright
+ * does not work with ion-content by default.
+ * The reason is that full page screenshots do not
+ * expand any scrollable container on the page. Instead,
+ * they render the full scrollable content of the document itself.
+ * To work around this, we increase the size of the document
+ * so the full scrollable content inside of ion-content
+ * can be captured in a screenshot.
+ *
+ */
+export const setIonViewport = async (page: Page) => {
+  const currentViewport = page.viewportSize();
+
+  const pixelAmountRenderedOffscreen = await page.evaluate(() => {
+    const content = document.querySelector('ion-content');
+    if (content) {
+      const innerScroll = content.shadowRoot!.querySelector('.inner-scroll')!;
+      return innerScroll.scrollHeight - content.clientHeight;
+    }
+    return 0;
+  });
+
+  const width = currentViewport?.width ?? 640;
+  const height = (currentViewport?.height ?? 480) + pixelAmountRenderedOffscreen;
+
+  await page.setViewportSize({
+    width,
+    height,
+  });
+};
diff --git a/core/src/utils/test/playwright/page/utils/spy-on-event.ts b/core/src/utils/test/playwright/page/utils/spy-on-event.ts
new file mode 100644
index 0000000000..777090b36c
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/spy-on-event.ts
@@ -0,0 +1,10 @@
+import type { E2EPage } from '../../playwright-declarations';
+import { addE2EListener, EventSpy } from '../event-spy';
+
+export const spyOnEvent = async (page: E2EPage, eventName: string): Promise<EventSpy> => {
+  const spy = new EventSpy(eventName);
+
+  await addE2EListener(page, eventName, (ev: Event) => spy.push(ev));
+
+  return spy;
+};
diff --git a/core/src/utils/test/playwright/page/utils/wait-for-changes.ts b/core/src/utils/test/playwright/page/utils/wait-for-changes.ts
new file mode 100644
index 0000000000..dde3323e41
--- /dev/null
+++ b/core/src/utils/test/playwright/page/utils/wait-for-changes.ts
@@ -0,0 +1,57 @@
+import type { Page } from '@playwright/test';
+import type { HostElement } from '@stencil/core/internal';
+
+/**
+ * Waits for a combined threshold of a Stencil web component to be re-hydrated in the next repaint + 100ms.
+ * Used for testing changes to a web component that does not modify CSS classes or introduce new DOM nodes.
+ *
+ * Original source: https://github.com/ionic-team/stencil/blob/main/src/testing/puppeteer/puppeteer-page.ts#L298-L363
+ */
+export const waitForChanges = async (page: Page, timeoutMs = 100) => {
+  try {
+    if (page.isClosed()) {
+      /**
+       * If the page is already closed, we can skip the long execution of this method
+       * and return early.
+       */
+      return;
+    }
+    await page.evaluate(() => {
+      // BROWSER CONTEXT
+      return new Promise<void>((resolve) => {
+        // Wait for the next repaint to happen
+        requestAnimationFrame(() => {
+          const promiseChain: Promise<any>[] = [];
+
+          const waitComponentOnReady = (elm: Element | ShadowRoot, promises: Promise<any>[]) => {
+            if ('shadowRoot' in elm && elm.shadowRoot instanceof ShadowRoot) {
+              waitComponentOnReady(elm.shadowRoot, promises);
+            }
+            const children = elm.children;
+            const len = children.length;
+            for (let i = 0; i < len; i++) {
+              const childElm = children[i];
+              const childStencilElm = childElm as HostElement;
+              if (childElm.tagName.includes('-') && typeof childStencilElm.componentOnReady === 'function') {
+                promises.push(childStencilElm.componentOnReady());
+              }
+              waitComponentOnReady(childElm, promises);
+            }
+          };
+
+          waitComponentOnReady(document.documentElement, promiseChain);
+
+          Promise.all(promiseChain)
+            .then(() => resolve())
+            .catch(() => resolve());
+        });
+      });
+    });
+    if (page.isClosed()) {
+      return;
+    }
+    await page.waitForTimeout(timeoutMs);
+  } catch (e) {
+    console.error(e);
+  }
+};
diff --git a/core/src/utils/test/playwright/playwright-declarations.ts b/core/src/utils/test/playwright/playwright-declarations.ts
new file mode 100644
index 0000000000..70a0f154d4
--- /dev/null
+++ b/core/src/utils/test/playwright/playwright-declarations.ts
@@ -0,0 +1,66 @@
+import type { Page, Response } from '@playwright/test';
+
+import type { EventSpy } from './page/event-spy';
+
+export interface E2EPage extends Page {
+  /**
+   * Returns the main resource response. In case of multiple redirects, the navigation will resolve with the response of the
+   * last redirect.
+   *
+   * The method will throw an error if:
+   * - there's an SSL error (e.g. in case of self-signed certificates).
+   * - target URL is invalid.
+   * - the `timeout` is exceeded during navigation.
+   * - the remote server does not respond or is unreachable.
+   * - the main resource failed to load.
+   *
+   * The method will not throw an error when any valid HTTP status code is returned by the remote server, including 404 "Not
+   * Found" and 500 "Internal Server Error".  The status code for such responses can be retrieved by calling
+   * [response.status()](https://playwright.dev/docs/api/class-response#response-status).
+   *
+   * > NOTE: The method either throws an error or returns a main resource response. The only exceptions are navigation to
+   * `about:blank` or navigation to the same URL with a different hash, which would succeed and return `null`.
+   * > NOTE: Headless mode doesn't support navigation to a PDF document. See the
+   * [upstream issue](https://bugs.chromium.org/p/chromium/issues/detail?id=761295).
+   *
+   * Shortcut for main frame's [frame.goto(url[, options])](https://playwright.dev/docs/api/class-frame#frame-goto)
+   * @param url URL to navigate page to. The url should include scheme, e.g. `https://`. When a `baseURL` via the context options was provided and the passed URL is a path, it gets merged via the
+   * [`new URL()`](https://developer.mozilla.org/en-US/docs/Web/API/URL/URL) constructor.
+   */
+  goto: (url: string) => Promise<null | Response>;
+  /**
+   * Increases the size of the page viewport to match the `ion-content` contents.
+   * Use this method when taking full-screen screenshots.
+   */
+  setIonViewport: () => Promise<void>;
+  /**
+   * This provides metadata that can be used to create a unique screenshot URL.
+   * For example, we need to be able to differentiate between iOS in LTR mode and iOS in RTL mode.
+   */
+  getSnapshotSettings: () => string;
+  /**
+   * After changes have been made to a component, such as an update to a property or attribute,
+   * we need to wait until the changes have been applied to the DOM.
+   */
+  waitForChanges: (timeoutMs?: number) => Promise<void>;
+  /**
+   * Listens on the window for a specific event to be dispatched.
+   * Will wait a maximum of 5 seconds for the event to be dispatched.
+   */
+  waitForCustomEvent: (eventName: string) => Promise<Page>;
+
+  /**
+   * Creates a new EventSpy and listens
+   * on the window for an event.
+   * The test will timeout if the event
+   * never fires.
+   *
+   * Usage:
+   * const ionChange = await page.spyOnEvent('ionChange');
+   * ...
+   * await ionChange.next();
+   */
+  spyOnEvent: (eventName: string) => Promise<EventSpy>;
+  _e2eEventsIds: number;
+  _e2eEvents: Map<number, any>;
+}
diff --git a/core/src/utils/test/playwright/playwright-page.ts b/core/src/utils/test/playwright/playwright-page.ts
new file mode 100644
index 0000000000..6e8e8a9742
--- /dev/null
+++ b/core/src/utils/test/playwright/playwright-page.ts
@@ -0,0 +1,48 @@
+import type {
+  PlaywrightTestArgs,
+  PlaywrightTestOptions,
+  PlaywrightWorkerArgs,
+  PlaywrightWorkerOptions,
+  TestInfo,
+} from '@playwright/test';
+import { test as base } from '@playwright/test';
+
+import { initPageEvents } from './page/event-spy';
+import {
+  getSnapshotSettings,
+  goto as goToPage,
+  setIonViewport,
+  spyOnEvent,
+  waitForChanges,
+} from './page/utils';
+import type { E2EPage } from './playwright-declarations';
+
+type CustomTestArgs = PlaywrightTestArgs &
+  PlaywrightTestOptions &
+  PlaywrightWorkerArgs &
+  PlaywrightWorkerOptions & {
+    page: E2EPage;
+  };
+
+type CustomFixtures = {
+  page: E2EPage;
+};
+
+export const test = base.extend<CustomFixtures>({
+  page: async ({ page }: CustomTestArgs, use: (r: E2EPage) => Promise<void>, testInfo: TestInfo) => {
+    const originalGoto = page.goto.bind(page);
+
+    // Overridden Playwright methods
+    page.goto = (url: string) => goToPage(page, url, testInfo, originalGoto);
+    // Custom Ionic methods
+    page.getSnapshotSettings = () => getSnapshotSettings(page, testInfo);
+    page.setIonViewport = () => setIonViewport(page);
+    page.waitForChanges = (timeoutMs?: number) => waitForChanges(page, timeoutMs);
+    page.spyOnEvent = (eventName: string) => spyOnEvent(page, eventName);
+
+    // Custom event behavior
+    initPageEvents(page);
+
+    await use(page);
+  },
+});
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 7561160039..2dae0ddd74 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic-docs/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic-docs/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/docs
diff --git a/docs/package.json b/docs/package.json
index a0651136d1..98231c5a36 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/docs",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Pre-packaged API documentation for the Ionic docs.",
   "main": "core.json",
   "types": "core.d.ts",
diff --git a/lerna.json b/lerna.json
index 87cac1f720..aab853dcc5 100644
--- a/lerna.json
+++ b/lerna.json
@@ -5,5 +5,5 @@
     "angular",
     "packages/*"
   ],
-  "version": "6.1.1"
+  "version": "6.1.2"
 }
diff --git a/packages/angular-server/CHANGELOG.md b/packages/angular-server/CHANGELOG.md
index 8ccccb8fc0..4a99357cf0 100644
--- a/packages/angular-server/CHANGELOG.md
+++ b/packages/angular-server/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/angular-server
diff --git a/packages/angular-server/package-lock.json b/packages/angular-server/package-lock.json
index 6faa758fcd..2a134cd901 100644
--- a/packages/angular-server/package-lock.json
+++ b/packages/angular-server/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular-server",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json
index ce3d3da0c9..730dc11761 100644
--- a/packages/angular-server/package.json
+++ b/packages/angular-server/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular-server",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Angular SSR Module for Ionic",
   "keywords": [
     "ionic",
@@ -56,7 +56,7 @@
     "@angular/platform-browser": "^12.0.0",
     "@angular/platform-browser-dynamic": "^12.2.10",
     "@angular/platform-server": "^12.0.0",
-    "@ionic/core": "^6.1.1",
+    "@ionic/core": "^6.1.2",
     "@ionic/eslint-config": "^0.3.0",
     "@ionic/prettier-config": "^2.0.0",
     "@typescript-eslint/eslint-plugin": "^5.2.0",
diff --git a/packages/react-router/CHANGELOG.md b/packages/react-router/CHANGELOG.md
index 87a2d8a495..1e95ab6eaa 100644
--- a/packages/react-router/CHANGELOG.md
+++ b/packages/react-router/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/react-router
diff --git a/packages/react-router/package-lock.json b/packages/react-router/package-lock.json
index 3f2bf82dba..0330ee5a71 100644
--- a/packages/react-router/package-lock.json
+++ b/packages/react-router/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react-router",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/react-router/package.json b/packages/react-router/package.json
index b1546c94da..a8eb96db33 100644
--- a/packages/react-router/package.json
+++ b/packages/react-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react-router",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "React Router wrapper for @ionic/react",
   "keywords": [
     "ionic",
@@ -37,7 +37,7 @@
     "dist/"
   ],
   "dependencies": {
-    "@ionic/react": "^6.1.1",
+    "@ionic/react": "^6.1.2",
     "tslib": "*"
   },
   "peerDependencies": {
diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
index 9a4e46413d..8c89c702d3 100644
--- a/packages/react/CHANGELOG.md
+++ b/packages/react/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/react
diff --git a/packages/react/package-lock.json b/packages/react/package-lock.json
index 754d967355..ebc5e5e8ab 100644
--- a/packages/react/package-lock.json
+++ b/packages/react/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/react/package.json b/packages/react/package.json
index bb8a1dd5bf..fa62458cbe 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "React specific wrapper for @ionic/core",
   "keywords": [
     "ionic",
@@ -41,7 +41,7 @@
     "css/"
   ],
   "dependencies": {
-    "@ionic/core": "^6.1.1",
+    "@ionic/core": "^6.1.2",
     "ionicons": "^6.0.0",
     "tslib": "*"
   },
diff --git a/packages/vue-router/CHANGELOG.md b/packages/vue-router/CHANGELOG.md
index 69ea3f85ff..782e4f17bc 100644
--- a/packages/vue-router/CHANGELOG.md
+++ b/packages/vue-router/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/vue-router
diff --git a/packages/vue-router/package-lock.json b/packages/vue-router/package-lock.json
index d9054bb8fc..d1cb9c44ab 100644
--- a/packages/vue-router/package-lock.json
+++ b/packages/vue-router/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue-router",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/vue-router/package.json b/packages/vue-router/package.json
index 4add68fb5b..cfd7668278 100644
--- a/packages/vue-router/package.json
+++ b/packages/vue-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue-router",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Vue Router integration for @ionic/vue",
   "scripts": {
     "prepublishOnly": "npm run build",
@@ -44,7 +44,7 @@
   },
   "homepage": "https://github.com/ionic-team/ionic#readme",
   "dependencies": {
-    "@ionic/vue": "^6.1.1"
+    "@ionic/vue": "^6.1.2"
   },
   "devDependencies": {
     "@types/jest": "^26.0.13",
diff --git a/packages/vue/CHANGELOG.md b/packages/vue/CHANGELOG.md
index 22fb99450e..3123420342 100644
--- a/packages/vue/CHANGELOG.md
+++ b/packages/vue/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.1.2](https://github.com/ionic-team/ionic/compare/v6.1.1...v6.1.2) (2022-04-20)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
 ## [6.1.1](https://github.com/ionic-team/ionic/compare/v6.1.0...v6.1.1) (2022-04-15)
 
 **Note:** Version bump only for package @ionic/vue
diff --git a/packages/vue/package-lock.json b/packages/vue/package-lock.json
index 3b264fd25e..0c9f7a7da6 100644
--- a/packages/vue/package-lock.json
+++ b/packages/vue/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/vue/package.json b/packages/vue/package.json
index 55fc51e1e2..673b0f9e7f 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "6.1.1",
+  "version": "6.1.2",
   "description": "Vue specific wrapper for @ionic/core",
   "scripts": {
     "prepublishOnly": "npm run build",
@@ -60,7 +60,7 @@
     "vue-router": "^4.0.0-rc.4"
   },
   "dependencies": {
-    "@ionic/core": "^6.1.1",
+    "@ionic/core": "^6.1.2",
     "ionicons": "^6.0.0"
   },
   "vetur": {