mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Hendrik LiebauandGitHub
22daa8edc5
When a server function closes over another function (without a server directive), React will fail to serialize the function. For server-side usages (e.g. a `"use cache"` function that's called during rendering), we did show the error in the dev overlay, but without a useful stack and without an error source. For client-side usages (i.e. a server function passed to a client component) we didn't show an error at all initially, and only after triggering the server function the error was shown. With this PR, we're now showing a proper error in the dev overlay for both cases: <img width="537" alt="Screenshot 2024-12-03 at 11 56 30" src="https://github.com/user-attachments/assets/0af4b120-07c2-4266-8d5c-0b29a89abc6d"> For the client-side usage, we need to lean on the console replaying feature to make this work. In addition, the compiler now also tracks closed-over function declarations, and not only arrow expressions. For functions or arrow expressions that are not passed in as arguments/props, but are declared in the parent scope of the server function, we could even emit a build error as a follow-up PR.
17 lines
278 B
TypeScript
17 lines
278 B
TypeScript
function createCachedFn(start: number) {
|
|
function fn() {
|
|
return start
|
|
}
|
|
|
|
return async () => {
|
|
'use cache'
|
|
return Math.random() + fn()
|
|
}
|
|
}
|
|
|
|
const getCachedValue = createCachedFn(42)
|
|
|
|
export default async function Page() {
|
|
return <p>{getCachedValue()}</p>
|
|
}
|