Revert controlled components (preactjs#4009)

* Revert "add delay by 1 microtick (preactjs#4005)" This reverts commit bcf365b. * revert controlled components
novari · May 18, 2023 · f5af720 · f5af720
1 parent b69428e
commit f5af720
Show file tree

Hide file tree

Showing 4 changed files with 0 additions and 297 deletions.
diff --git a/compat/src/render.js b/compat/src/render.js
@@ -87,44 +87,12 @@ let oldEventHook = options.event;
 options.event = e => {
 	if (oldEventHook) e = oldEventHook(e);
 
-	/** @type {ControlledTarget} */
-	const target = e.currentTarget;
-	const eventType = e.type;
-	if (
-		(eventType === 'input' || eventType === 'change') &&
-		target._isControlled
-	) {
-		// Note: We can't just send the event to the afterEvent function because
-		// some properties on the event (e.g. currentTarget) will be changed by the
-		// time afterEvent is called. `currentTarget` will be `null` at that point.
-		// The browser reuses event objects for event handlers and just modifies the
-		// relevant properties before invoking the next handler. So whenever we call
-		// afterEvent, if we were to inspect the original Event object, we would see
-		// that the currentTarget is null. So instead we pass the event type and the
-		// target to afterEvent.
-		Promise.resolve().then(() => afterEvent(eventType, target));
-	}
-
 	e.persist = empty;
 	e.isPropagationStopped = isPropagationStopped;
 	e.isDefaultPrevented = isDefaultPrevented;
 	return (e.nativeEvent = e);
 };
 
-/**
- * @typedef {EventTarget & {value: any; checked: any; _isControlled: boolean; _prevValue: any}} ControlledTarget
- * @param {string} eventType
- * @param {ControlledTarget} target
- */
-function afterEvent(eventType, target) {
-	if (target.value != null) {
-		Promise.resolve().then(() => (target.value = target._prevValue));
-	}
-	if (eventType === 'change' && target.checked != null) {
-		Promise.resolve().then(() => (target.checked = target._prevValue));
-	}
-}
-
 function empty() {}
 
 function isPropagationStopped() {
@@ -278,33 +246,8 @@ options.diffed = function (vnode) {
 		oldDiffed(vnode);
 	}
 
-	const type = vnode.type;
 	const props = vnode.props;
 	const dom = vnode._dom;
-	const isControlled = dom && dom._isControlled;
-
-	if (
-		dom != null &&
-		(type === 'input' || type === 'textarea' || type === 'select')
-	) {
-		if (isControlled === false) {
-		} else if (
-			isControlled ||
-			props.oninput ||
-			props.onchange ||
-			props.onChange
-		) {
-			if (props.value != null) {
-				dom._isControlled = true;
-				dom._prevValue = props.value;
-			} else if (props.checked != null) {
-				dom._isControlled = true;
-				dom._prevValue = props.checked;
-			} else {
-				dom._isControlled = false;
-			}
-		}
-	}
 
 	if (
 		dom != null &&

diff --git a/compat/test/browser/controlledInput.test.js b/compat/test/browser/controlledInput.test.js
diff --git a/demo/controlled-inputs.jsx b/demo/controlled-inputs.jsx
diff --git a/demo/index.jsx b/demo/index.jsx
@@ -25,7 +25,6 @@ import SuspenseRouterBug from './suspense-router';
 import NestedSuspenseBug from './nested-suspense';
 import Contenteditable from './contenteditable';
 import { MobXDemo } from './mobx';
-import ControlledInputs from './controlled-inputs';
 
 let isBenchmark = /(\/spiral|\/pythagoras|[#&]bench)/g.test(
 	window.location.href
@@ -136,9 +135,6 @@ class App extends Component {
 						<Link href="/contenteditable" activeClassName="active">
 							contenteditable
 						</Link>
-						<Link href="/controlled-inputs" activeClassName="active">
-							Controlled Inputs
-						</Link>
 					</nav>
 				</header>
 				<main>
@@ -169,7 +165,6 @@ class App extends Component {
 						<SuspenseRouterBug path="/suspense-router" />
 						<NestedSuspenseBug path="/nested-suspense" />
 						<Contenteditable path="/contenteditable" />
-						<ControlledInputs path="/controlled-inputs" />
 					</Router>
 				</main>
 			</div>