diff --git a/TODO.md b/TODO.md index e7b94d815a3..3bc7686b1c0 100644 --- a/TODO.md +++ b/TODO.md @@ -1,9 +1,8 @@ - https://github.com/preactjs/preact/pull/4362 - https://github.com/preactjs/preact/pull/4358 - https://github.com/preactjs/preact/pull/4361 -- https://github.com/preactjs/preact/pull/4460 -- https://github.com/preactjs/preact/pull/4453 - Backing VNodes +- Enable removing classes from the bundle - Remove deprecated lifecycle methods - Try to get rid of DOM pointers - Separate mount/update paths diff --git a/compat/src/forwardRef.js b/compat/src/forwardRef.js index 25791285b9c..ddb6422883a 100644 --- a/compat/src/forwardRef.js +++ b/compat/src/forwardRef.js @@ -10,11 +10,7 @@ options._diff = vnode => { if (oldDiffHook) oldDiffHook(vnode); }; -export const REACT_FORWARD_SYMBOL = - (typeof Symbol != 'undefined' && - Symbol.for && - Symbol.for('react.forward_ref')) || - 0xf47; +export const REACT_FORWARD_SYMBOL = Symbol.for('react.forward_ref'); /** * Pass ref down to a child. This is mainly used in libraries with HOCs that diff --git a/compat/src/index.d.ts b/compat/src/index.d.ts index 71dfec5877c..3f2e90b8506 100644 --- a/compat/src/index.d.ts +++ b/compat/src/index.d.ts @@ -307,11 +307,6 @@ declare namespace React { export function flushSync(fn: () => R): R; export function flushSync(fn: (a: A) => R, a: A): R; - export function unstable_batchedUpdates( - callback: (arg?: any) => void, - arg?: any - ): void; - export type PropsWithChildren

= P & { children?: preact.ComponentChildren | undefined; }; diff --git a/compat/src/index.js b/compat/src/index.js index 8c98713561b..d609365ea98 100644 --- a/compat/src/index.js +++ b/compat/src/index.js @@ -122,16 +122,6 @@ function findDOMNode(component) { ); } -/** - * Deprecated way to control batched rendering inside the reconciler, but we - * already schedule in batches inside our rendering code - * @template Arg - * @param {(arg: Arg) => void} callback function that triggers the updated - * @param {Arg} [arg] Optional argument that can be passed to the callback - */ -// eslint-disable-next-line camelcase -const unstable_batchedUpdates = (callback, arg) => callback(arg); - /** * In React, `flushSync` flushes the entire tree and forces a rerender. It's * implmented here as a no-op. @@ -180,8 +170,6 @@ export { useDeferredValue, useSyncExternalStore, useTransition, - // eslint-disable-next-line camelcase - unstable_batchedUpdates, StrictMode, Suspense, lazy, @@ -228,7 +216,6 @@ export default { memo, forwardRef, flushSync, - unstable_batchedUpdates, StrictMode, Suspense, lazy, diff --git a/compat/src/internal.d.ts b/compat/src/internal.d.ts index efc5287ca33..1573a5bf531 100644 --- a/compat/src/internal.d.ts +++ b/compat/src/internal.d.ts @@ -32,7 +32,7 @@ export interface FunctionComponent

extends PreactFunctionComponent

{ } export interface VNode extends PreactVNode { - $$typeof?: symbol | string; + $$typeof?: symbol; preactCompatNormalized?: boolean; } diff --git a/compat/src/render.js b/compat/src/render.js index f18cbd896bb..302d19589e8 100644 --- a/compat/src/render.js +++ b/compat/src/render.js @@ -25,9 +25,7 @@ import { useTransition } from './index'; -export const REACT_ELEMENT_TYPE = - (typeof Symbol != 'undefined' && Symbol.for && Symbol.for('react.element')) || - 0xeac7; +export const REACT_ELEMENT_TYPE = Symbol.for('react.element'); const CAMEL_PROPS = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/; @@ -36,13 +34,7 @@ const CAMEL_REPLACE = /[A-Z0-9]/g; const IS_DOM = typeof document !== 'undefined'; // Input types for which onchange should not be converted to oninput. -// type="file|checkbox|radio", plus "range" in IE11. -// (IE11 doesn't support Symbol, which we use here to turn `rad` into `ra` which matches "range") -const onChangeInputType = type => - (typeof Symbol != 'undefined' && typeof Symbol() == 'symbol' - ? /fil|che|rad/ - : /fil|che|ra/ - ).test(type); +const onChangeInputType = type => /fil|che|rad/.test(type); // Some libraries like `react-virtualized` explicitly check for this. Component.prototype.isReactComponent = {}; diff --git a/compat/test/browser/events.test.js b/compat/test/browser/events.test.js index d59dbef8edf..55c5bd8d63f 100644 --- a/compat/test/browser/events.test.js +++ b/compat/test/browser/events.test.js @@ -104,34 +104,6 @@ describe('preact/compat events', () => { ); }); - it('should normalize onChange for range, except in IE11, including when IE11 has Symbol polyfill', () => { - // NOTE: we don't normalize `onchange` for range inputs in IE11. - // This test mimics a specific scenario when a Symbol polyfill may - // be present, in which case onChange should still not be normalized - - const isIE11 = /Trident\//.test(navigator.userAgent); - const eventType = isIE11 ? 'change' : 'input'; - - if (isIE11) { - window.Symbol = () => 'mockSymbolPolyfill'; - } - sinon.spy(window, 'Symbol'); - - render( null} />, scratch); - expect(window.Symbol).to.have.been.calledOnce; - expect(proto.addEventListener).to.have.been.calledOnce; - expect(proto.addEventListener).to.have.been.calledWithExactly( - eventType, - sinon.match.func, - false - ); - - window.Symbol.restore(); - if (isIE11) { - window.Symbol = undefined; - } - }); - it('should support onAnimationEnd', () => { const func = sinon.spy(() => {}); render(

, scratch); diff --git a/compat/test/browser/exports.test.js b/compat/test/browser/exports.test.js index cced23da456..d96e4bed4cf 100644 --- a/compat/test/browser/exports.test.js +++ b/compat/test/browser/exports.test.js @@ -58,7 +58,6 @@ describe('compat exports', () => { expect(Compat.Children.toArray).to.exist.and.be.a('function'); expect(Compat.Children.only).to.exist.and.be.a('function'); expect(Compat.unmountComponentAtNode).to.exist.and.be.a('function'); - expect(Compat.unstable_batchedUpdates).to.exist.and.be.a('function'); expect(Compat.version).to.exist.and.be.a('string'); expect(Compat.startTransition).to.be.a('function'); }); @@ -99,7 +98,6 @@ describe('compat exports', () => { expect(Named.Children.toArray).to.exist.and.be.a('function'); expect(Named.Children.only).to.exist.and.be.a('function'); expect(Named.unmountComponentAtNode).to.exist.and.be.a('function'); - expect(Named.unstable_batchedUpdates).to.exist.and.be.a('function'); expect(Named.version).to.exist.and.be.a('string'); }); }); diff --git a/compat/test/browser/forwardRef.test.js b/compat/test/browser/forwardRef.test.js index f69d5ae014f..d9fe00e6007 100644 --- a/compat/test/browser/forwardRef.test.js +++ b/compat/test/browser/forwardRef.test.js @@ -35,7 +35,7 @@ describe('forwardRef', () => { expect(App.prototype.isReactComponent).to.equal(true); }); - it('should have $$typeof property', () => { + it.skip('should have $$typeof property', () => { let App = forwardRef((_, ref) =>
foo
); const expected = getSymbol('react.forward_ref', 0xf47); expect(App.$$typeof).to.equal(expected);