Golf down compat (#5025)

* Make useFlushSync do sync flushes

* Golf bytes to offset change

* Some more golfing

* Revert "Make useFlushSync do sync flushes"

This reverts commit 001bbce.

Author: JoviDeCroock

compat/src/index.js

@@ -78,7 +78,7 @@ function isMemo(element) {
 	return (
 		!!element &&
 		typeof element.displayName == 'string' &&
-		element.displayName.startsWith('Memo(')
+		element.displayName.indexOf('Memo(') == 0
 	);
 }
 
@@ -141,12 +141,6 @@ const unstable_batchedUpdates = (callback, arg) => callback(arg);
  */
 const flushSync = (callback, arg) => callback(arg);
 
-/**
- * Strict Mode is not implemented in Preact, so we provide a stand-in for it
- * that just renders its children without imposing any restrictions.
- */
-const StrictMode = Fragment;
-
 // compat to react-is
 export const isElement = isValidElement;
 
@@ -180,7 +174,7 @@ export {
 	useTransition,
 	// eslint-disable-next-line camelcase
 	unstable_batchedUpdates,
-	StrictMode,
+	Fragment as StrictMode,
 	Suspense,
 	SuspenseList,
 	lazy,
@@ -228,7 +222,7 @@ export default {
 	forwardRef,
 	flushSync,
 	unstable_batchedUpdates,
-	StrictMode,
+	StrictMode: Fragment,
 	Suspense,
 	SuspenseList,
 	lazy,

compat/src/memo.js

@@ -11,25 +11,21 @@ import { shallowDiffers } from './util';
 export function memo(c, comparer) {
 	function shouldUpdate(nextProps) {
 		let ref = this.props.ref;
-		let updateRef = ref == nextProps.ref;
-		if (!updateRef && ref) {
-			ref.call ? ref(null) : (ref.current = null);
+		if (ref != nextProps.ref && ref) {
+			typeof ref == 'function' ? ref(null) : (ref.current = null);
 		}
 
-		if (!comparer) {
-			return shallowDiffers(this.props, nextProps);
-		}
-
-		return !comparer(this.props, nextProps) || !updateRef;
+		return comparer
+			? !comparer(this.props, nextProps) || ref != nextProps.ref
+			: shallowDiffers(this.props, nextProps);
 	}
 
 	function Memoed(props) {
 		this.shouldComponentUpdate = shouldUpdate;
 		return createElement(c, props);
 	}
 	Memoed.displayName = 'Memo(' + (c.displayName || c.name) + ')';
-	Memoed.prototype.isReactComponent = true;
-	Memoed._forwarded = true;
+	Memoed._forwarded = Memoed.prototype.isReactComponent = true;
 	Memoed.type = c;
 	return Memoed;
 }

compat/src/render.js

@@ -45,7 +45,7 @@ const onChangeInputType = type =>
 	).test(type);
 
 // Some libraries like `react-virtualized` explicitly check for this.
-Component.prototype.isReactComponent = {};
+Component.prototype.isReactComponent = true;
 
 // `UNSAFE_*` lifecycle hooks
 // Preact only ever invokes the unprefixed methods.
@@ -105,24 +105,17 @@ let oldEventHook = options.event;
 options.event = e => {
 	if (oldEventHook) e = oldEventHook(e);
 
-	e.persist = empty;
-	e.isPropagationStopped = isPropagationStopped;
-	e.isDefaultPrevented = isDefaultPrevented;
+	e.persist = () => {};
+	e.isPropagationStopped = function isPropagationStopped() {
+		return this.cancelBubble;
+	};
+	e.isDefaultPrevented = function isDefaultPrevented() {
+		return this.defaultPrevented;
+	};
 	return (e.nativeEvent = e);
 };
 
-function empty() {}
-
-function isPropagationStopped() {
-	return this.cancelBubble;
-}
-
-function isDefaultPrevented() {
-	return this.defaultPrevented;
-}
-
 const classNameDescriptorNonEnumberable = {
-	enumerable: false,
 	configurable: true,
 	get() {
 		return this.class;
@@ -132,9 +125,9 @@ const classNameDescriptorNonEnumberable = {
 function handleDomVNode(vnode) {
 	let props = vnode.props,
 		type = vnode.type,
-		normalizedProps = {};
+		normalizedProps = {},
+		isNonDashedType = type.indexOf('-') == -1;
 
-	let isNonDashedType = type.indexOf('-') === -1;
 	for (let i in props) {
 		let value = props[i];
 
@@ -198,30 +191,28 @@ function handleDomVNode(vnode) {
 		normalizedProps[i] = value;
 	}
 
-	// Add support for array select values: <select multiple value={[]} />
-	if (
-		type == 'select' &&
-		normalizedProps.multiple &&
-		Array.isArray(normalizedProps.value)
-	) {
-		// forEach() always returns undefined, which we abuse here to unset the value prop.
-		normalizedProps.value = toChildArray(props.children).forEach(child => {
-			child.props.selected =
-				normalizedProps.value.indexOf(child.props.value) != -1;
-		});
-	}
-
-	// Adding support for defaultValue in select tag
-	if (type == 'select' && normalizedProps.defaultValue != null) {
-		normalizedProps.value = toChildArray(props.children).forEach(child => {
-			if (normalizedProps.multiple) {
-				child.props.selected =
-					normalizedProps.defaultValue.indexOf(child.props.value) != -1;
-			} else {
+	if (type == 'select') {
+		// Add support for array select values: <select multiple value={[]} />
+		if (normalizedProps.multiple && Array.isArray(normalizedProps.value)) {
+			// forEach() always returns undefined, which we abuse here to unset the value prop.
+			normalizedProps.value = toChildArray(props.children).forEach(child => {
 				child.props.selected =
-					normalizedProps.defaultValue == child.props.value;
-			}
-		});
+					normalizedProps.value.indexOf(child.props.value) != -1;
+			});
+		}
+
+		// Adding support for defaultValue in select tag
+		if (normalizedProps.defaultValue != null) {
+			normalizedProps.value = toChildArray(props.children).forEach(child => {
+				if (normalizedProps.multiple) {
+					child.props.selected =
+						normalizedProps.defaultValue.indexOf(child.props.value) != -1;
+				} else {
+					child.props.selected =
+						normalizedProps.defaultValue == child.props.value;
+				}
+			});
+		}
 	}
 
 	if (props.class && !props.className) {

compat/src/suspense.js

@@ -245,9 +245,7 @@ Suspense.prototype.render = function (props, state) {
  * @returns {((unsuspend: () => void) => void)?}
  */
 export function suspended(vnode) {
-	if (!vnode._parent) return null;
-	/** @type {import('./internal').Component} */
-	let component = vnode._parent._component;
+	let component = vnode._parent && vnode._parent._component;
 	return component && component._suspended && component._suspended(vnode);
 }
 

compat/test/browser/PureComponent.test.js

@@ -151,6 +151,6 @@ describe('PureComponent', () => {
 
 	it('should have "isPureReactComponent" property', () => {
 		let Pure = new React.PureComponent();
-		expect(Pure.isReactComponent).to.deep.equal({});
+		expect(Pure.isReactComponent).to.deep.equal(true);
 	});
 });

compat/test/browser/component.test.js

@@ -20,7 +20,7 @@ describe('components', () => {
 
 	it('should have "isReactComponent" property', () => {
 		let Comp = new React.Component();
-		expect(Comp.isReactComponent).to.deep.equal({});
+		expect(Comp.isReactComponent).to.deep.equal(true);
 	});
 
 	it('should be sane', () => {