Update dependency react to v19.1.1 #138
Loading…
x
Reference in New Issue
Block a user
No description provided.
Delete Branch "renovate/react-19.x"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
This PR contains the following updates:
19.0.0-rc-f38c22b244-20240704
->19.1.1
18.3.23
->19.1.12
Release Notes
facebook/react (react)
v19.1.1
Compare Source
React
v19.1.0
Compare Source
Owner Stack
An 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.
#32538, #32529, #32538
React
useId
to use valid CSS selectors, changing format from:r123:
to«r123»
. #32001React DOM
href
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. #31837use-sync-external-store
exports
field topackage.json
foruse-sync-external-store
to support various entrypoints. #25231React Server Components
unstable_prerender
, a new experimental API for prerendering React Server Components on the server #31724registerServerReference
in client builds to handle server references in different environments. #32534v19.0.0
Compare Source
Below 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.
New Features
React
startTransition
can now accept async functions. Functions passed tostartTransition
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 likefetch()
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 formaction
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 forforwardRef
.React DOM Client
<form> action
prop: Form Actions allow you to manage forms automatically and integrate withuseFormStatus
. When a<form> action
succeeds, React will automatically reset the form for uncontrolled components. The form can be reset manually with the newrequestFormReset
API.<button> and <input> formAction
prop: Actions can be passed to theformAction
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
, andaction
.<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
, andpreconnect
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.React DOM Server
prerender
andprerenderToNodeStream
APIs for static site generation. They are designed to work with streaming environments like Node.js Streams and Web Streams. UnlikerenderToString
, they wait for data to load for HTML generation.React Server Components
Deprecations
element.ref
access: React 19 supports ref as a prop, so we’re deprecatingelement.ref
in favor ofelement.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-nativeBreaking Changes
React 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.React
onUncaughtError
andonCaughtError
methods tocreateRoot
andhydrateRoot
to customize this error handling.propTypes
: UsingpropTypes
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 supportdefaultProps
since there is no ES6 alternative.contextTypes
andgetChildContext
: Legacy Context for class components has been removed in favor of thecontextType
API.React.createFactory
: Now that JSX is broadly supported, allcreateFactory
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
react-dom/test-utils
: We’ve movedact
fromreact-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
andReactDOM.hydrateRoot
.unmountComponentAtNode
: Removed in favor ofroot.unmount()
.ReactDOM
.findDOMNode
: You can replaceReactDOM
.findDOMNode
with DOM Refs.Notable Changes
React
<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 thedeferredValue
returned.useMemo
anduseCallback
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.React DOM
TypeScript Changes
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 matchuseState
,createContext
etcuseRef()
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 tounknown
instead ofany
if the element is typed asReactElement
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: MostuseReducer
usage should not require explicit type arguments.For example, or
All Changes
React
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 touseDeferredValue()
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
, andgroupCollapsed
in StrictMode logging (#25172 by @timneutkens)useSyncExternalStore()
hydration in StrictMode (#26791 by @sophiebits)componentWillUnmount()
in StrictMode (#26842 by @tyao1)useState()
anduseReducer()
initializer functions in StrictMode (#28248 by @eps1lon)useId()
in StrictMode (#25713 by @gnoff)act()
no longer checksshouldYield
which can be inaccurate in test environments (#26317 by @acdlite)react.element
symbol toreact.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)React DOM
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
, andpreloadModule
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
andimageSrcSet
(#22550 by @eps1lon)flushSync
exhausts queue even if something throws (#26366 by @acdlite)react
andreact-dom
versions don’t match (#29236 by @acdlite)srcset
andsrc
are assigned last on<img>
instances (#30340 by @gnoff)src
andhref
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
, andunstable_runWithPriority
. MovecreateRoot
andhydrateRoot
toreact-dom/client
. (#28271 by @gnoff)test-utils
(#28541 by @eps1lon)unstable_flushControlled
(#26397 by @kassens)renderToStaticNodeStream()
(#28873 by @gnoff)unstable_renderSubtreeIntoContainer
(#29771 by @kassens)React DOM Server
bootstrapScripts
andbootstrapModules
(#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
andfetchpriority
in preload links (#26826 by @liuyenwei)referrerPolicy
toReactDOM.preload()
(#27096 by @styfle)react/jsx-dev-runtime
(#28921 by @himself65)errorInfo.digest
fromonRecoverableError
(#28222 by @gnoff)ReactTestRenderer
react-test-renderer
on web (#27903, #28904 by @jackpope and @acdlite)react-test-renderer/shallow
export (#25475, #28497 by @sebmarkbage and @jackpope)React Reconciler
prepareUpdate
(#26583, #27409 by @sebmarkbage and @sophiebits)React-Is
isConcurrentMode
andisAsyncMode
methods (#28224 by @gaearon)useSyncExternalStore
v19.0.0-rc-fb9a90fa48-20240614
Compare Source
v19.0.0-rc-fa6eab58-20240815
Compare Source
v19.0.0-rc-f9ebd85a-20240925
Compare Source
v19.0.0-rc-f994737d14-20240522
Compare Source
v19.0.0-rc-f90a6bcc-20240827
Compare Source
v19.0.0-rc-f6cce072-20240723
Compare Source
v19.0.0-rc-f65ac7bd-20240826
Compare Source
v19.0.0-rc-f3e09d6328-20240612
Compare Source
Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about these updates again.
This PR has been generated by Renovate Bot.
882f09db32
to459fb21f25
459fb21f25
to9159008931
9159008931
to2abfa24c47
2abfa24c47
to96f8593e2c
96f8593e2c
tob63e0db68c
b63e0db68c
to107397ead9
107397ead9
to77d24cfbd3
77d24cfbd3
toab4dfe6c42
ab4dfe6c42
to6e30288f5c
6e30288f5c
to4f434487cf
4f434487cf
to9fff7dfb85
9fff7dfb85
to300baca037
300baca037
tobe37835e30
be37835e30
to344ae93ff0
344ae93ff0
toa797e18c77
a797e18c77
tode8334218b
de8334218b
to6526d14927
6526d14927
to163fa013dc
163fa013dc
to38cf146715
38cf146715
to3087319091
3087319091
tofe12a378e0
fe12a378e0
to269709209e
269709209e
to5dc5be2992
5dc5be2992
toff5c5bf2c7
ff5c5bf2c7
to0c565eee64
0c565eee64
tob390880908
b390880908
to2d6a5dd2c9
2d6a5dd2c9
to84d8494ea4
84d8494ea4
to08d8a23d2c
08d8a23d2c
to5422f2859e
5422f2859e
to59351959bc
59351959bc
tocbc1935dfa
cbc1935dfa
to9e86f7bfe8
9e86f7bfe8
to7f89307ce8
7f89307ce8
toe0a0f01c5b
e0a0f01c5b
to415e791fbe
415e791fbe
tod455e6e95c
d455e6e95c
tocee8589f51
cee8589f51
to14782fc44a
14782fc44a
to978ce83d1d
978ce83d1d
to1359f7f05f
1359f7f05f
toaf85878cef
af85878cef
to1b50011d9c
1b50011d9c
to7af7974f05
7af7974f05
toc5bba89a4d
c5bba89a4d
tob0f9af571c
b0f9af571c
to2391e5de9b
2391e5de9b
toeb0583ae7c
eb0583ae7c
to3b9c8312c2
3b9c8312c2
to2adc9c42a8
2adc9c42a8
to3e87e4a894
3e87e4a894
to8448bc688c
8448bc688c
toe70214950e
e70214950e
toae92a11b95
ae92a11b95
to8f611830e9
8f611830e9
to08ec592364
08ec592364
to51c1a24417
51c1a24417
to7dd7512000
7dd7512000
toa036d402e1
a036d402e1
toaa491d2b26
aa491d2b26
to73f9a47c28
73f9a47c28
todf62034644
df62034644
to9967976a7f
9967976a7f
to7238faa8d8
7238faa8d8
todf92ae9224
Update dependency react to v19.0.0to Update dependency react to v19.1.0df92ae9224
toe3e902c5e1
e3e902c5e1
to8ec15c4bd3
8ec15c4bd3
to0d189627a0
0d189627a0
toff63acab91
ff63acab91
tod74114b7c8
d74114b7c8
to16e0959605
16e0959605
to68eedf8930
68eedf8930
to15f4aafb33
15f4aafb33
toefed3c2fa9
efed3c2fa9
tobe8d6febd9
be8d6febd9
to873bc3b275
873bc3b275
to80801e3d80
80801e3d80
to4bfdb720f9
4bfdb720f9
to2bc0a79545
2bc0a79545
toc4b67d4344
c4b67d4344
to0fe41391d6
0fe41391d6
to6fa520ed52
6fa520ed52
tob7e96025c2
b7e96025c2
to14da098aef
14da098aef
to81e9924f8c
81e9924f8c
tocf5b68cba5
cf5b68cba5
to8eb7ae51de
8eb7ae51de
todb622f6124
db622f6124
to725f384535
725f384535
to22859abf7d
22859abf7d
to9ceac35022
9ceac35022
to668c183266
668c183266
to498debfcad
498debfcad
tobede25ffee
bede25ffee
to4f57d4f8f6
4f57d4f8f6
tod5c994e3b4
d5c994e3b4
to38eb057e6c
38eb057e6c
to8feac64897
8feac64897
tof06df1050d
f06df1050d
to4cd2fe32bc
4cd2fe32bc
to5b115cc8ca
5b115cc8ca
to71b4e6ffc1
71b4e6ffc1
to5bb98438d8
5bb98438d8
tod529ca2f8d
d529ca2f8d
toc6223414e2
c6223414e2
to78b8b887ee
78b8b887ee
to20867e6852
20867e6852
tod7c07eff5c
d7c07eff5c
toe72ec76171
e72ec76171
toc47711f946
c47711f946
to4d401c02c2
4d401c02c2
tofa15504453
fa15504453
tocfd71168a4
cfd71168a4
toc611ff7181
c611ff7181
toeee1e01b31
eee1e01b31
to2c5ba70fb6
2c5ba70fb6
to23b8bda809
23b8bda809
to84687c4a70
84687c4a70
to8be8e6f2d1
8be8e6f2d1
toae03f65e07
ae03f65e07
to2d7ff7286e
2d7ff7286e
to6f634a7230
6f634a7230
toac7f0cef8f
ac7f0cef8f
tobb1341a78f
bb1341a78f
toc01885f3ae
c01885f3ae
tof54c87260c
f54c87260c
to3525001035
3525001035
to4a280908be
4a280908be
toa7a69264d5
a7a69264d5
to86991b288f
86991b288f
toac01064f4e
ac01064f4e
to6e7bd3d66c
6e7bd3d66c
tof8725693f5
f8725693f5
tobda48502ad
bda48502ad
to0cceb93bf7
0cceb93bf7
toa1c7b29f54
a1c7b29f54
to27186f58e0
Update dependency react to v19.1.0to Update dependency react to v19.1.127186f58e0
to7cf32fcdf2
7cf32fcdf2
to540c3b614e
540c3b614e
toa8ab75cdcd
Checkout
From your project repository, check out a new branch and test the changes.