create-react-class
A drop-in replacement for React.createClass.
Refer to the React documentation for more information.
Legacy API for creating React components.
A drop-in replacement for React.createClass.
Refer to the React documentation for more information.
Below is a list of all new features, APIs, and bug fixes.
Read the React 19.2 release post for more information.
<Activity>: A new API to hide and restore the UI and internal state of its children.useEffectEvent is a React Hook that lets you extract non-reactive logic into an Effect Event.cacheSignal (for RSCs) lets your know when the cache() lifetime is over.resume: to resume a prerender to a stream.resumeAndPrerender: to resume a prerender to HTML.resumeToPipeableStream: to resume a prerender to a stream.resumeAndPrerenderToNodeStream: to resume a prerender to HTML.prerender APIs to return a postponed state that can be passed to the resume APIs.<ViewTransition> Component. React will batch as much reveals as possible before the first paint while trying to hit popular first-contentful paint metrics.prerender, renderToReadableStream) to server-side-rendering APIs for Node.js: IDs generated by useId<Activity /> was developed over many years, starting before ClassComponent.setState (@acdlite @sebmarkbage and many others)%o placeholder (@eps1lon #34198)useDeferredValue loop in popstate event (@acdlite #32821)useDeferredValue (@acdlite #34376)cacheSignal (@sebmarkbage #33557): for IDs generated by useId (@sebmarkbage, @eps1lon: #32001, https://github.com/facebook/react/pull/33342#33099, #33422)nonce to be used on hoistable styles (@Andarist #32461)React.use inside React.lazy-ed Component (@hi-ogawa #33941)progressiveChunkSize option for server-side-rendering APIs (@sebmarkbage #33027)<img> and <link> using hints before they're rendered (@sebmarkbage #34604)filterStackFrame (@eps1lon #33707)on* handlers to account for upcoming experimental APIsAn Owner Stack is a string representing the components that are directly responsible for rendering a particular component. You can log Owner Stacks when debugging or use Owner Stacks to enhance error overlays or other development tools. Owner Stacks are only available in development builds. Component Stacks in production are unchanged.
useId to use valid CSS selectors, changing format from :r123: to «r123». #32001href attribute is an empty string #31783getHoistableRoot() didn’t work properly when the container was a Document #32321<!-- -->) as a DOM container. #32250<script> and <template> tags to be nested within <select> tags. #31837exports field to package.json for use-sync-external-store to support various entrypoints. #25231unstable_prerender, a new experimental API for prerendering React Server Components on the server #31724registerServerReference in client builds to handle server references in different environments. #32534Below is a list of all new features, APIs, deprecations, and breaking changes. Read React 19 release post and React 19 upgrade guide for more information.
Note: To help make the upgrade to React 19 easier, we’ve published a react@18.3 release that is identical to 18.2 but adds warnings for deprecated APIs and other changes that are needed for React 19. We recommend upgrading to React 18.3.1 first to help identify any issues before upgrading to React 19.
startTransition can now accept async functions. Functions passed to startTransition are called “Actions”. A given Transition can include one or more Actions which update state in the background and update the UI with one commit. In addition to updating state, Actions can now perform side effects including async requests, and the Action will wait for the work to finish before finishing the Transition. This feature allows Transitions to include side effects like fetch() in the pending state, and provides support for error handling, and optimistic updates. useActionState: is a new hook to order Actions inside of a Transition with access to the state of the action, and the pending state. It accepts a reducer that can call Actions, and the initial state used for first render. It also accepts an optional string that is used if the action is passed to a form action prop to support progressive enhancement in forms. useOptimistic: is a new hook to update state while a Transition is in progress. It returns the state, and a set function that can be called inside a transition to “optimistically” update the state to expected final value immediately while the Transition completes in the background. When the transition finishes, the state is updated to the new value. use: is a new API that allows reading resources in render. In React 19, use accepts a promise or Context. If provided a promise, use will suspend until a value is resolved. use can only be used in render but can be called conditionally. ref as a prop: Refs can now be used as props, removing the need for forwardRef. <form> action prop: Form Actions allow you to manage forms automatically and integrate with useFormStatus. When a <form> action succeeds, React will automatically reset the form for uncontrolled components. The form can be reset manually with the new requestFormReset API. <button> and <input> formAction prop: Actions can be passed to the formAction prop to configure form submission behavior. This allows using different Actions depending on the input. useFormStatus: is a new hook that provides the status of the parent <form> action, as if the form was a Context provider. The hook returns the values: pending, data, method, and action. <head> section of the document. <head> on the client before revealing the content of a Suspense boundary that depends on that stylesheet. preinit, preload, prefetchDNS, and preconnect APIs to optimize initial page loads by moving discovery of additional resources like fonts out of stylesheet loading. They can also be used to prefetch resources used by an anticipated navigation.prerender and prerenderToNodeStream APIs for static site generation. They are designed to work with streaming environments like Node.js Streams and Web Streams. Unlike renderToString, they wait for data to load for HTML generation.element.ref access: React 19 supports ref as a prop, so we’re deprecating element.ref in favor of element.props.ref. Accessing will result in a warning. react-test-renderer: In React 19, react-test-renderer logs a deprecation warning and has switched to concurrent rendering for web usage. We recommend migrating your tests to @testing-library/react or @testing-library/react-nativeReact 19 brings in a number of breaking changes, including the removals of long-deprecated APIs. We recommend first upgrading to 18.3.1, where we've added additional deprecation warnings. Check out the upgrade guide for more details and guidance on codemodding.
onUncaughtError and onCaughtError methods to createRoot and hydrateRoot to customize this error handling. propTypes: Using propTypes will now be silently ignored. If required, we recommend migrating to TypeScript or another type-checking solution. defaultProps for functions: ES6 default parameters can be used in place. Class components continue to support defaultProps since there is no ES6 alternative. contextTypes and getChildContext: Legacy Context for class components has been removed in favor of the contextType API. React.createFactory: Now that JSX is broadly supported, all createFactory usage can be migrated to JSX components. react-test-renderer/shallow: This has been a re-export of react-shallow-renderer since React 18. If needed, you can continue to use the third-party package directly. We recommend using @testing-library/react or @testing-library/react-native instead.react-dom/test-utils: We’ve moved act from react-dom/test-utils to react. All other utilities have been removed. ReactDOM.render, ReactDOM.hydrate: These have been removed in favor of the concurrent equivalents: ReactDOM.createRoot and ReactDOM.hydrateRoot. unmountComponentAtNode: Removed in favor of root.unmount(). ReactDOM.findDOMNode: You can replace ReactDOM.findDOMNode with DOM Refs.<Context> as a provider: You can now render <Context> as a provider instead of <Context.Provider>. useDeferredValue initial value argument: When provided, useDeferredValue will return the initial value for the initial render of a component, then schedule a re-render in the background with the deferredValue returned. useMemo and useCallback will now reuse the memoized results from the first render, during the second render. Additionally, StrictMode will now double-invoke ref callback functions on initial mount. The most common changes can be codemodded with npx types-react-codemod@latest preset-19 ./path-to-your-react-ts-files.
ReactChild (replacement: React.ReactElement | number | string) ReactFragment (replacement: Iterable<React.ReactNode>) ReactNodeArray (replacement: ReadonlyArray<React.ReactNode>) ReactText (replacement: number | string) VoidFunctionComponent (replacement: FunctionComponent) VFC (replacement: FC) prop-types: Requireable, ValidationMap, Validator, WeakValidationMap create-react-class: ClassicComponentClass, ClassicComponent, ClassicElement, ComponentSpec, Mixin, ReactChildren, ReactHTML, ReactSVG, SFCFactory useRef: The initial argument is now required to match useState, createContext etc useRef() are now always mutable instead of sometimes being immutable. This feature was too confusing for users and conflicted with legit cases where refs were managed by React and manually written to. ReactElement typing: The props of React elements now default to unknown instead of any if the element is typed as ReactElement JSX namespace is removed to improve interoperability with other libraries using JSX. Instead, the JSX namespace is available from the React package: import { JSX } from 'react' useReducer typings: Most useReducer usage should not require explicit type arguments.-useReducer<React.Reducer<State, Action>>(reducer)
+useReducer(reducer)or-useReducer<React.Reducer<State, Action>>(reducer)
+useReducer<State, Action>(reducer)useActionState() hook to update state based on the result of a Form Action (#27270, #27278, #27309, #27302, #27307, #27366, #27370, #27321, #27374, #27372, #27397, #27399, #27460, #28557, #27570, #27571, #28631, #28788, #29694, #29695, #29694, #29665, #28232, #28319 by @acdlite, @eps1lon, and @rickhanlonii) use() API to read resources in render (#25084, #25202, #25207, #25214, #25226, #25247, #25539, #25538, #25537, #25543, #25561, #25620, #25615, #25922, #25641, #25634, #26232, #26536, #26739, #28233 by @acdlite, @MofeiZ, @sebmarkbage, @sophiebits, @eps1lon, and @hansottowirtz) useOptimistic() hook to display mutated state optimistically during an async mutation (#26740, #26772, #27277, #27453, #27454, #27936 by @acdlite) initialValue argument to useDeferredValue() hook (#27500, #27509, #27512, #27888, #27550 by @acdlite) element.ref access (#28348, #28464, #28731 by @acdlite) <Context> to mean <Context.Provider> (#28226 by @gaearon) info, group, and groupCollapsed in StrictMode logging (#25172 by @timneutkens) useSyncExternalStore() hydration in StrictMode (#26791 by @sophiebits) componentWillUnmount() in StrictMode (#26842 by @tyao1) useState() and useReducer() initializer functions in StrictMode (#28248 by @eps1lon) useId() in StrictMode (#25713 by @gnoff) act() no longer checks shouldYield which can be inaccurate in test environments (#26317 by @acdlite) react.element symbol to react.transitional.element (#28813 by @sebmarkbage) useSyncExternalStore() re-render (#27199 by @acdlite) useSyncExternalStore() dropped update when state is dispatched in render phase (#25578 by @pandaiolo) RefreshRuntime.findAffectedHostInstances (#30538 by @gaearon) cache() API (#27977, #28250 by @acdlite and @gnoff) propTypes (#28324, #28326 by @gaearon) defaultProps support, except for classes (#28733 by @acdlite) createFactory (#27798 by @kassens)useFormStatus() hook to provide status information of the last form submission (#26719, #26722, #26788, #29019, #28728, #28413 by @acdlite and @eps1lon) preinit, preinitModule, preconnect, prefetchDNS, preload, and preloadModule APIs. fetchPriority to <img> and <link> (#25927 by @styfle) transformOrigin prop (#26130 by @arav-ind) onScrollEnd event (#26789 by @devongovett) <hr> as child of <select> (#27632 by @SouSingh) inert (#24730 by @eps1lon) imageSizes and imageSrcSet (#22550 by @eps1lon) flushSync exhausts queue even if something throws (#26366 by @acdlite) react and react-dom versions don’t match (#29236 by @acdlite) srcset and src are assigned last on <img> instances (#30340 by @gnoff) src and href attributes (unless for <a href=”” />) (#18513, #28124 by @bvaughn and @eps1lon) scale style property (#25601 by @JonnyBurger) onChange error message for controlled <select> (#27740 by @Biki-das) render, hydrate, findDOMNode, unmountComponentAtNode, unstable_createEventHandle, unstable_renderSubtreeIntoContainer, and unstable_runWithPriority. Move createRoot and hydrateRoot to react-dom/client. (#28271 by @gnoff) test-utils (#28541 by @eps1lon) unstable_flushControlled (#26397 by @kassens) renderToStaticNodeStream() (#28873 by @gnoff) unstable_renderSubtreeIntoContainer (#29771 by @kassens)bootstrapScripts and bootstrapModules (#25104 by @gnoff) bootstrapModules, bootstrapScripts, and update priority queue (#26754, #26753, #27190, #27189 by @gnoff) onHeaders entrypoint option (#27641, #27712 by @gnoff) <style> and <script> textContent to enable rendering inner content without dangerouslySetInnerHTML (#28870, #28871 by @gnoff) srcset to trigger load event on mount (#30351 by @gnoff) onError (#27761, #27850 by @gnoff and @sebmarkbage) crossorigin support to bootstrap scripts (#26844 by @HenriqueLimas) nonce and fetchpriority in preload links (#26826 by @liuyenwei) referrerPolicy to ReactDOM.preload() (#27096 by @styfle) react/jsx-dev-runtime (#28921 by @himself65) errorInfo.digest from onRecoverableError (#28222 by @gnoff)react-test-renderer on web (#27903, #28904 by @jackpope and @acdlite) react-test-renderer/shallow export (#25475, #28497 by @sebmarkbage and @jackpope)prepareUpdate (#26583, #27409 by @sebmarkbage and @sophiebits)isConcurrentMode and isAsyncMode methods (#28224 by @gaearon)act from react f1338fThis release is identical to 18.2 but adds warnings for deprecated APIs and other changes that are needed for React 19.
Read the React 19 Upgrade Guide for more info.
this.refs to support string ref codemod 909071findDOMNode outside StrictMode c3b283test-utils methods d4ea75defaultProps for function components #25699key #25697act from test-utils d4ea75unmountComponentAtNode 8a015brenderToStaticNodeStream #28874onRecoverableError. (@gnoff in #24591)document causing a blank page on mismatch. (@gnoff in #24523)setState in Safari when adding an iframe. (@gaearon in #24459)<title> elements to match the browser constraints. (@gnoff in #24679)highWaterMark to 0. (@jplhomer in #24641)react-dom/client when using UMD bundle. (@alireza-molaee in #24274)suppressHydrationWarning to work in production too. (@gaearon in #24271)componentWillUnmount firing twice inside of Suspense. (@acdlite in #24308)useDeferredValue causing an infinite loop when passed an unmemoized value. (@acdlite in #24247)setState loop in useEffect. (@gaearon in #24298)setState in useInsertionEffect. (@gaearon in #24295)bootstrapScriptContent contents. (@gnoff in #24385)renderToPipeableStream. (@gnoff in #24291)Below is a list of all new features, APIs, deprecations, and breaking changes. Read React 18 release post and React 18 upgrade guide for more information.
useId is a new hook for generating unique IDs on both the client and server, while avoiding hydration mismatches. It is primarily useful for component libraries integrating with accessibility APIs that require unique IDs. This solves an issue that already exists in React 17 and below, but it’s even more important in React 18 because of how the new streaming server renderer delivers HTML out-of-order.startTransition and useTransition let you mark some state updates as not urgent. Other state updates are considered urgent by default. React will allow urgent state updates (for example, updating a text input) to interrupt non-urgent state updates (for example, rendering a list of search results).useDeferredValue lets you defer re-rendering a non-urgent part of the tree. It is similar to debouncing, but has a few advantages compared to it. There is no fixed time delay, so React will attempt the deferred render right after the first render is reflected on the screen. The deferred render is interruptible and doesn't block user input.useSyncExternalStore is a new hook that allows external stores to support concurrent reads by forcing updates to the store to be synchronous. It removes the need for useEffect when implementing subscriptions to external data sources, and is recommended for any library that integrates with state external to React.useInsertionEffect is a new hook that allows CSS-in-JS libraries to address performance issues of injecting styles in render. Unless you’ve already built a CSS-in-JS library we don’t expect you to ever use this. This hook will run after the DOM is mutated, but before layout effects read the new layout. This solves an issue that already exists in React 17 and below, but is even more important in React 18 because React yields to the browser during concurrent rendering, giving it a chance to recalculate layout.These new APIs are now exported from react-dom/client:
createRoot: New method to create a root to render or unmount. Use it instead of ReactDOM.render. New features in React 18 don't work without it.hydrateRoot: New method to hydrate a server rendered application. Use it instead of ReactDOM.hydrate in conjunction with the new React DOM Server APIs. New features in React 18 don't work without it.Both createRoot and hydrateRoot accept a new option called onRecoverableError in case you want to be notified when React recovers from errors during rendering or hydration for logging. By default, React will use reportError, or console.error in the older browsers.
These new APIs are now exported from react-dom/server and have full support for streaming Suspense on the server:
renderToPipeableStream: for streaming in Node environments.renderToReadableStream: for modern edge runtime environments, such as Deno and Cloudflare workers.The existing renderToString method keeps working but is discouraged.
react-dom: ReactDOM.render has been deprecated. Using it will warn and run your app in React 17 mode.react-dom: ReactDOM.hydrate has been deprecated. Using it will warn and run your app in React 17 mode.react-dom: ReactDOM.unmountComponentAtNode has been deprecated.react-dom: ReactDOM.renderSubtreeIntoContainer has been deprecated.react-dom/server: ReactDOMServer.renderToNodeStream has been deprecated.flushSync.<Suspense> boundary in the tree. This ensures the hydrated tree is consistent and avoids potential privacy and security holes that can be caused by hydration mismatches.Promise, Symbol, and Object.assign. If you support older browsers and devices such as Internet Explorer which do not provide modern browser features natively or have non-compliant implementations, consider including a global polyfill in your bundled application.scheduler/tracing APIundefined: React no longer throws if you return undefined from a component. This makes the allowed component return values consistent with values that are allowed in the middle of a component tree. We suggest to use a linter to prevent mistakes like forgetting a return statement before JSX.act warnings are now opt-in: If you're running end-to-end tests, the act warnings are unnecessary. We've introduced an opt-in mechanism so you can enable them only for unit tests where they are useful and beneficial.setState on unmounted components: Previously, React warned about memory leaks when you call setState on an unmounted component. This warning was added for subscriptions, but people primarily run into it in scenarios where setting state is fine, and workarounds make the code worse. We've removed this warning.renderToString: Will no longer error when suspending on the server. Instead, it will emit the fallback HTML for the closest <Suspense> boundary and then retry rendering the same content on the client. It is still recommended that you switch to a streaming API like renderToPipeableStream or renderToReadableStream instead.renderToStaticMarkup: Will no longer error when suspending on the server. Instead, it will emit the fallback HTML for the closest <Suspense> boundary and retry rendering on the client.useTransition and useDeferredValue to separate urgent updates from transitions. (#10426, #10715, #15593, #15272, #15578, #15769, #17058, #18796, #19121, #19703, #19719, #19724, #20672, #20976 by @acdlite, @lunaruan, @rickhanlonii, and @sebmarkbage)useId for generating unique IDs. (#17322, #18576, #22644, #22672, #21260 by @acdlite, @lunaruan, and @sebmarkbage)useSyncExternalStore to help external store libraries integrate with React. (#15022, #18000, #18771, #22211, #22292, #22239, #22347, #23150 by @acdlite, @bvaughn, and @drarmstr)startTransition as a version of useTransition without pending feedback. (#19696 by @rickhanlonii)useInsertionEffect for CSS-in-JS libraries. (#21913 by @rickhanlonii)<StrictMode> re-run effects to check for restorable state. (#19523 , #21418 by @bvaughn and @lunaruan)object-assign polyfill. (#23351 by @sebmarkbage)unstable_changedBits API. (#20953 by @acdlite)useEffect resulting from discrete events like clicks synchronously. (#21150 by @acdlite)fallback={undefined} now behaves the same as null and isn't ignored. (#21854 by @rickhanlonii)lazy() resolving to the same component equivalent. (#20357 by @sebmarkbage)setImmediate when available over MessageChannel. (#20834 by @gaearon)useReducer observing incorrect props by removing the eager bailout mechanism. (#22445 by @josephsavona)setState being ignored in Safari when appending iframes. (#23111 by @gaearon)ZonedDateTime in the tree. (#20617 by @dimaqq)null in tests. (#22695 by @SimenB)onLoad not triggering when concurrent features are on. (#23316 by @gnoff)NaN. (#23333 by @hachibeeDI)package.json as one of the entry points. (#22954 by @Jack)createRoot and hydrateRoot. (#10239, #11225, #12117, #13732, #15502, #15532, #17035, #17165, #20669, #20748, #20888, #21072, #21417, #21652, #21687, #23207, #23385 by @acdlite, @bvaughn, @gaearon, @lunaruan, @rickhanlonii, @trueadm, and @sebmarkbage)aria-description to the list of known ARIA attributes. (#22142 by @mahyareb)onResize event to video elements. (#21973 by @rileyjshaw)imageSizes and imageSrcSet to known props. (#22550 by @eps1lon)<option> children if value is provided. (#21431 by @sebmarkbage)aspectRatio style not being applied. (#21100 by @gaearon)renderSubtreeIntoContainer is called. (#23355 by @acdlite)renderToNodeStream. (#23359 by @sebmarkbage)act is used in production. (#21686 by @acdlite)global.IS_REACT_ACT_ENVIRONMENT. (#22561 by @acdlite)act batch updates. (#21797 by @acdlite)exports field to package.json. (#23087 by @otakustay)lazy support. (#24068 by @gnoff)globalThis instead of window for edge environments. (#22777 by @huozhi)SharedArrayBuffer cross-origin isolation warning. (@koba04 and @bvaughn in #20831, #20832, and #20840)Today, we are releasing React 17!
Learn more about React 17 and how to update to it on the official React blog.
react/jsx-runtime and react/jsx-dev-runtime for the new JSX transform. (@lunaruan in #18299)displayName on context for improved stacks. (@eps1lon in #18224)'use strict' from leaking in the UMD bundles. (@koba04 in #19614)fb.me for redirects. (@cylim in #19598)document. (@trueadm in #18195 and others)useEffect cleanup functions asynchronously. (@bvaughn in #17925)focusin and focusout for onFocus and onBlur. (@trueadm in #19186)Capture events use the browser capture phase. (@trueadm in #19221)onScroll event. (@gaearon in #19464)forwardRef or memo component returns undefined. (@gaearon in #19550)console in the second render pass of DEV mode double render. (@sebmarkbage in #18547)ReactTestUtils.SimulateNative API. (@gaearon in #13407)ReactDOM.flushSync during lifecycle methods (but warn). (@sebmarkbage in #18759)code property to the keyboard event objects. (@bl00mber in #18287)disableRemotePlayback property for video elements. (@tombrowndev in #18619)enterKeyHint property for input elements. (@eps1lon in #18634)value is provided to <Context.Provider>. (@charlie1404 in #19054)memo or forwardRef components return undefined. (@bvaughn in #19550)onTouchStart, onTouchMove, and onWheel passive. (@gaearon in #19654)setState hanging in development inside a closed iframe. (@gaearon in #19220)defaultProps. (@jddxf in #18539)dangerouslySetInnerHTML is undefined. (@eps1lon in #18676)require implementation. (@just-boris in #18632)onBeforeInput reporting an incorrect event.type. (@eps1lon in #19561)event.relatedTarget reported as undefined in Firefox. (@claytercek in #19607)movementX/Y polyfill with capture events. (@gaearon in #19672)onSubmit and onReset events. (@gaearon in #19333)useCallback behavior consistent with useMemo for the server renderer. (@alexmckenley in #18783)findByType error message. (@henryqdineen in #17439)unstable_ prefix before the experimental APIs. (@acdlite in #18825)unstable_discreteUpdates and unstable_flushDiscreteUpdates. (@trueadm in #18825)timeoutMs argument. (@acdlite in #19703)<div hidden /> prerendering in favor of a different future API. (@acdlite in #18917)unstable_expectedLoadTime to Suspense for CPU-bound trees. (@acdlite in #19936)unstable_useOpaqueIdentifier Hook. (@lunaruan in #17322)unstable_startTransition API. (@rickhanlonii in #19696)act in the test renderer no longer flushes Suspense fallbacks. (@acdlite in #18596)useMutableSource that may happen when getSnapshot changes. (@bvaughn in #18297)useMutableSource. (@bvaughn in #18912)componentWillReceiveProps, shouldComponentUpdate, and so on). (@gaearon in #18330)React.createFactory() (@trueadm in #17878)style may cause an unexpected collision (@sophiebits in #14181, #18002)unstable_createPortal (@trueadm in #17880)onMouseEnter being fired on disabled buttons (@AlfredoGJ in #17675)shouldComponentUpdate twice when developing in StrictMode (@bvaughn in #17942)version property to ReactDOM (@ealush in #15780)toString() of dangerouslySetInnerHTML (@sebmarkbage in #17773)ReactDOM.createRoot() (@trueadm in #17937)ReactDOM.createRoot() callback params and added warnings on usage (@bvaughn in #17916)SuspenseList CPU bound heuristic (@sebmarkbage in #17455)isPending only being true when transitioning from inside an input event (@acdlite in #17382)React.memo components dropping updates when interrupted by a higher priority update (@acdlite) in #18091)mouseenter handlers from firing twice inside nested React containers. @yuanoook in #16928unstable_createRoot and unstable_createSyncRoot experimental APIs. (These are available in the Experimental channel as createRoot and createSyncRoot.) (@acdlite in #17088)Object.is instead of inline polyfill, when available. (@ku8ar in #16212)postMessage loop with short intervals instead of attempting to align to frame boundaries with requestAnimationFrame. (@acdlite in #16214)<React.Profiler> API for gathering performance measurements programmatically. (@bvaughn in #15172)unstable_ConcurrentMode in favor of unstable_createRoot. (@acdlite in #15532)UNSAFE_* lifecycle methods. (@bvaughn in #15186 and @threepointone in #16103)javascript: URLs as a common attack surface. (@sebmarkbage in #15047)disablePictureInPicture attribute on <video>. (@eek in #15334)onLoad event for <embed>. (@cherniavskii in #15614)useState state from DevTools. (@bvaughn in #14906)setState is called from useEffect, creating a loop. (@gaearon in #15180)findDOMNode for components wrapped in <Suspense>. (@acdlite in #15312)!important style. (@acdlite in #15861 and #15882)act(async () => ...) for testing asynchronous state updates. (@threepointone in #14853)act from different renderers. (@threepointone in #16039 and #16042)act() call. (@threepointone in #15763 and #16041)act from the wrong renderer. (@threepointone in #15756)useReducer(). (@acdlite in #15124)contextType is set to Context.Consumer instead of Context. (@aweary in #14831)contextType is set to invalid values. (@gaearon in #15142)size attribute. (@kulek1 in #14242)useEffect(async () => ...) warning message. (@gaearon in #15118)setState in shallow renderer to work with Hooks. (@gaearon in #15120)React.memo. (@aweary in #14816)forwardRef. (@eps1lon in #15100)useContext hook. (@bvaughn in #14940)ReactDOM.render being ignored inside useEffect. (@gaearon in #14799)useImperativeHandle to work correctly when no deps are specified. (@gaearon in #14801)crossOrigin attribute to work in SVG image elements. (@aweary in #14832)act() warning. (@threepointone in #14855)useReducer Hook lazy initialization API. (@acdlite in #14723)useState and useReducer Hooks. (@acdlite in #14569)Object.is algorithm for comparing useState and useReducer values. (@Jessidhia in #14752)useEffect/useMemo/useCallback Hooks. (@acdlite in #14594)React.lazy(). (@gaearon in #14626)undefined or a function. All other values, including null, are not allowed. @acdlite in #14119shouldComponentUpdate in the presence of getDerivedStateFromProps for Shallow Renderer. (@chenesan in #14613)ReactTestRenderer.act() and ReactTestUtils.act() for batching updates so that tests more closely match real behavior. (@threepointone in #14744)React.lazy for large numbers of lazily-loaded components. (@acdlite in #14429)react-dom/server@16.6 and react@<16.6. (@gaearon in #14291)setTimeout in testing environments. (@bvaughn in #14358)Suspense and lazy. (@acdlite in #14133, #14157, and #14164)React.memo updates in React DevTools. (@bvaughn in #14141)renderToNodeStream() calls. (@sebmarkbage in #14182)This release was published in a broken state and should be skipped.
React.memo() as an alternative to PureComponent for functions. (@acdlite in #13748)React.lazy() for code splitting components. (@acdlite in #13885)React.StrictMode now warns about legacy context API. (@bvaughn in #13760)React.StrictMode now warns about findDOMNode. (@sebmarkbage in #13841)unstable_AsyncMode to unstable_ConcurrentMode. (@trueadm in #13732)unstable_Placeholder to Suspense, and delayMs to maxDuration. (@gaearon in #13799 and @sebmarkbage in #13922)contextType as a more ergonomic way to subscribe to context from a class. (@bvaughn in #13728)getDerivedStateFromError lifecycle method for catching errors in a future asynchronous server-side renderer. (@bvaughn in #13746)<Context> is used instead of <Context.Consumer>. (@trueadm in #13829)window.event in development. (@sergei-startsev in #13697)React.memo(). (@alexmckenley in #13855)contextType. (@alexmckenley and @sebmarkbage in #13889)scheduler. (@gaearon in #13683)requestAnimationFrame earlier. (@acdlite in #13785)envify transform to the package. (@mridgway in #13766)<iframe> regression (@JSteunou in #13650)updateWrapper so that <textarea>s no longer re-render when data is unchanged (@joelbarbosa in #13643)schedule to remove some React-isms and improve performance for when deferred updates time out (@acdlite in #13582)React.forwardRef receives an unexpected number of arguments. (@andresroberto in #13636)isReactComponent. (@gaearon in #13608)react-dom/profiling with schedule/tracking. (@bvaughn in #13605)ForwardRef component defines a displayName, use it in warnings. (@probablyup in #13615)React.forwardRef render function doesn't take exactly two arguments (@bvaughn in #13168)createElement by mistake (@DCtheTall in #13131)onRender until after mutations (@bvaughn in #13572)react-dom/profiling entry point alias for profiling in production (@bvaughn in #13570)onAuxClick event for browsers that support it (@jquense in #11571)movementX and movementY fields to mouse events (@jasonwilliams in #9018)tangentialPressure and twist fields to pointer events (@motiz88 in #13374)focusable SVG attribute (@gaearon in #13339)<noscript> on the client when hydrating (@Ephem in #13537)gridArea to be treated as a unitless CSS property (@mgol in #13550)compositionend event when typing Korean on IE11 (@crux153 in #12563)children in the <option> tag (@Slowyn in #13261, @gaearon in #13465)checked attribute not getting initially set on the input (@dilidili in #13114)dangerouslySetInnerHTML when __html is not a string (@gaearon in #13353)onChange to fire on falsy values too (@nicolevy in #12628)submit and reset buttons getting an empty label (@ellsclytn in #12780)onSelect event not being triggered after drag and drop (@gaearon in #13422)onClick event not working inside a portal on iOS (@aweary in #11927)onChange to not fire in some cases (@gaearon in #13423)"false" or "true" is the value of a boolean DOM prop (@motiz88 in #13372)this.state is initialized to props (@veekas in #11658)style on hydration in IE due to noisy false positives (@mgol in #13534)StrictMode in the component stack (@gaearon in #13240)window.event in IE (@ConradIrwin in #11696)folder/index.js naming convention (@gaearon in #12059)getDerivedStateFromProps without initialized state (@flxwu in #13317)<webview> tag without warnings (@philipp-spiess in #13301)e.preventDefault() was called (@gaearon in #13384)unstable_deferredUpdates in favor of unstable_scheduleWork from schedule (@gaearon in #13488)dangerouslySetInnerHtml in a selected <option> (@mridgway in #13078)setTimeout is missing (@dustinsoftware in #13088)this in a functional component for shallow renderer to be undefined (@koba04 in #13144)ReactTestUtils.mockComponent() helper (@bvaughn in #13193)ReactDOM.createPortal usage within the test renderer (@bvaughn in #12895)Fix a potential XSS vulnerability when the attacker controls an attribute name (CVE-2018-6341). This fix is available in the latest react-dom@16.4.2, as well as in previous affected minor versions: react-dom@16.0.1, react-dom@16.1.2, react-dom@16.2.1, and react-dom@16.3.3. (@gaearon in #13302)
Fix a crash in the server renderer when an attribute is called hasOwnProperty. This fix is only available in react-dom@16.4.2. (@gaearon in #13303)
type changes from some other types to text. (@spirosikmd in #12135)event.target value for the onChange event in IE9. (@nhunzaker in #12976)<React.Fragment /> from a component. (@philipp-spiess in #12966)getDerivedStateFromProps() in the shallow renderer to not discard the pending state. (@fatfisz in #13030)React.unstable_Profiler component for measuring performance. (@bvaughn in #12745)getDerivedStateFromProps() regardless of the reason for re-rendering. (@acdlite in #12600 and #12802)forwardRef() on a deeper setState(). (@gaearon in #12690)propTypes on a context provider component. (@nicolevy in #12658)react-lifecycles-compat in <StrictMode>. (@bvaughn in #12644)forwardRef() render function has propTypes or defaultProps. (@bvaughn in #12644)forwardRef() and context consumers are displayed in the component stack. (@sophiebits in #12777)getDerivedStateFromProps() support to match the new React DOM behavior. (@koba04 in #12676)testInstance.parent crash when the parent is a fragment or another special node. (@gaearon in #12813)forwardRef() components are now discoverable by the test renderer traversal methods. (@gaearon in #12725)setState() updaters that return null or undefined. (@koba04 in #12756)CVE-2018-6341). This fix is available in the latest react-dom@16.4.2, as well as in previous affected minor versions: react-dom@16.0.1, react-dom@16.1.2, react-dom@16.2.1, and react-dom@16.3.3. (@gaearon in #13302)null or undefined to React.cloneElement. (@nicolevy in #12534)<StrictMode>. (@bvaughn in #12546)unstable_observedBits API with nesting. (@gaearon in #12543)Fragment. (@heikkilamarko in #12504)setState() in constructor. (@gaearon in #12532)getDerivedStateFromProps() not getting applied in some cases. (@acdlite in #12528)React.createRef() API as an ergonomic alternative to callback refs. (@trueadm in #12162)React.forwardRef() API to let components forward their refs to a child. (@bvaughn in #12346)React.Fragment. (@XaveScor in #11823)React.unstable_AsyncComponent with React.unstable_AsyncMode. (@acdlite in #12117)setState() on an unmounted component. (@sophiebits in #12347)getDerivedStateFromProps() lifecycle and UNSAFE_ aliases for the legacy lifecycles. (@bvaughn in #12028)getSnapshotBeforeUpdate() lifecycle. (@bvaughn in #12404)<React.StrictMode> wrapper to help prepare apps for async rendering. (@bvaughn in #12083)onLoad and onError events on the <link> tag. (@roderickhsiao in #11825)noModule boolean attribute on the <script> tag. (@aweary in #11900)onKeyPress in more browsers. (@nstraub in #10514)value and defaultValue to ignore Symbol values. (@nhunzaker in #11741)opera with a null value. @alisherdavronov in #11854)<option selected>. (@watadarkstar in #11821)ReactDOM.unstable_createPortal() in favor of ReactDOM.createPortal(). (@prometheansacrifice in #11747)React.Component. (@wyze in #11993)this.state of different components getting mixed up. (@sophiebits in #12323)toTree(). (@maciej-ka in #12107 and @gaearon in #12154)null for components that don't set it. (@jwbay in #11965)contextTypes. (@koba04 in #11922)ReactIs.isValidElementType() to help higher-order components validate their inputs. (@jamesreggio in #12483)react-reconciler/persistent for building renderers that use persistent data structures. (@gaearon in #12156)finalizeInitialChildren(). (@jquense in #11970)useSyncScheduling from the host config. (@acdlite in #11771)CVE-2018-6341). This fix is available in the latest react-dom@16.4.2, as well as in previous affected minor versions: react-dom@16.0.1, react-dom@16.1.2, react-dom@16.2.1, and react-dom@16.3.3. (@gaearon in #13302)Fragment as named export to React. (@clemmy in #10783)React.Children utilities. (@MatteoVH in #11422)onChange event in some cases. (@jquense in #11028)setState() callback firing too early when called from componentWillMount. (@accordeiro in #11507)CVE-2018-6341). This fix is available in the latest react-dom@16.4.2, as well as in previous affected minor versions: react-dom@16.0.1, react-dom@16.1.2, react-dom@16.2.1, and react-dom@16.3.3. (@gaearon in #13302)capture attribute. (@maxschmeling in #11424)ReactDOMServer public API. (@travi in #11531)autoFocus={false} attribute on the server. (@gaearon in #11543)Starting with 16.1.0, we will no longer be publishing new releases on Bower. You can continue using Bower for old releases, or point your Bower configs to the React UMD builds hosted on unpkg that mirror npm releases and will continue to be updated.
React.Children utilities. (@MatteoVH in #11378)render method but doesn't extend a known base class. (@sw-yx in #11168)on as a custom attribute for AMP. (@nuc in #11153)onMouseEnter and onMouseLeave firing on wrong elements. (@gaearon in #11164)null showing up in a warning instead of the component stack. (@gaearon in #10915)tabIndex not getting applied to SVG elements. (@gaearon in #11034)dangerouslySetInnerHTML in IE. (@OriR in #11108)form.reset() to respect defaultValue on uncontrolled <select>. (@aweary in #11057)<textarea> placeholder not rendering on IE11. (@gaearon in #11177)<dialog> element. (@gaearon in #11035)componentDidReceiveProps method. (@iamtommcc in #11479)contentEditable and children. (@Ethan-Arrowood in #11208)select gets null value. (@Hendeca in #11141)suppressHydrationWarning attribute for intentional client/server text mismatches. (@sebmarkbage in #11126)autoFocus attribute into SSR markup. (@gaearon in #11192)setState() calls in componentWillMount() in shallow renderer. (@Hypnosphi in #11167)shouldComponentUpdate() after forceUpdate(). (@d4rky-pl in #11239 and #11439)forceUpdate() and React.PureComponent correctly. (@koba04 in #11440)package.json dependency. (@gaearon in #11340)package.json dependency. (@gaearon in #11341)react-art/Circle, react-art/Rectangle, and react-art/Wedge. (@gaearon in #11343)CVE-2018-6341). This fix is available in the latest react-dom@16.4.2, as well as in previous affected minor versions: react-dom@16.0.1, react-dom@16.1.2, react-dom@16.2.1, and react-dom@16.3.3. (@gaearon in #13302)render. (Docs coming soon!)ReactDOM.createPortal(). (Docs coming soon!)ReactDOMServer.renderToNodeStream() and ReactDOMServer.renderToStaticNodeStream(). (@aickin in #10425, #10044, #10039, #10024, #9264, and others.)ReactDOM.render() and ReactDOM.unstable_renderIntoContainer() now return null if called from inside a lifecycle method.setState behavior:setState with null no longer triggers an update. This allows you to decide in an updater function if you want to re-render.setState directly in render always causes an update. This was not previously the case. Regardless, you should not be calling setState from render.setState callback (second argument) now fires immediately after componentDidMount / componentDidUpdate instead of after all components have rendered.<A /> with <B />, B.componentWillMount now always happens before A.componentWillUnmount. Previously, A.componentWillUnmount could fire first in some cases.ref to a component would always detach the ref before that component's render is called. Now, we change the ref later, when applying the changes to the DOM.ReactDOM.unmountComponentAtNode. See this example.componentDidUpdate lifecycle no longer receives prevContext param. (@bvaughn in #8631)componentDidUpdate() because DOM refs are not available. This also makes it consistent with componentDidMount() (which does not get called in previous versions either).unstable_batchedUpdates() anymore.ReactDOM.unstable_batchedUpdates now only takes one extra argument after the callback.react/dist/react.js → react/umd/react.development.jsreact/dist/react.min.js → react/umd/react.production.min.jsreact-dom/dist/react-dom.js → react-dom/umd/react-dom.development.jsreact-dom/dist/react-dom.min.js → react-dom/umd/react-dom.production.min.jsReactDOM.hydrate instead of ReactDOM.render if you're reviving server rendered HTML. Keep using ReactDOM.render if you're just doing client-side rendering.react-with-addons.js build anymore. All compatible addons are published separately on npm, and have single-file browser versions if you need them.React.createClass is now available as create-react-class, React.PropTypes as prop-types, React.DOM as react-dom-factories, react-addons-test-utils as react-dom/test-utils, and shallow renderer as react-test-renderer/shallow. See 15.5.0 and 15.6.0 blog posts for instructions on migrating code and automated codemods.document.documentMode would trigger IE detection in other browsers, breaking change events. (@aweary in #10032)onChange would not fire with defaultChecked on radio inputs. (@jquense in #10156)controlList attribute to allowed DOM properties (@nhunzaker in #9940)px to custom CSS property values. (@TrySound in #9966)console.warn instead of console.error. (@flarnie in #9753)React.createClass. Points users to create-react-class instead. (@flarnie in #9771)React.DOM factory helpers. (@nhunzaker in #8356)React.createMixin helper, which was never used. (@aweary in #8853)style attribute. (@aweary in #9302)onChange not firing properly for some inputs. (@jquense in #8575)react. (@flarnie in #9919)isMounted() to return true in componentWillUnmount. (@mridgway in #9638)react-addons-update to not depend on native Object.assign. (@gaearon in #9937)create-react-class. (@gaearon in #9933)react-linked-input. (@gaearon in #9766)react-addons-(css-)transition-group to the new package. (@gaearon in #9937)prop-types to fix critical bug. (@gaearon in 545c87f)react-addons-create-fragment package to include loose-envify transform for Browserify users. (@mridgway in #9642)Note: this release has a critical issue and was deprecated. Please update to 15.5.4 or higher.
react-addons-create-fragment package to export correct thing. (@gaearon in #9385)create-react-class package to include loose-envify transform for Browserify users. (@mridgway in #9642)Note: this release has a critical issue and was deprecated. Please update to 15.5.4 or higher.
Note: this release has a critical issue and was deprecated. Please update to 15.5.4 or higher.
Note: this release has a critical issue and was deprecated. Please update to 15.5.4 or higher.
React.createClass. Points users to create-react-class instead. (@acdlite in #d9a4fa4)React.PropTypes. Points users to prop-types instead. (@acdlite in #043845c)ReactDOM together with ReactDOMServer. (@wacii in #9005)react-dom/test-utils, which exports the React Test Utils. (@bvaughn)componentWillUnmount was not called for children. (@gre in #8512)react-test-renderer/shallow, which exports the shallow renderer. (@bvaughn)peerDependencies so that addons continue to work indefinitely. (@acdlite and @bvaughn in 8a06cd7 and 67a8db3)React.createClass and React.PropTypes (@acdlite in 12a96b9)react-addons-test-utils is deprecated. Use react-dom/test-utils and react-test-renderer/shallow instead. (@bvaughn)getInitialState when this.state is set. (@bvaughn in #8594)aria- attributes. (@jessebeach in #7744)autofocus rather than autoFocus. (@hkal in #7694)String.prototype.split. (@nhunzaker in #7629)batchedUpdates API now passes the wrapped function's return value through. (@bgnorlov in #7444)Simulate.click() on a <input disabled onClick={foo} /> then foo will get called whereas it didn't before. (@nhunzaker in #7642)ReactTestRenderer.create() now accepts {createNodeMock: element => mock} as an optional argument so you can mock refs with snapshot testing. (@Aweary in #7649, #8261)playsInline to supported HTML attributes. (@reaperhulk in #7519)as to supported HTML attributes. (@kevinslin in #7582)preventDefault() in Synthetic Events. (@g-palmer in #7411)onSelect implementation. (@AgtLucas in #7533)document.documentMode checks to handle Google Tag Manager. (@SchleyB in #7594)document.createEvent. (@Andarist in #7621)dangerouslySetInnerHTML and SVG in Internet Explorer. (@zpao in #7618)React.Children.only. (@sophiebits in #7514)<input> validation warning from browsers when changing type. (@nhunzaker in #7333)stopPropagation() in Synthetic Events. (@nhunzaker in #7343)<input> elements in mobile browsers. (@keyanzhang in #7397)<input type="range"> values not updating when changing min or max. (@troydemonbreun in #7486)trackedTouchCount invariant into a console.error for better reliability. (@yungsters in #7400)React.PureComponent - a new base class to extend, replacing react-addons-pure-render-mixin now that mixins don't work with ES2015 classes. (@sophiebits in #7195)this.props.children. (@jimfb in #7001)oneOf and oneOfType PropTypes sooner. (@troydemonbreun in #6316)PropTypes.element warning. (@alexzherdev in #7319)setState warning. (@keyanzhang in #7326)xmlns, xmlnsXlink to supported SVG attributes. (@salzhrani in #6471)referrerPolicy to supported HTML attributes. (@Aweary in #7274)<input type="range"> initial value being rounded. (@troydemonbreun in #7251)npm install react-test-renderer. (@sophiebits in #6944, #7258, @iamdustan in #7362)type property on for events created via TestUtils.Simulate.*. (@yaycmyk in #6154)unstable_renderSubtreeIntoContainer so that context properly updates when linked to state. (@gaearon in #7125)value-less submit and reset inputs removing the browser-default text. (@zpao in #7197)name attribute being added to inputs when not provided. (@okonet in #7199)React.PropTypes.symbol to support ES2015 Symbols as props. (@puradox in #6377)childContextTypes on a functional component (@Aweary in #6933)onLoad handling to <link> element. (@roderickhsiao in #6815)onError handling to <source> element. (@wadahiro in #6941)value and defaultValue more accurately in the DOM. (@jimfb in #6406)Object.prototype. (@Weizenlol in #6886)is="null" ended up in the DOM in Firefox. (@darobin in #6896)dangerouslySetInnerHTML and SVG in Internet Explorer. (@joshhunt in #6982)<textarea> placeholders. (@jimfb in #7002)<input type="radio"/>. (@jimfb in #7003)<select> components behave the same on initial render as they do on updates. (@yiminghe in #5362)isRunning() API. (@nfcampos in #6763)null node. (@keyanzhang in #6958)object-assign, which has protection against a non-spec-compliant native Object.assign. (@zpao in #6681)props objects passed to createElement must be plain objects. (@richardscarrott in #6134)onScroll event handler with server rendering. (@Aweary in #6678)<object> nodes from being able to read <param> nodes in IE. (@syranide in #6691)merge utility. (@sebmarkbage in #6634)componentWillUnmount is only called once. (@jimfb in #6613)<option>s are correctly selected when inside <optgroup>. (@trevorsmith in #6442)<body> elements are caught when warning for invalid markup. (@keyanzhang in #6469)scryRenderedDOMComponentsWithClass better. (@ipeters90 in #6529)React.__spread API to unbreak code compiled with some tools making use of this undocumented API. It is now officially deprecated. (@zpao in #6444)document.createElement instead of generating HTML. Previously we would generate a large string of HTML and then set node.innerHTML. At the time, this was decided to be faster than using document.createElement for the majority of cases and browsers that we supported. Browsers have continued to improve and so overwhelmingly this is no longer true. By using createElement we can make other parts of React faster. (@sophiebits in #5205)data-reactid is no longer on every node. As a result of using document.createElement, we can prime the node cache as we create DOM nodes, allowing us to skip a potential lookup (which used the data-reactid attribute). Root nodes will have a data-reactroot attribute and server generated markup will still contain data-reactid. (@sophiebits in #5205)<span>s. ReactDOM will now render plain text nodes interspersed with comment nodes that are used for demarcation. This gives us the same ability to update individual pieces of text, without creating extra nested nodes. If you were targeting these <span>s in your CSS, you will need to adjust accordingly. You can always render them explicitly in your components. (@mwiencek in #5753)null now uses comment nodes. Previously null would render to <noscript> elements. We now use comment nodes. This may cause issues if making use of :nth-child CSS selectors. While we consider this rendering behavior an implementation detail of React, it's worth noting the potential problem. (@sophiebits in #5451)null. We added support for defining stateless components as functions in React 0.14. However, React 0.14 still allowed you to define a class component without extending React.Component or using React.createClass(), so we couldn’t reliably tell if your component is a function or a class, and did not allow returning null from it. This issue is solved in React 15, and you can now return null from any component, whether it is a class or a function. (@jimfb in #5884)React.DOM element helper, but JSX and React.createElement work on all tag names.) All SVG attributes that are implemented by the browsers should be supported too. If you find any attributes that we have missed, please let us know in this issue. (@zpao in #6243)<span>s.React.cloneElement() now resolves defaultProps. We fixed a bug in React.cloneElement() that some components may rely on. If some of the props received by cloneElement() are undefined, it used to return an element with undefined values for those props. We’re changing it to be consistent with createElement(). Now any undefined props passed to cloneElement() are resolved to the corresponding component’s defaultProps. (@truongduy134 in #5997)ReactPerf.getLastMeasurements() is opaque. This change won’t affect applications but may break some third-party tools. We are revamping ReactPerf implementation and plan to release it during the 15.x cycle. The internal performance measurement format is subject to change so, for the time being, we consider the return value of ReactPerf.getLastMeasurements() an opaque data structure that should not be relied upon. (@gaearon in #6286)These deprecations were introduced nine months ago in v0.14 with a warning and are removed:
React top-level export: findDOMNode, render, renderToString, renderToStaticMarkup, and unmountComponentAtNode. As a reminder, they are now available on ReactDOM and ReactDOMServer. (@jimfb in #5832)batchedUpdates and cloneWithProps. (@jimfb in #5859, @zpao in #6016)setProps, replaceProps, and getDOMNode. (@jimfb in #5570)react/addons entry point is removed. As a reminder, you should use separate react-addons-* packages instead. This only applies if you use the CommonJS builds. (@gaearon in #6285)children to void elements like <input> was deprecated, and now throws an error. (@jonhester in #3372)refs (e.g. this.refs.div.props) were deprecated, and are removed now. (@jimfb in #5495)Each of these changes will continue to work as before with a new warning until the release of React 16 so you can upgrade your code gradually.
LinkedStateMixin and valueLink are now deprecated due to very low popularity. If you need this, you can use a wrapper component that implements the same behavior: react-linked-input. (@jimfb in #6127)<input value={null}> as a request to clear the input. However, React 0.14 has been ignoring value={null}. React 15 warns you on a null input value and offers you to clarify your intention. To fix the warning, you may explicitly pass an empty string to clear a controlled input, or pass undefined to make the input uncontrolled. (@antoaravinth in #5048)ReactPerf.printDOM() was renamed to ReactPerf.printOperations(), and ReactPerf.getMeasurementsSummaryMap() was renamed to ReactPerf.getWasted(). (@gaearon in #6287)px automatically. This version now warns in this case (ex: writing style={{width: '300'}}. Unitless number values like width: 300 are unchanged. (@pluma in #5140)ref and key from the props. (@prometheansacrifice in #5744)props object to super() in the constructor. (@prometheansacrifice in #5346)setState() inside getChildContext(). (@raineroviir in #6121)onclick which should be onClick. (@ali in #5361)NaN values in style. (@jontewks in #5811)value and defaultValue for an input. (@mgmcdermott in #5823)onFocusIn or onFocusOut handlers as they are unnecessary in React. (@jontewks in #6296)ReactDOM.render(), this.setState(), or this.forceUpdate(). (@conorhastings in #5193 and @gaearon in #6310)TestUtils.Simulate() now prints a helpful message if you attempt to use it with shallow rendering. (@conorhastings in #5358)arrayOf() and objectOf() provide better error messages for invalid arguments. (@chicoxyzzy in #5390)componentWillReceiveProps() lifecycle method is now consistently called when context changes. (@milesj in #5787)React.cloneElement() doesn’t append slash to an existing key when used inside React.Children.map(). (@ianobermiller in #5892)cite and profile HTML attributes. (@AprilArcus in #6094 and @saiichihashimoto in #6032)cssFloat, gridRow and gridColumn CSS properties. (@stevenvachon in #6133 and @mnordick in #4779)borderImageOutset, borderImageWidth, borderImageSlice, floodOpacity, strokeDasharray, and strokeMiterlimit as unitless CSS properties. (@rofrischmann in #6210 and #6270)onAnimationStart, onAnimationEnd, onAnimationIteration, onTransitionEnd, and onInvalid events. Support for onLoad has been added to object elements. (@tomduncalf in #5187, @milesj in #6005, and @ara4n in #5781)href={null}) now results in the forceful removal, no longer trying to set to the default value used by browsers in the absence of a value. (@syranide in #1510)children to strings for Web Components. (@jimfb in #5093)<use> events. (@edmellum in #5720)<select> is unmounted while its onChange handler is executing. (@sambev in #6028)ref. (@yiminghe in #6095)Object.is is used in a number of places to compare values, which leads to fewer false positives, especially involving NaN. In particular, this affects the shallowCompare add-on. (@chicoxyzzy in #6132)loose-envify instead of envify so it installs fewer transitive dependencies. (@qerub in #6303)getMountedInstance(). (@glenjamin in #4918)render(). (@simonewebdesign in #5411)Object.create and Object.freeze in older environments. It still, however, requires ES5 shims in those environments. (@dgreensp in #4959)data- attributes with names that start with numbers. (@nLight in #5216)suppressContentEditableWarning prop for components like Draft.js that intentionally manage contentEditable children with React. (@mxstbr in #6112)createClass() on complex specs. (@sophiebits in #5550)<option> tags when using dangerouslySetInnerHTMLsetState in componentWillMount when using shallow renderingfbjs dependency to pick up change affecting handling of undefined document.autoCapitalize and autoCorrect props are now set as attributes in the DOM instead of properties to improve cross-browser compatibility<select> elements not handling updates properly.printDOM()nonce attribute for <script> and <style> elementsreversed attribute for <ol> elementsreact-dom-server.js to expose renderToString and renderToStaticMarkup for usage in the browserintegrity attributechildren prop being coerced to a string for custom elements, which was not the desired behaviorreact from dependencies to peerDependencies to match expectations and align with react-addons-* packagesdangerouslySetInnerHTML with Closure Compiler Advanced modesrcLang, default, and kind attributes for <track> elementscolor attribute.props access on DOM nodes is updated on re-rendersscryRenderedDOMComponentsWithClass so it works with SVG0 to be used as a timeout valuereact-dom.js to main to improve compatibility with toolingreact package into two: react and react-dom. This paves the way to writing components that can be shared between the web version of React and React Native. This means you will need to include both files and some functions have been moved from React to ReactDOM.react-addons-clone-with-props, react-addons-create-fragment, react-addons-css-transition-group, react-addons-linked-state-mixin, react-addons-perf, react-addons-pure-render-mixin, react-addons-shallow-compare, react-addons-test-utils, react-addons-transition-group, react-addons-update, ReactDOM.unstable_batchedUpdates).props) which returns a JSX element, and this function may be used as a component.getDOMNode() to get the underlying DOM node. Starting with this release, a ref to a DOM component is the actual DOM node. Note that refs to custom (user-defined) components work exactly as before; only the built-in DOM components are affected by this change.React.initializeTouchEvents is no longer necessary and has been removed completely. Touch events now work automatically.TestUtils.findAllInRenderedTree and related helpers are no longer able to take a DOM component, only a custom component.props object is now frozen, so mutating props after creating a component element is no longer supported. In most cases, React.cloneElement should be used instead. This change makes your components easier to reason about and enables the compiler optimizations mentioned above.createFragment helper to migrate, which now returns an array.classSet has been removed. Use classnames instead.class instead of className.this.getDOMNode() is now deprecated and ReactDOM.findDOMNode(this) can be used instead. Note that in the common case, findDOMNode is now unnecessary since a ref to the DOM component is now the actual DOM node.setProps and replaceProps are now deprecated. Instead, call ReactDOM.render again at the top level with the new props.React.Component in order to enable stateless function components. The ES3 module pattern will continue to work.style object between renders has been deprecated. This mirrors our change to freeze the props object.cloneWithProps is now deprecated. Use React.cloneElement instead (unlike cloneWithProps, cloneElement does not merge className or style automatically; you can merge them manually if needed).CSSTransitionGroup will no longer listen to transition events. Instead, you should specify transition durations manually using props such as transitionEnterTimeout={500}.React.Children.toArray which takes a nested children object and returns a flat array with keys assigned to each child. This helper makes it easier to manipulate collections of children in your render methods, especially if you want to reorder or slice this.props.children before passing it down. In addition, React.Children.map now returns plain arrays too.console.error instead of console.warn for warnings so that browsers show a full stack trace in the console. (Our warnings appear when you use patterns that will break in future releases and for code that is likely to behave unexpectedly, so we do consider our warnings to be “must-fix” errors.)Symbol in browsers that support it, in order to ensure that React never considers untrusted JSON to be a valid element. If this extra security protection is important to you, you should add a Symbol polyfill for older browsers, such as the one included by Babel’s polyfill.capture, challenge, inputMode, is, keyParams, keyType, minLength, summary, wrap. It also now supports these non-standard attributes: autoSave, results, security.xlinkActuate, xlinkArcrole, xlinkHref, xlinkRole, xlinkShow, xlinkTitle, xlinkType, xmlBase, xmlLang, xmlSpace.image SVG tag is now supported by React DOM.is="..." attribute).audio and video tags: onAbort, onCanPlay, onCanPlayThrough, onDurationChange, onEmptied, onEncrypted, onEnded, onError, onLoadedData, onLoadedMetadata, onLoadStart, onPause, onPlay, onPlaying, onProgress, onRateChange, onSeeked, onSeeking, onStalled, onSuspend, onTimeUpdate, onVolumeChange, onWaiting.shallowCompare add-on has been added as a migration path for PureRenderMixin in ES6 classes.CSSTransitionGroup can now use custom class names instead of appending -enter-active or similar to the transition name.document.body directly as the container to ReactDOM.render now gives a warning as doing so can cause problems with browser extensions that modify the DOM.<option> elements with multiple text children properly and renders <select> elements on the server with the correct option selected.React.createElement('DIV')) no longer causes problems, though we continue to recommend lowercase for consistency with the JSX tag name convention (lowercase names refer to built-in components, capitalized names refer to custom components).animationIterationCount, boxOrdinalGroup, flexOrder, tabSize, stopOpacity.Simulate.mouseEnter and Simulate.mouseLeave now work.react-tools package and JSXTransformer.js browser file have been deprecated. You can continue using version 0.13.3 of both, but we no longer support them and recommend migrating to Babel, which has built-in support for React and JSX.optimisation.react.inlineElements transform converts JSX elements to object literals like {type: 'div', props: ...} instead of calls to React.createElement. This should only be enabled in production, since it disables some development warnings/checks.optimisation.react.constantElements transform hoists element creation to the top level for subtrees that are fully static, which reduces calls to React.createElement and the resulting allocations. More importantly, it tells React that the subtree hasn’t changed so React can completely skip it when reconciling. This should only be enabled in production, since it disables some development warnings/checks.clipPath element and attribute for SVGdangerouslySetInnerHTML restrictions so {__html: undefined} will no longer throwgetChildContextreplaceState(obj) retains prototype of objcontextTypesstrokeDashoffset, flexPositive, flexNegative to the list of unitless CSS propertiesscoped - for <style> elementshigh, low, optimum - for <meter> elementsunselectable - IE-specific property to prevent user selectionstyle={null} didn't properly update styleuglify dependency to prevent a bug in IE8hasOwnProperty as an object key<select> elementsstyle works when transitioning from nullgetDOMNode for ES6 classes<html>, <head>, <body>) are treated as DOM components--non-strict-es6moduleprops after an element is created is deprecated and will cause warnings in development mode; future versions of React will incorporate performance optimizations assuming that props aren't mutatedstatics) are no longer autobound to the component classref resolution order has changed slightly such that a ref to a component is available immediately after its componentDidMount method is called; this change should be observable only if your component calls a parent component's callback within your componentDidMount, which is an anti-pattern and should be avoided regardlesssetState in life-cycle methods are now always batched and therefore asynchronous. Previously the first call on the first mount was synchronous.setState and forceUpdate on an unmounted component now warns instead of throwing. That avoids a possible race condition with Promises.this._pendingState and this._rootNodeID.React.findDOMNode(component), which should be used in place of component.getDOMNode(). The base class for ES6-based components will not have getDOMNode. This change will enable some more patterns moving forward.React.cloneElement(el, props) for making copies of React elements – see the v0.13 RC2 notes for more details.ref style, allowing a callback to be used in place of a name: <Photo ref={(c) => this._photo = c} /> allows you to reference the component with this._photo (as opposed to ref="photo" which gives this.refs.photo).this.setState() can now take a function as the first argument for transactional state updates, such as this.setState((state, props) => ({count: state.count + 1})); – this means that you no longer need to use this._pendingState, which is now gone.ComponentClass.type is deprecated. Just use ComponentClass (usually as element.type === ComponentClass).createClass-based components are removed or deprecated from ES6 classes (getDOMNode, replaceState, isMounted, setProps, replaceProps).React.addons.createFragment was added for adding keys to entire sets of children.React.addons.classSet is now deprecated. This functionality can be replaced with several freely available modules. classnames is one such module.React.addons.cloneWithProps can be migrated to use React.cloneElement instead – make sure to merge style and className manually if desired.class methods are no longer enumerable by default, which requires Object.defineProperty; if you support browsers such as IE8, you can pass --target es3 to mirror the old behavior--target option is available on the jsx command, allowing users to specify and ECMAScript version to target.es5 is the default.es3 restores the previous default behavior. An additional transform is added here to ensure the use of reserved words as properties is safe (eg this.static will become this['static'] for IE8 compatibility).transform now contains sourceMap as a JS object already, not an instance of SourceMapGenerator.> or } when inside an element. Previously it would be treated as a string but now it will be treated as a parse error. The jsx_orphaned_brackets_transformer package on npm can be used to find and fix potential issues in your JSX code.formAction, formEncType, formMethod, formTarget, marginHeight, marginWidthstrokeOpacity to the list of unitless CSS propertiesundefined to React.createElement - now there is a useful warningdisplayNamekey and ref moved off props object, now accessible on the element directlyReact.__internals is removed - it was exposed for DevTools which no longer needs accessReact.createFactory first. This is handled for you when using JSX.{...}) introduced to deprecate this.transferPropsToacceptCharset, classID, manifestReact.renderComponent --> React.renderReact.renderComponentToString --> React.renderToStringReact.renderComponentToStaticMarkup --> React.renderToStaticMarkupReact.isValidComponent --> React.isValidElementReact.PropTypes.component --> React.PropTypes.elementReact.PropTypes.renderable --> React.PropTypes.nodeReact.isValidClassinstance.transferPropsTofalse from event handlers to preventDefaultReact.createFactorykey={null} to assign implicit keysevent.getModifierState as case sensitiveevent.charCodelist updates correctly nowscrollLeft, scrollTop removed, these should not be specified as propsReact.addons.batchedUpdates added to API for hooking into update cycleReact.addons.update uses assign instead of copyProperties which does hasOwnProperty checks. Properties on prototypes will no longer be updated correctly.@jsx React.DOM no longer required{...}) operator introduced to allow easier use of props<dialog> element and associated open attribute<picture> element and associated media and sizes attributesReact.createElement API in preparation for React v0.12React.createDescriptor has been deprecated as a result<picture> is now parsed into React.DOM.pictureesprima and jstransform for correctness fixesjsx executable now exposes a --strip-types flag which can be used to remove TypeScript-like type annotationsrequire('react-tools').transform as stripTypessetState can be called inside componentWillMount in non-DOM environmentsSyntheticMouseEvent.getEventModifierState correctly renamed to getModifierStategetModifierState correctly returns a booleangetModifierState is now correctly case sensitiveinnerHTML workaround is now removed, fixing rerendering in certain casesgetDefaultProps() is now called once per class and shared across all instancesMyComponent() now returns a descriptor, not an instanceReact.isValidComponent and React.PropTypes.component validate descriptors, not component instancespropType validators should return an Error instead of logging directlynulle.key and e.getModifierState() propertiesonBeforeInput eventReact.Children.count has been added as a helper for counting the number of childrene.view properly normalizedcoords, crossOrigin, download, hrefLang, mediaGroup, muted, scrolling, shape, srcSet, start, useMap)className on a mounted SVG component now works correctlymask and tspandx, dy, fillOpacity, fontFamily, fontSize, markerEnd, markerMid, markerStart, opacity, patternContentUnits, patternUnits, preserveAspectRatio, strokeDasharray, strokeOpacityWebkit, ms, Moz, O) are now handled properlyimg event listeners are now unbound properly, preventing the error "Two valid but unequal nodes with the same data-reactid"$apply command to transform valuesdist/.envify is properly listed as a dependency instead of a peer dependency<Components.Checkbox />harmony features available in the command line with <script type="text/jsx;harmony=true">--harmony option--source-map-inline option to the jsx executabletransformWithDetails API which gives access to the raw sourcemap datadata-reactid, data-react-checksum). This DOM will not be mountable by React. Read the docs for React.renderComponentToStaticMarkupsrcSet for <img> to specify images at different pixel ratiostextAnchor for SVGclassName={false} behaves consistentlythis.refs is defined, even if no refs are specified.update function to deal with immutable data. Read the docstransform function. The only option supported is harmony, which behaves the same as jsx --harmony on the command line. This uses the ES6 transforms from jstransform.componentDidMount and componentDidUpdate no longer receive the root node as a parameter; use this.getDOMNode() insteadundefined, the default value returned by getDefaultProps will now be used insteadReact.unmountAndReleaseReactRootNode was previously deprecated and has now been removedReact.renderComponentToString is now synchronous and returns the generated HTML string<html> tag using React) is now supported only when starting with server-rendered markupdeltaY is no longer negatedinput, select, and textarea elements, .getValue() is no longer supported; use .getDOMNode().value insteadthis.context on components is now reserved for internal use by Reactdefs, linearGradient, polygon, radialGradient, stopcrossOrigin for CORS requestsdownload and hrefLang for <a> tagsmediaGroup and muted for <audio> and <video> tagsnoValidate and formNoValidate for formsproperty for Open Graph <meta> tagssandbox, seamless, and srcDoc for <iframe> tagsscope for screen readersspan for <colgroup> tagspropTypes in mixinsany, arrayOf, component, oneOfType, renderable, shape to React.PropTypesstatics on component spec for static component methods.currentTarget is now properly set.key is now polyfilled in all browsers for special (non-printable) keys.clipboardData is now polyfilled in IE.dragTransfer is now presentonMouseOver and onMouseOut in addition to the existing onMouseEnter and onMouseLeave eventsonLoad and onError on <img> elementsonReset on <form> elementsautoFocus attribute is now polyfilled consistently on input, select, and textarea__owner__ property to each component's props object; passed-in props are now never mutatedReact.renderComponent within componentDidMount), events now properly bubble to the parent component.target, .relatedTarget, and .type are now set properly.data is now properly normalized in IE9 and IE10px appended for the unitless properties columnCount, flex, flexGrow, flexShrink, lineClamp, order, widowscomponentWillUnmount handlerrenderComponentToString would store event handlersdisabled are rendered without a value (previously disabled="true", now simply disabled)key values containing . are now supporteddata-reactid values for performancekey property changesdocument only when necessary, improving performance in some cases.returnValue in modern browsers, eliminating a warning in ChromescrollLeft and scrollTop are no longer accessed on document.body, eliminating a warning in ChromeReact.addons.TestUtils was added to help write unit testsReact.addons.TransitionGroup was renamed to React.addons.CSSTransitionGroupReact.addons.TransitionGroup was added as a more general animation wrapperReact.addons.cloneWithProps was added for cloning components and modifying their propstransitionLeave in CSSTransitionGroup<input> elements, checkedLink is now supported for two-way bindingreact-tools npm package no longer includes the React core libraries; use the react package instead.displayName is now added in more cases, improving error messages and names in the React Dev ToolsJSXTransformer now uses source maps automatically in modern browsersJSXTransformer error messages now include the filename and problematic line contents when a file fails to parserows & cols for <textarea>defer & async for <script>loop for <audio> & <video>autoCorrect for form fields (a non-standard attribute only supported by mobile WebKit)onContextMenu eventsonTransitionjstransform and esprima-fbkey: CVE-2013-7035<input type="range"> and selection events.disabled attribute handling on non-<input> elements.charSet, content, form, httpEquiv, rowSpan, autoCapitalize).rx, ry).getInitialState and getDefaultProps in mixins.React.version.React.isValidClass - Used to determine if a value is a valid component constructor.React.autoBind - This was deprecated in v0.4 and now properly removed.React.unmountAndReleaseReactRootNode to React.unmountComponentAtNode.class to className as part of the transform! This is a breaking change - if you were using class, you must change this to className or your components will be visually broken.setState callbacks are now executed in the scope of your component.click events now work on Mobile Safari.Object.prototype is extended."undefined" on update when previously defined.<iframe> attributes.id attribute to data-reactid to track DOM nodes. This allows you to integrate with other JS and CSS libraries more easily.<canvas>)React.renderComponentToString(<component>, callback) allows you to use React on the server and generate markup which can be sent down to the browser.prop improvements: validation and default values. Read our blog post for details...key prop, which allows for finer control over reconciliation. Read the docs for details...React.autoBind. Read our blog post for details...<input>, <textarea>, <option>, and <select> in order to standardize many inconsistencies in browser implementations. This includes support for defaultValue, and improved implementation of the onChange event, and circuit completion. Read the docs for details...this.setState now takes an optional callback as it's second parameter. If you were using onClick={this.setState.bind(this, state)} previously, you'll want to make sure you add a third parameter so that the event is not treated as the callback.<div>{/* this is a comment and won't be rendered */}</div><div><Component1/><Component2/></div> is transformed into React.DOM.div(null, Component1(null), Component2(null)).
Previously this would be transformed into React.DOM.div(null, [Component1(null), Component2(null)]).
If you were using React without JSX previously, your code should still work.require()s to be relative unless specifiedReact.renderComponent(<div/>, domNode); React.renderComponent(<span/>, domNode); will work now.require statements are no longer relativized when passing through the transformer. This was a feature needed when building React, but doesn't translate well for other consumers of bin/jsx.var).