chore: Removes dependencies on React <19 in test utils

cloudscape-design · Feb 5, 2025 · 7e789e9 · 7e789e9
1 parent 89612ae
commit 7e789e9
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 8 deletions.
diff --git a/src/test-utils/dom/input/base-input.ts b/src/test-utils/dom/input/base-input.ts
@@ -1,6 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { Simulate } from 'react-dom/test-utils';
 
 import { ComponentWrapper, ElementWrapper, usesDom } from '@cloudscape-design/test-utils-core/dom';
 import { act } from '@cloudscape-design/test-utils-core/utils-dom';
@@ -45,7 +44,9 @@ export default abstract class BaseInputWrapper extends ComponentWrapper {
   @usesDom setInputValue(value: string): void {
     const element = this.findNativeInput().getElement();
     act(() => {
-      Simulate.change(element, { target: { value } as unknown as EventTarget });
+      const event = new Event('change', { bubbles: true, cancelable: false });
+      setNativeValue(element, value);
+      element.dispatchEvent(event);
     });
   }
 
@@ -54,3 +55,20 @@ export default abstract class BaseInputWrapper extends ComponentWrapper {
     return this.findNativeInput().getElement().hasAttribute('disabled');
   }
 }
+
+// Copied from @testing-library/dom/dist/events.js
+function setNativeValue(element: Element, value: string): void {
+  const { set: valueSetter } = Object.getOwnPropertyDescriptor(element, 'value') || {};
+  const prototype = Object.getPrototypeOf(element);
+  const { set: prototypeValueSetter } = Object.getOwnPropertyDescriptor(prototype, 'value') || {};
+
+  if (prototypeValueSetter && valueSetter !== prototypeValueSetter) {
+    prototypeValueSetter.call(element, value);
+  } else {
+    if (valueSetter) {
+      valueSetter.call(element, value);
+    } else {
+      throw new Error('The given element does not have a value setter');
+    }
+  }
+}
diff --git a/src/test-utils/dom/prompt-input/index.ts b/src/test-utils/dom/prompt-input/index.ts
@@ -1,6 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { Simulate } from 'react-dom/test-utils';
 
 import { ComponentWrapper, ElementWrapper, usesDom } from '@cloudscape-design/test-utils-core/dom';
 import { act } from '@cloudscape-design/test-utils-core/utils-dom';
@@ -41,9 +40,28 @@ export default class PromptInputWrapper extends ComponentWrapper {
    * @param value value to set the textarea to.
    */
   @usesDom setTextareaValue(value: string): void {
-    const element: HTMLTextAreaElement = this.findNativeTextarea().getElement();
+    const element = this.findNativeTextarea().getElement();
     act(() => {
-      Simulate.change(element, { target: { value } as unknown as EventTarget });
+      const event = new Event('change', { bubbles: true, cancelable: false });
+      setNativeValue(element, value);
+      element.dispatchEvent(event);
     });
   }
 }
+
+// Copied from @testing-library/dom/dist/events.js
+function setNativeValue(element: Element, value: string): void {
+  const { set: valueSetter } = Object.getOwnPropertyDescriptor(element, 'value') || {};
+  const prototype = Object.getPrototypeOf(element);
+  const { set: prototypeValueSetter } = Object.getOwnPropertyDescriptor(prototype, 'value') || {};
+
+  if (prototypeValueSetter && valueSetter !== prototypeValueSetter) {
+    prototypeValueSetter.call(element, value);
+  } else {
+    if (valueSetter) {
+      valueSetter.call(element, value);
+    } else {
+      throw new Error('The given element does not have a value setter');
+    }
+  }
+}
diff --git a/src/test-utils/dom/textarea/index.ts b/src/test-utils/dom/textarea/index.ts
@@ -1,6 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { Simulate } from 'react-dom/test-utils';
 
 import { ComponentWrapper, ElementWrapper, usesDom } from '@cloudscape-design/test-utils-core/dom';
 import { act } from '@cloudscape-design/test-utils-core/utils-dom';
@@ -29,9 +28,28 @@ export default class TextareaWrapper extends ComponentWrapper<HTMLTextAreaElemen
    * @param value value to set the textarea to.
    */
   @usesDom setTextareaValue(value: string): void {
-    const element: HTMLTextAreaElement = this.findNativeTextarea().getElement();
+    const element = this.findNativeTextarea().getElement();
     act(() => {
-      Simulate.change(element, { target: { value } as unknown as EventTarget });
+      const event = new Event('change', { bubbles: true, cancelable: false });
+      setNativeValue(element, value);
+      element.dispatchEvent(event);
     });
   }
 }
+
+// Copied from @testing-library/dom/dist/events.js
+function setNativeValue(element: Element, value: string): void {
+  const { set: valueSetter } = Object.getOwnPropertyDescriptor(element, 'value') || {};
+  const prototype = Object.getPrototypeOf(element);
+  const { set: prototypeValueSetter } = Object.getOwnPropertyDescriptor(prototype, 'value') || {};
+
+  if (prototypeValueSetter && valueSetter !== prototypeValueSetter) {
+    prototypeValueSetter.call(element, value);
+  } else {
+    if (valueSetter) {
+      valueSetter.call(element, value);
+    } else {
+      throw new Error('The given element does not have a value setter');
+    }
+  }
+}