fix focus in and out (#4316)

preactjs · Mar 21, 2024 · a59a78c · a59a78c
1 parent b820d8b
commit a59a78c
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/src/diff/props.js b/src/diff/props.js
@@ -55,7 +55,12 @@ export function setProperty(dom, name, value, oldValue, isSvg) {
 			name !== (name = name.replace(/(PointerCapture)$|Capture$/i, '$1'));
 
 		// Infer correct casing for DOM built-in events:
-		if (name.toLowerCase() in dom) name = name.toLowerCase().slice(2);
+		if (
+			name.toLowerCase() in dom ||
+			name === 'onFocusOut' ||
+			name === 'onFocusIn'
+		)
+			name = name.toLowerCase().slice(2);
 		else name = name.slice(2);
 
 		if (!dom._listeners) dom._listeners = {};

diff --git a/test/browser/events.test.js b/test/browser/events.test.js
@@ -227,4 +227,12 @@ describe('event handling', () => {
 			.to.have.been.calledTwice.and.to.have.been.calledWith('gotpointercapture')
 			.and.calledWith('lostpointercapture');
 	});
+
+	it('should support camel-case focus event names', () => {
+		render(<div onFocusIn={() => {}} onFocusOut={() => {}} />, scratch);
+
+		expect(proto.addEventListener)
+			.to.have.been.calledTwice.and.to.have.been.calledWith('focusin')
+			.and.calledWith('focusout');
+	});
 });