Merge pull request #4226 from preactjs/fix-input-event

fix: incorrect oninput event type
preactjs · Dec 8, 2023 · f3d4271 · f3d4271
2 parents 2629e40 + 0c7fd52
commit f3d4271
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 7 deletions.
diff --git a/src/jsx.d.ts b/src/jsx.d.ts
@@ -1441,6 +1441,10 @@ export namespace JSXInternal {
 		Target,
 		FocusEvent
 	>;
+	export type TargetedInputEvent<Target extends EventTarget> = TargetedEvent<
+		Target,
+		InputEvent
+	>;
 	export type TargetedKeyboardEvent<Target extends EventTarget> = TargetedEvent<
 		Target,
 		KeyboardEvent
@@ -1495,6 +1499,9 @@ export namespace JSXInternal {
 	export type GenericEventHandler<Target extends EventTarget> = EventHandler<
 		TargetedEvent<Target>
 	>;
+	export type InputEventHandler<Target extends EventTarget> = EventHandler<
+		TargetedInputEvent<Target>
+	>;
 	export type KeyboardEventHandler<Target extends EventTarget> = EventHandler<
 		TargetedKeyboardEvent<Target>
 	>;
@@ -1504,6 +1511,9 @@ export namespace JSXInternal {
 	export type PointerEventHandler<Target extends EventTarget> = EventHandler<
 		TargetedPointerEvent<Target>
 	>;
+	export type SubmitEventHandler<Target extends EventTarget> = EventHandler<
+		TargetedSubmitEvent<Target>
+	>;
 	export type TouchEventHandler<Target extends EventTarget> = EventHandler<
 		TargetedTouchEvent<Target>
 	>;
@@ -1563,14 +1573,14 @@ export namespace JSXInternal {
 		// Form Events
 		onChange?: GenericEventHandler<Target> | undefined;
 		onChangeCapture?: GenericEventHandler<Target> | undefined;
-		onInput?: GenericEventHandler<Target> | undefined;
-		onInputCapture?: GenericEventHandler<Target> | undefined;
-		onBeforeInput?: GenericEventHandler<Target> | undefined;
-		onBeforeInputCapture?: GenericEventHandler<Target> | undefined;
+		onInput?: InputEventHandler<Target> | undefined;
+		onInputCapture?: InputEventHandler<Target> | undefined;
+		onBeforeInput?: InputEventHandler<Target> | undefined;
+		onBeforeInputCapture?: InputEventHandler<Target> | undefined;
 		onSearch?: GenericEventHandler<Target> | undefined;
 		onSearchCapture?: GenericEventHandler<Target> | undefined;
-		onSubmit?: TargetedSubmitEvent<Target> | undefined;
-		onSubmitCapture?: TargetedSubmitEvent<Target> | undefined;
+		onSubmit?: SubmitEventHandler<Target> | undefined;
+		onSubmitCapture?: SubmitEventHandler<Target> | undefined;
 		onInvalid?: GenericEventHandler<Target> | undefined;
 		onInvalidCapture?: GenericEventHandler<Target> | undefined;
 		onReset?: GenericEventHandler<Target> | undefined;

diff --git a/test/ts/preact.tsx b/test/ts/preact.tsx
@@ -362,7 +362,19 @@ createElement(RefComponentTest, { ref: functionRef }, 'hi');
 h(RefComponentTest, { ref: functionRef }, 'hi');
 
 // Should accept onInput
-const onInput = (e: h.JSX.TargetedEvent<HTMLInputElement>) => {};
+const onInput = (e: h.JSX.TargetedInputEvent<HTMLInputElement>) => {};
 <input onInput={onInput} />;
+<input onInput={e => e.currentTarget.value} />;
 createElement('input', { onInput: onInput });
 h('input', { onInput: onInput });
+
+// Should accept onBeforeInput
+const onBeforeInput = (e: h.JSX.TargetedInputEvent<HTMLInputElement>) => {};
+<input onBeforeInput={e => e.currentTarget.value} />;
+createElement('input', { onBeforeInput: onBeforeInput });
+h('input', { onBeforeInput: onBeforeInput });
+
+const onSubmit = (e: h.JSX.TargetedSubmitEvent<HTMLFormElement>) => {};
+<form onSubmit={e => e.currentTarget.elements} />;
+createElement('form', { onSubmit: onSubmit });
+h('form', { onSubmit: onSubmit });