diff --git a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts
index 8343c4280..e9ce47209 100644
--- a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts
+++ b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts
@@ -1,33 +1,45 @@
 import { test } from 'stencil-playwright';
 import { expect } from '@playwright/test';
+import {
+  testConfigurations,
+  getTestDescribeText,
+  setupPage,
+} from '../../../../utils/testConfiguration';
 
 const componentTestPath = 'src/components/textarea/test/basic/index.html';
+const componentName = 'tds-textarea';
 
-test.describe.parallel('tds-textarea', () => {
-  test('renders default textarea correctly', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const tdsTextarea = page.getByTestId('tds-textarea-testid');
-    await expect(tdsTextarea).toHaveCount(1);
+testConfigurations.withModeVariants.forEach((config) => {
+  test.describe.parallel(getTestDescribeText(config, componentName), () => {
+    test.beforeEach(async ({ page }) => {
+      await setupPage(page, config, componentTestPath, componentName);
+    });
 
-    /* Expect no difference in screenshot  */
-    await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
-  });
+    test('renders default textarea correctly', async ({ page }) => {
+      const tdsTextarea = page.getByTestId('tds-textarea-testid');
+      await expect(tdsTextarea).toHaveCount(1);
+
+      /* Expect no difference in screenshot  */
+      await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
+    });
 
-  test('test if able to type in textarea', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const textarea = page.getByRole('textbox');
+    test('test if able to type in textarea', async ({ page }) => {
+      const textarea = page.getByRole('textbox');
 
-    /* Expect to have received an event from clicking on the textarea */
-    const myEventSpy = await page.spyOnEvent('click');
-    await textarea.click();
-    expect(myEventSpy).toHaveReceivedEvent();
+      /* Expect to have received an event from clicking on the textarea */
+      const myEventSpy = await page.spyOnEvent('click');
+      await textarea.click();
+      expect(myEventSpy).toHaveReceivedEvent();
 
-    /* Expect the textbox to have the cursor text style */
-    const textareaCursorState = await textarea.evaluate((style) => getComputedStyle(style).cursor);
-    expect(textareaCursorState).toBe('text');
+      /* Expect the textbox to have the cursor text style */
+      const textareaCursorState = await textarea.evaluate(
+        (style) => getComputedStyle(style).cursor,
+      );
+      expect(textareaCursorState).toBe('text');
 
-    /* Expect the inputValue of textarea to have "Adding some text" after it has been typed */
-    await textarea.fill('Adding some text');
-    expect(await textarea.inputValue()).toBe('Adding some text');
+      /* Expect the inputValue of textarea to have "Adding some text" after it has been typed */
+      await textarea.fill('Adding some text');
+      expect(await textarea.inputValue()).toBe('Adding some text');
+    });
   });
 });
diff --git a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-darkmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-darkmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..8610f915c
Binary files /dev/null and b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-darkmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-lightmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-lightmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..2d5c4bf8c
Binary files /dev/null and b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-primary-lightmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-darkmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-darkmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..047a04feb
Binary files /dev/null and b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-darkmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-lightmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-lightmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..f7f424ff0
Binary files /dev/null and b/packages/core/src/components/textarea/test/basic/textarea.e2e.ts-snapshots/tds-textarea-secondary-lightmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts b/packages/core/src/components/textarea/test/default/textarea.e2e.ts
index 6e953c946..a46682578 100644
--- a/packages/core/src/components/textarea/test/default/textarea.e2e.ts
+++ b/packages/core/src/components/textarea/test/default/textarea.e2e.ts
@@ -1,43 +1,55 @@
 import { test } from 'stencil-playwright';
 import { expect } from '@playwright/test';
+import {
+  testConfigurations,
+  getTestDescribeText,
+  setupPage,
+} from '../../../../utils/testConfiguration';
 
 const componentTestPath = 'src/components/textarea/test/default/index.html';
-
-test.describe.parallel('tds-textarea-default', () => {
-  test('renders default textarea correctly', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const tdsTextarea = page.getByTestId('tds-textarea-testid');
-    await expect(tdsTextarea).toHaveCount(1);
-
-    /* Expect no difference in screenshot  */
-    await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
-  });
-
-  test('test if able to type in textarea', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const textarea = page.getByRole('textbox');
-
-    /* Expect to have received an event from clicking on the textarea */
-    const myEventSpy = await page.spyOnEvent('click');
-    await textarea.click();
-    expect(myEventSpy).toHaveReceivedEvent();
-
-    /* Expect the textbox to have the cursor text style */
-    const textareaCursorState = await textarea.evaluate((style) => getComputedStyle(style).cursor);
-    expect(textareaCursorState).toBe('text');
-
-    /* Expect the inputValue of textarea to have "Adding some text" after it has been typed */
-    await textarea.fill('Adding some text');
-    expect(await textarea.inputValue()).toBe('Adding some text');
-
-    /* Expect no difference in screenshot  */
-    await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
-  });
-
-  test('not able to find label if "no-label" is set', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const textareaLabel = page.getByText('Label');
-    await expect(textareaLabel).toHaveCount(0);
-    await expect(textareaLabel).toBeHidden();
+const componentName = 'tds-textarea';
+const testDescription = 'tds-textarea-default';
+
+testConfigurations.withModeVariants.forEach((config) => {
+  test.describe.parallel(getTestDescribeText(config, testDescription), () => {
+    test.beforeEach(async ({ page }) => {
+      await setupPage(page, config, componentTestPath, componentName);
+    });
+
+    test('renders default textarea correctly', async ({ page }) => {
+      const tdsTextarea = page.getByTestId('tds-textarea-testid');
+      await expect(tdsTextarea).toHaveCount(1);
+
+      /* Expect no difference in screenshot  */
+      await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
+    });
+
+    test('test if able to type in textarea', async ({ page }) => {
+      const textarea = page.getByRole('textbox');
+
+      /* Expect to have received an event from clicking on the textarea */
+      const myEventSpy = await page.spyOnEvent('click');
+      await textarea.click();
+      expect(myEventSpy).toHaveReceivedEvent();
+
+      /* Expect the textbox to have the cursor text style */
+      const textareaCursorState = await textarea.evaluate(
+        (style) => getComputedStyle(style).cursor,
+      );
+      expect(textareaCursorState).toBe('text');
+
+      /* Expect the inputValue of textarea to have "Adding some text" after it has been typed */
+      await textarea.fill('Adding some text');
+      expect(await textarea.inputValue()).toBe('Adding some text');
+
+      /* Expect no difference in screenshot  */
+      await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
+    });
+
+    test('not able to find label if "no-label" is set', async ({ page }) => {
+      const textareaLabel = page.getByText('Label');
+      await expect(textareaLabel).toHaveCount(0);
+      await expect(textareaLabel).toBeHidden();
+    });
   });
 });
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..71c49e56f
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-test-if-able-to-type-in-textarea-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-test-if-able-to-type-in-textarea-1-linux.png
new file mode 100644
index 000000000..842f6f0e6
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-darkmode-test-if-able-to-type-in-textarea-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..222864960
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-test-if-able-to-type-in-textarea-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-test-if-able-to-type-in-textarea-1-linux.png
new file mode 100644
index 000000000..efa5d5411
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-primary-lightmode-test-if-able-to-type-in-textarea-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..e5ef477bd
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-test-if-able-to-type-in-textarea-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-test-if-able-to-type-in-textarea-1-linux.png
new file mode 100644
index 000000000..99256b761
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-darkmode-test-if-able-to-type-in-textarea-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-renders-default-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-renders-default-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..1d22844f0
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-renders-default-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-test-if-able-to-type-in-textarea-1-linux.png b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-test-if-able-to-type-in-textarea-1-linux.png
new file mode 100644
index 000000000..c4f80d613
Binary files /dev/null and b/packages/core/src/components/textarea/test/default/textarea.e2e.ts-snapshots/tds-textarea-default-secondary-lightmode-test-if-able-to-type-in-textarea-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts
index babc9c59a..10552423f 100644
--- a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts
+++ b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts
@@ -1,33 +1,45 @@
 import { test } from 'stencil-playwright';
 import { expect } from '@playwright/test';
+import {
+  testConfigurations,
+  getTestDescribeText,
+  setupPage,
+} from '../../../../utils/testConfiguration';
 
 const componentTestPath = 'src/components/textarea/test/read-only/index.html';
+const componentName = 'tds-textarea';
+const testDescription = 'tds-textarea-read-only';
 
-test.describe.parallel('tds-textarea-read-only', () => {
-  test('renders read-only textarea correctly', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const tdsTextarea = page.getByTestId('tds-textarea-testid');
-    await expect(tdsTextarea).toHaveCount(1);
+testConfigurations.withModeVariants.forEach((config) => {
+  test.describe.parallel(getTestDescribeText(config, testDescription), () => {
+    test.beforeEach(async ({ page }) => {
+      await setupPage(page, config, componentTestPath, componentName);
+    });
 
-    /* Expect the tds-textarea to have the read-only attribute */
-    await expect(tdsTextarea).toHaveAttribute('read-only');
+    test('renders read-only textarea correctly', async ({ page }) => {
+      const tdsTextarea = page.getByTestId('tds-textarea-testid');
+      await expect(tdsTextarea).toHaveCount(1);
 
-    /* Expect no diff on screenshot */
-    await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
-  });
+      /* Expect the tds-textarea to have the read-only attribute */
+      await expect(tdsTextarea).toHaveAttribute('read-only');
 
-  test('read-only textarea - native textarea should have readonly attribute', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const textarea = page.getByRole('textbox');
+      /* Expect no diff on screenshot */
+      await expect(page).toHaveScreenshot({ maxDiffPixels: 0 });
+    });
 
-    /* Expect the textarea within tds-textarea to have the readonly attribute */
-    await expect(textarea).toHaveAttribute('readonly');
-  });
+    test('read-only textarea - native textarea should have readonly attribute', async ({
+      page,
+    }) => {
+      const textarea = page.getByRole('textbox');
+
+      /* Expect the textarea within tds-textarea to have the readonly attribute */
+      await expect(textarea).toHaveAttribute('readonly');
+    });
 
-  test('be able to find label if "outside" is set', async ({ page }) => {
-    await page.goto(componentTestPath);
-    const textareaLabel = page.getByText('Label');
-    await expect(textareaLabel).toHaveCount(1);
-    await expect(textareaLabel).toBeVisible();
+    test('be able to find label if "outside" is set', async ({ page }) => {
+      const textareaLabel = page.getByText('Label');
+      await expect(textareaLabel).toHaveCount(1);
+      await expect(textareaLabel).toBeVisible();
+    });
   });
 });
diff --git a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-darkmode-renders-read-only-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-darkmode-renders-read-only-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..9ce07c03e
Binary files /dev/null and b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-darkmode-renders-read-only-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-lightmode-renders-read-only-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-lightmode-renders-read-only-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..a18602f71
Binary files /dev/null and b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-primary-lightmode-renders-read-only-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-darkmode-renders-read-only-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-darkmode-renders-read-only-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..780335ee5
Binary files /dev/null and b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-darkmode-renders-read-only-textarea-correctly-1-linux.png differ
diff --git a/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-lightmode-renders-read-only-textarea-correctly-1-linux.png b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-lightmode-renders-read-only-textarea-correctly-1-linux.png
new file mode 100644
index 000000000..91f7049cf
Binary files /dev/null and b/packages/core/src/components/textarea/test/read-only/textarea.e2e.ts-snapshots/tds-textarea-read-only-secondary-lightmode-renders-read-only-textarea-correctly-1-linux.png differ