The type of this is not event.currentTarget onChange events

[esanzgar]

• Check if updating to the latest Preact version resolves the issue

Describe the bug
The type of this onChange events is not event.currentTarget as the type definition implies:

preact/src/jsx.d.ts

Lines 368 to 373 in c7f57db

	interface EventHandler<E extends TargetedEvent> {
	/**
	* The `this` keyword always points to the DOM element the event handler
	* was invoked on. See: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers#Event_handlers_parameters_this_binding_and_the_return_value
	*/
	(this: E['currentTarget'], event: E): void;

Also implied in this test:

preact/test/ts/Component-test.tsx

Lines 5 to 9 in c7f57db

	// Test `this` binding on event handlers
	function onHandler(this: HTMLInputElement, event: any) {
	return this.value;
	}
	const foo = <input onChange={onHandler} />;

To Reproduce

https://codesandbox.io/embed/ancient-tree-6kj30?expanddevtools=1

Steps to reproduce the behavior:

1. Click on the input checkbox
2. See error in the console

Expected behavior
The type of this should be the same as event.currentTarget

[developit]

I believe this was intentionally removed in order to prevent misleading this usage in event handlers that was also incompatible with React. Personally I would like to amend the TypeScript types to reflect this, and simply have the context of events be never or some value that implies it is not to be used.

[esanzgar]

I see that now this has changed to type of never:

preact/src/jsx.d.ts

Lines 370 to 376 in 2af05f5

	export interface EventHandler<E extends TargetedEvent> {
	/**
	* The `this` keyword always points to the DOM element the event handler
	* was invoked on. See: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers#Event_handlers_parameters_this_binding_and_the_return_value
	*/
	(this: never, event: E): void;
	}

Could you advise how can I create a wrapper around a native onClick prop? Before the above change, I used to do that like this: onClick?.call(this, event) but that throws an error now.

Same example in React:

https://www.staging-typescript.org/play?ts=4.6.0-dev.20220116&q=114#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcARFDvmQNwBQduEAdqvALICeAwgK5skAkszC94AXjgAKAN4tuAG2C4A1gBo4AOm2U2AXwBcmKjE0ARLDGTAFWACYAJACrsAMgAViYVAB5seU2FRGGc3AEEYGChgACMxLF9Q1yCxAFFbECxmGAA+DSSUmHSsTOycgEo4cRy4GTo4OCZWeBAefhgSRWUVKuksADcsmCNjAM12CH4sVMHsnwKRNIyhjQmpmaGKqpq6hoam1AhbTQUIAHMpAHJcJVV7S-L6Pbh5W5UAfk0pAaHH+rg9PR-pQYLwoMw4D5gIt4K9uuIZK0+AIQF1VHpatpNLoYHocj4APTQ4I5eiAoA