diff --git a/tests/setup.ts b/tests/setup.ts
index d6eb1d0..74e5a05 100644
--- a/tests/setup.ts
+++ b/tests/setup.ts
@@ -41,13 +41,12 @@ export const PluginSettingTab = class {
   }
 };
 
-export const TextComponent = class {
-  inputEl: HTMLInputElement;
-  private changeHandler?: (value: string) => void;
+class BaseTextComponent<T extends HTMLInputElement | HTMLTextAreaElement> {
+  inputEl: T;
+  protected changeHandler?: (value: string) => void;
 
-  constructor(containerEl?: HTMLElement) {
-    this.inputEl = document.createElement('input');
-    containerEl?.appendChild(this.inputEl);
+  constructor(inputEl: T) {
+    this.inputEl = inputEl;
   }
 
   setPlaceholder(value: string) {
@@ -69,35 +68,21 @@ export const TextComponent = class {
     this.inputEl.value = value;
     this.changeHandler?.(value);
   }
+}
+
+export const TextComponent = class extends BaseTextComponent<HTMLInputElement> {
+  constructor(containerEl?: HTMLElement) {
+    const inputEl = document.createElement('input');
+    containerEl?.appendChild(inputEl);
+    super(inputEl);
+  }
 };
 
-export const TextAreaComponent = class {
-  inputEl: HTMLTextAreaElement;
-  private changeHandler?: (value: string) => void;
-
+export const TextAreaComponent = class extends BaseTextComponent<HTMLTextAreaElement> {
   constructor(containerEl?: HTMLElement) {
-    this.inputEl = document.createElement('textarea');
-    containerEl?.appendChild(this.inputEl);
-  }
-
-  setPlaceholder(value: string) {
-    this.inputEl.placeholder = value;
-    return this;
-  }
-
-  setValue(value: string) {
-    this.inputEl.value = value;
-    return this;
-  }
-
-  onChange(handler: (value: string) => void) {
-    this.changeHandler = handler;
-    return this;
-  }
-
-  triggerChange(value: string) {
-    this.inputEl.value = value;
-    this.changeHandler?.(value);
+    const inputEl = document.createElement('textarea');
+    containerEl?.appendChild(inputEl);
+    super(inputEl);
   }
 };