diff --git a/core/src/components/input/test/a11y/input.e2e.ts b/core/src/components/input/test/a11y/input.e2e.ts
new file mode 100644
index 0000000000..6d8365fdd6
--- /dev/null
+++ b/core/src/components/input/test/a11y/input.e2e.ts
@@ -0,0 +1,38 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('input: a11y', () => {
+ test('does not set a default aria-labelledby when there is not a neighboring ion-label', async ({
+ page,
+ }, testInfo) => {
+ test.skip(testInfo.project.metadata.rtl === true, 'Does not test LTR vs. RTL layout.');
+
+ await page.setContent('');
+
+ const input = page.locator('ion-input > input');
+ const ariaLabelledBy = await input.getAttribute('aria-labelledby');
+
+ await expect(ariaLabelledBy).toBe(null);
+ });
+
+ test('set a default aria-labelledby when a neighboring ion-label exists', async ({ page }, testInfo) => {
+ test.skip(testInfo.project.metadata.rtl === true, 'Does not test LTR vs. RTL layout.');
+
+ await page.setContent(
+ `
+
+ A11y Test
+
+
+ `
+ );
+
+ const label = page.locator('ion-label');
+ const input = page.locator('ion-input > input');
+
+ const ariaLabelledBy = await input.getAttribute('aria-labelledby');
+ const labelId = await label.getAttribute('id');
+
+ await expect(ariaLabelledBy).toBe(labelId);
+ });
+});
diff --git a/core/src/components/input/test/a11y/input.spec.ts b/core/src/components/input/test/a11y/input.spec.ts
deleted file mode 100644
index 9a9382b554..0000000000
--- a/core/src/components/input/test/a11y/input.spec.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-
-import { Item } from '../../../item/item';
-import { Label } from '../../../label/label';
-import { Input } from '../../input';
-
-describe('Input a11y', () => {
- it('does not set a default aria-labelledby when there is not a neighboring ion-label', async () => {
- const page = await newSpecPage({
- components: [Input, Item, Label],
- html: ``,
- });
-
- const ariaLabelledBy = page.body.querySelector('ion-input > input').getAttribute('aria-labelledby');
- expect(ariaLabelledBy).toBe(null);
- });
-
- it('set a default aria-labelledby when a neighboring ion-label exists', async () => {
- const page = await newSpecPage({
- components: [Input, Item, Label],
- html: `
- A11y Test
-
- `,
- });
-
- const label = page.body.querySelector('ion-label');
- const ariaLabelledBy = page.body.querySelector('ion-input > input').getAttribute('aria-labelledby');
- expect(ariaLabelledBy).toBe(label.id);
- });
-});
diff --git a/core/src/components/input/test/basic/e2e.ts b/core/src/components/input/test/basic/e2e.ts
deleted file mode 100644
index f9578ed3f0..0000000000
--- a/core/src/components/input/test/basic/e2e.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('input: basic', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/basic?ionic:_testing=true',
- });
-
- const compares = [];
-
- compares.push(await page.compareScreenshot());
-
- const fullInput = await page.find('#fullInput');
- await fullInput.click();
-
- const fullItem = await page.find('#fullItem');
- expect(fullItem).toHaveClass('item-has-focus');
-
- compares.push(await page.compareScreenshot('full input focused'));
-
- const insetInput = await page.find('#insetInput');
- await insetInput.click();
-
- const insetItem = await page.find('#insetItem');
- expect(insetItem).toHaveClass('item-has-focus');
-
- compares.push(await page.compareScreenshot('inset input focused'));
-
- const noneInput = await page.find('#noneInput');
- await noneInput.click();
-
- const noneItem = await page.find('#noneItem');
- expect(noneItem).toHaveClass('item-has-focus');
-
- compares.push(await page.compareScreenshot('no lines input focused'));
-
- for (const compare of compares) {
- expect(compare).toMatchScreenshot();
- }
-});
-
-test('input: basic should not error on input', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/basic?ionic:_testing=true',
- });
-
- const errors = [];
-
- page.on('console', (msg) => {
- if (msg.type() === 'error') {
- errors.push(msg.text());
- }
- });
-
- const inputs = await page.findAll('ion-input');
-
- for (const input of inputs) {
- await input.click();
- await input.type('letters and 12345');
- }
-
- expect(errors.length).toEqual(0);
-});
diff --git a/core/src/components/input/test/basic/input.e2e.ts b/core/src/components/input/test/basic/input.e2e.ts
new file mode 100644
index 0000000000..d611e847af
--- /dev/null
+++ b/core/src/components/input/test/basic/input.e2e.ts
@@ -0,0 +1,159 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('input: basic', () => {
+ test.describe('input with overflow', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ // Validates the display of an input where text extends off the edge of the component.
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-text-overflow-${page.getSnapshotSettings()}.png`);
+ });
+ });
+
+ test.describe('input with placeholder', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ // Validates the display of an input with a placeholder.
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-placeholder-${page.getSnapshotSettings()}.png`);
+ });
+ });
+
+ test.describe('input disabled', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ // Validates the display of an input in a disabled state.
+ expect(await item.screenshot()).toMatchSnapshot(`input-disabled-${page.getSnapshotSettings()}.png`);
+ });
+ });
+
+ test.describe('input with lines="full"', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ const input = page.locator('ion-input');
+ // Validates the display of an input with an ion-item using lines="full".
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-lines-full-${page.getSnapshotSettings()}.png`);
+
+ await input.click();
+
+ // Verifies that the parent item receives .item-has-focus when the input is focused.
+ await expect(item).toHaveClass(/item-has-focus/);
+ // Validates the display of an input with an ion-item using lines="full" when focused.
+ expect(await item.screenshot()).toMatchSnapshot(
+ `input-with-lines-full-focused-${page.getSnapshotSettings()}.png`
+ );
+ });
+ });
+
+ test.describe('input with lines="inset"', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ const input = page.locator('ion-input');
+ // Validates the display of an input with an ion-item using lines="inset".
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-lines-inset-${page.getSnapshotSettings()}.png`);
+
+ await input.click();
+
+ // Verifies that the parent item receives .item-has-focus when the input is focused.
+ await expect(item).toHaveClass(/item-has-focus/);
+
+ // Validates the display of an input with an ion-item using lines="inset" when focused.
+ expect(await item.screenshot()).toMatchSnapshot(
+ `input-with-lines-inset-focused-${page.getSnapshotSettings()}.png`
+ );
+ });
+ });
+
+ test.describe('input with lines="none"', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ const input = page.locator('ion-input');
+ // Validates the display of an input with an ion-item using lines="none".
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-lines-none-${page.getSnapshotSettings()}.png`);
+
+ await input.click();
+
+ // Verifies that the parent item receives .item-has-focus when the input is focused.
+ await expect(item).toHaveClass(/item-has-focus/);
+
+ // Validates the display of an input with an ion-item using lines="none" when focused.
+ expect(await item.screenshot()).toMatchSnapshot(
+ `input-with-lines-none-focused-${page.getSnapshotSettings()}.png`
+ );
+ });
+ });
+
+ test.describe('input with clear button', () => {
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setContent(`
+
+
+
+ Clear Input
+
+
+
+
+ `);
+ const item = page.locator('ion-item');
+ // Validates the display of an input with a clear button.
+ expect(await item.screenshot()).toMatchSnapshot(`input-with-clear-button-${page.getSnapshotSettings()}.png`);
+ });
+ });
+});
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..f6e9ae0038
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..629eada7ba
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..74e4cfee94
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..8679f28a00
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..e99be4dbd7
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..43c7471d2b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..de89b6458b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..6be49d5ff0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..3e4eb3c1a3
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..a52ac21665
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..9c0b525f25
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..b83848a90d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-disabled-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6901495976
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..39a8fc85f6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..f5afb6bf22
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..244d498c08
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..09948e2dd7
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..0e532d32a2
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..66e86b7de5
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..fff75b5e96
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..e9c67cc50f
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..917b3e6552
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..ef962665ca
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..b7fdde0a7c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-clear-button-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..709c3704d0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..a1fc100c34
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..1ebc73c6fc
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..84a8b1986e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..7262481fce
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..42f1dfbc9c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..61ed286bd8
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..521c9ac431
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..da9c7808d0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..f4a6ef51d0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..fec7dfde8d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..afb0f2253c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-focused-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..b28a10e0d7
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..a1fc100c34
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..1ebc73c6fc
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..f96bfd23c1
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..7262481fce
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..42f1dfbc9c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..c0c01f05f0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..5e805da91b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..67cd2dffca
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..f3c657bc7d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..9eaf4dd301
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7b7190369a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-full-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..60045f327a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..4dd33e8bad
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7587ec3f62
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..e58d0a3b3d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..e77f5ffb4a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5f21350912
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..1365318546
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..6307fa218b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..8fed46cfe6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..8905149871
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..16f061c683
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..f9d70b04ef
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-focused-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..e9d12756b8
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..4dd33e8bad
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7587ec3f62
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..e1497902df
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..e77f5ffb4a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5f21350912
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..0aa0eb576a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..6307fa218b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..8fed46cfe6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..82e344fa40
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..16f061c683
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..f9d70b04ef
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-inset-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..61d503fb0c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..275916ff41
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5e12214b07
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..746ebae242
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..acea7c81f6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..55cf71c50e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..a3d4706fc8
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..c49b8278e4
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..578f3caff9
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6a567aa1eb
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..a7e0ccae8a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..592210caff
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-focused-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..ae8957d65e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..275916ff41
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5e12214b07
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..394f0b786e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..acea7c81f6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..55cf71c50e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6ab89d9f7c
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..c49b8278e4
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..578f3caff9
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..7e16632977
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..a7e0ccae8a
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..592210caff
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-lines-none-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..1328015512
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..4952c58e1d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..70425c2c29
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..0261e6fa6d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..0c25a1a4a5
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..a626eb969b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..469c3e8d0d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..964803e42d
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5076ca03a6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..4165baf79b
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..1633282b16
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..145a1d7ce2
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-placeholder-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..d491cbc5da
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..bfee074f84
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..9d0629e84f
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..58efd2a8e9
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..6bf43fb9dd
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..0521c8f3ed
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6da94bf4a0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..835b3e00b6
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..07f3459fb0
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..b8b480c89e
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..67129cd0c9
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..0239fc0a95
Binary files /dev/null and b/core/src/components/input/test/basic/input.e2e.ts-snapshots/input-with-text-overflow-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/masking/e2e.ts b/core/src/components/input/test/masking/e2e.ts
deleted file mode 100644
index 16f6ee0e8a..0000000000
--- a/core/src/components/input/test/masking/e2e.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('input: masking', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/masking?ionic:_testing=true',
- });
-
- const inputTrimmed = await page.find('#inputTrimmed');
-
- await inputTrimmed.click();
-
- await page.keyboard.type('S p a c e s');
-
- const currentValue = await page.$eval('#inputTrimmed', (el: any) => {
- return el.value;
- });
-
- expect(currentValue).toEqual('Spaces');
-});
diff --git a/core/src/components/input/test/masking/input.e2e.ts b/core/src/components/input/test/masking/input.e2e.ts
new file mode 100644
index 0000000000..2bbd36864a
--- /dev/null
+++ b/core/src/components/input/test/masking/input.e2e.ts
@@ -0,0 +1,20 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('input: masking', () => {
+ test.beforeEach(async ({ page }) => {
+ await page.goto('/src/components/input/test/masking');
+ });
+
+ test('should filter out spaces', async ({ page }, testInfo) => {
+ test.skip(testInfo.project.metadata.rtl === true, 'Does not test LTR vs. RTL layout.');
+
+ const input = page.locator('#inputTrimmed');
+
+ await input.click();
+
+ await page.keyboard.type('S p a c e s');
+
+ await expect(input).toHaveJSProperty('value', 'Spaces');
+ });
+});
diff --git a/core/src/components/input/test/spec/e2e.ts b/core/src/components/input/test/spec/e2e.ts
deleted file mode 100644
index ccac6c50bd..0000000000
--- a/core/src/components/input/test/spec/e2e.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('input: spec', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/spec?ionic:_testing=true',
- });
-
- const compares = [];
-
- compares.push(await page.compareScreenshot());
-
- for (const compare of compares) {
- expect(compare).toMatchScreenshot();
- }
-});
-
-test('input:rtl: spec', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/spec?ionic:_testing=true&rtl=true',
- });
-
- const compares = [];
-
- compares.push(await page.compareScreenshot());
-
- for (const compare of compares) {
- expect(compare).toMatchScreenshot();
- }
-});
diff --git a/core/src/components/input/test/spec/input.e2e.ts b/core/src/components/input/test/spec/input.e2e.ts
new file mode 100644
index 0000000000..29c5e4c3cb
--- /dev/null
+++ b/core/src/components/input/test/spec/input.e2e.ts
@@ -0,0 +1,14 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('input: spec', () => {
+ test.beforeEach(async ({ page }) => {
+ await page.goto('/src/components/input/test/spec');
+ });
+
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setIonViewport();
+
+ expect(await page.screenshot()).toMatchSnapshot(`input-spec-diff-${page.getSnapshotSettings()}.png`);
+ });
+});
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..ef43b89c1a
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..8cc1980f3a
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..9a224ab70c
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..2c65c97601
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..784e7a4598
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..a30bffa0f0
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..e337c5f9d0
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..b3af93ad11
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..f162bcd51a
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..ec3cb62b31
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..3c329f6db7
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..7be469c54f
Binary files /dev/null and b/core/src/components/input/test/spec/input.e2e.ts-snapshots/input-spec-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/standalone/e2e.ts b/core/src/components/input/test/standalone/e2e.ts
deleted file mode 100644
index 5ca72ca00d..0000000000
--- a/core/src/components/input/test/standalone/e2e.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-
-test('input: standalone', async () => {
- const page = await newE2EPage({
- url: '/src/components/input/test/standalone?ionic:_testing=true',
- });
-
- const compare = await page.compareScreenshot();
- expect(compare).toMatchScreenshot();
-});
diff --git a/core/src/components/input/test/standalone/input.e2e.ts b/core/src/components/input/test/standalone/input.e2e.ts
new file mode 100644
index 0000000000..5fbadf5c94
--- /dev/null
+++ b/core/src/components/input/test/standalone/input.e2e.ts
@@ -0,0 +1,14 @@
+import { expect } from '@playwright/test';
+import { test } from '@utils/test/playwright';
+
+test.describe('input: standalone', () => {
+ test.beforeEach(async ({ page }) => {
+ await page.goto('/src/components/input/test/standalone');
+ });
+
+ test('should not have visual regressions', async ({ page }) => {
+ await page.setIonViewport();
+
+ expect(await page.screenshot()).toMatchSnapshot(`input-standalone-diff-${page.getSnapshotSettings()}.png`);
+ });
+});
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..4b166ad852
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..f05ed5a08b
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..6602cf2b6a
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..ee09b87f30
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..83c02b07ee
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..44afe3ba1a
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..6beaa43be7
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..84cbecc763
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5b6f904f47
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..7bb35a8fbc
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..08516a3115
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..5569da2be2
Binary files /dev/null and b/core/src/components/input/test/standalone/input.e2e.ts-snapshots/input-standalone-diff-md-rtl-Mobile-Safari-linux.png differ