Merge branch 'canary' into fix/startTime-error

vercel · Sep 16, 2024 · 4b357bf · 4b357bf
2 parents 2cf0dab + aa66ee4
commit 4b357bf
Show file tree

Hide file tree

Showing 149 changed files with 7,631 additions and 3,500 deletions.
diff --git a/.github/workflows/build_and_deploy.yml b/.github/workflows/build_and_deploy.yml
@@ -9,7 +9,7 @@ on:
 
 env:
   NAPI_CLI_VERSION: 2.16.2
-  TURBO_VERSION: 2.0.9
+  TURBO_VERSION: 2.1.2
   NODE_LTS_VERSION: 20
   CARGO_PROFILE_RELEASE_LTO: 'true'
   TURBO_TEAM: 'vercel'
@@ -106,16 +106,20 @@ jobs:
       fail-fast: false
       matrix:
         exclude:
-          # only build the binaries we usually test with
-          # darwin arm64, windows x64, linux GNU x64
+          # only build the binaries we run automated tests against
+          # linux GNU x64
           - settings:
               target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'i686-pc-windows-msvc' }}
+          - settings:
+              target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'aarch64-apple-darwin' }}
           - settings:
               target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'aarch64-pc-windows-msvc' }}
           - settings:
               target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'aarch64-unknown-linux-gnu' }}
           - settings:
               target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'aarch64-unknown-linux-musl' }}
+          - settings:
+              target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'x86_64-pc-windows-msvc' }}
           - settings:
               target: ${{ needs.deploy-target.outputs.value == 'automated-preview' && 'x86_64-unknown-linux-musl' }}
           - settings:

diff --git a/.github/workflows/build_and_test.yml b/.github/workflows/build_and_test.yml
@@ -8,7 +8,7 @@ on:
 
 env:
   NAPI_CLI_VERSION: 2.14.7
-  TURBO_VERSION: 2.0.9
+  TURBO_VERSION: 2.1.2
   NODE_MAINTENANCE_VERSION: 18
   NODE_LTS_VERSION: 20
   TEST_CONCURRENCY: 8

diff --git a/.github/workflows/build_reusable.yml b/.github/workflows/build_reusable.yml
@@ -67,7 +67,7 @@ on:
 
 env:
   NAPI_CLI_VERSION: 2.14.7
-  TURBO_VERSION: 2.0.3
+  TURBO_VERSION: 2.1.2
   NODE_LTS_VERSION: 20.9.0
   TEST_CONCURRENCY: 8
   # disable backtrace for test snapshots

diff --git a/.github/workflows/code_freeze.yml b/.github/workflows/code_freeze.yml
@@ -17,7 +17,7 @@ name: Code Freeze
 
 env:
   NAPI_CLI_VERSION: 2.14.7
-  TURBO_VERSION: 2.0.9
+  TURBO_VERSION: 2.1.2
   NODE_LTS_VERSION: 20
 
 jobs:

diff --git a/.github/workflows/pull_request_stats.yml b/.github/workflows/pull_request_stats.yml
@@ -6,7 +6,7 @@ name: Generate Pull Request Stats
 
 env:
   NAPI_CLI_VERSION: 2.14.7
-  TURBO_VERSION: 2.0.9
+  TURBO_VERSION: 2.1.2
   NODE_LTS_VERSION: 20
   TEST_CONCURRENCY: 6
 

diff --git a/.github/workflows/trigger_release.yml b/.github/workflows/trigger_release.yml
@@ -35,7 +35,7 @@ name: Trigger Release
 
 env:
   NAPI_CLI_VERSION: 2.14.7
-  TURBO_VERSION: 2.0.9
+  TURBO_VERSION: 2.1.2
   NODE_LTS_VERSION: 20
 
 jobs:

diff --git a/UPGRADING.md b/UPGRADING.md
@@ -1 +1 @@
-This document has been moved to [nextjs.org/docs/upgrading](https://nextjs.org/docs/upgrading). It's also available in this repository on [/docs/02-app/01-building-your-application/10-upgrading](/docs/02-app/01-building-your-application/10-upgrading).
+This document has been moved to [nextjs.org/docs/upgrading](https://nextjs.org/docs/upgrading). It's also available in this repository on [/docs/02-app/01-building-your-application/11-upgrading](/docs/02-app/01-building-your-application/11-upgrading).
diff --git a/crates/napi/src/minify.rs b/crates/napi/src/minify.rs
@@ -110,6 +110,13 @@ impl Task for MinifyTask {
 fn patch_opts(opts: &mut JsMinifyOptions) {
     opts.compress = BoolOrDataConfig::from_obj(TerserCompressorOptions {
         inline: Some(TerserInlineOption::Num(2)),
+        global_defs: [(
+            "process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE".into(),
+            false.into(),
+        )]
+        .iter()
+        .cloned()
+        .collect(),
         ..Default::default()
     });
     opts.mangle = BoolOrDataConfig::from_obj(MangleOptions {

diff --git a/crates/next-core/src/app_segment_config.rs b/crates/next-core/src/app_segment_config.rs
@@ -219,7 +219,7 @@ impl Issue for NextSegmentConfigParsingIssue {
 
     #[turbo_tasks::function]
     fn source(&self) -> Vc<OptionIssueSource> {
-        Vc::cell(Some(self.source))
+        Vc::cell(Some(self.source.resolve_source_map(self.ident.path())))
     }
 }
 

diff --git a/crates/next-core/src/next_shared/webpack_rules/sass.rs b/crates/next-core/src/next_shared/webpack_rules/sass.rs
@@ -50,7 +50,7 @@ pub async fn maybe_add_sass_loader(
             options: take(
                 serde_json::json!({
                     //https://github.com/vercel/turbo/blob/d527eb54be384a4658243304cecd547d09c05c6b/crates/turbopack-node/src/transforms/webpack.rs#L191
-                    "sourceMap": false
+                    "sourceMap": true
                 })
                 .as_object_mut()
                 .unwrap(),

diff --git a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
@@ -60,6 +60,38 @@ fn effect_has_side_effect_deps(call: &CallExpr) -> bool {
     false
 }
 
+fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
+    // Wrap the call expression with the condition
+    // turn it into `process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && <call>`.
+    // And `process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE` will be treated as `false` in
+    // minification. In this way the expression and dependencies are still available in
+    // compilation during bundling, but will be removed in the final DEC.
+    Expr::Bin(BinExpr {
+        span: DUMMY_SP,
+        left: Box::new(Expr::Member(MemberExpr {
+            obj: (Box::new(Expr::Member(MemberExpr {
+                obj: (Box::new(Expr::Ident(Ident {
+                    sym: "process".into(),
+                    span: DUMMY_SP,
+                    ..Default::default()
+                }))),
+                prop: MemberProp::Ident(IdentName {
+                    sym: "env".into(),
+                    span: DUMMY_SP,
+                }),
+                span: DUMMY_SP,
+            }))),
+            prop: (MemberProp::Ident(IdentName {
+                sym: "__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE".into(),
+                span: DUMMY_SP,
+            })),
+            span: DUMMY_SP,
+        })),
+        op: op!("&&"),
+        right: Box::new(Expr::Call(call)),
+    })
+}
+
 impl Fold for OptimizeServerReact {
     fn fold_module_items(&mut self, items: Vec<ModuleItem>) -> Vec<ModuleItem> {
         let mut new_items = vec![];
@@ -101,26 +133,28 @@ impl Fold for OptimizeServerReact {
     fn fold_expr(&mut self, expr: Expr) -> Expr {
         if let Expr::Call(call) = &expr {
             if let Callee::Expr(box Expr::Ident(f)) = &call.callee {
-                // Remove `useEffect` call
+                // Mark `useEffect` as DCE'able
                 if let Some(use_effect_ident) = &self.use_effect_ident {
                     if &f.to_id() == use_effect_ident && !effect_has_side_effect_deps(call) {
-                        return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        // return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        return wrap_expr_with_env_prod_condition(call.clone());
                     }
                 }
-                // Remove `useLayoutEffect` call
+                // Mark `useLayoutEffect` as DCE'able
                 if let Some(use_layout_effect_ident) = &self.use_layout_effect_ident {
                     if &f.to_id() == use_layout_effect_ident && !effect_has_side_effect_deps(call) {
-                        return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        return wrap_expr_with_env_prod_condition(call.clone());
                     }
                 }
             } else if let Some(react_ident) = &self.react_ident {
                 if let Callee::Expr(box Expr::Member(member)) = &call.callee {
                     if let box Expr::Ident(f) = &member.obj {
                         if &f.to_id() == react_ident {
                             if let MemberProp::Ident(i) = &member.prop {
-                                // Remove `React.useEffect` and `React.useLayoutEffect` calls
+                                // Mark `React.useEffect` and `React.useLayoutEffect` as DCE'able
+                                // calls in production
                                 if i.sym == "useEffect" || i.sym == "useLayoutEffect" {
-                                    return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                                    return wrap_expr_with_env_prod_condition(call.clone());
                                 }
                             }
                         }

diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
@@ -1,8 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import React from 'react';
 export default function App() {
-    null;
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
+        console.log('Hello World');
+    }, []);
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]);
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);
@@ -15,7 +24,9 @@ export default function App() {
     const a = useMemo(()=>{
         return 1;
     }, []);
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && React.useEffect(()=>{
+        console.log('Hello World');
+    });
     return <div>
       <h1>Hello World</h1>
     </div>;

diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
@@ -16,8 +16,26 @@ export default function FilterItemDropdown({ list }) {
         ()=>null
     ];
     const ref = useRef(null);
-    null;
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
+        const handleClickOutside = (event)=>{
+            if (ref.current && !ref.current.contains(event.target)) {
+                setOpenSelect(false);
+            }
+        };
+        window.addEventListener('click', handleClickOutside);
+        return ()=>window.removeEventListener('click', handleClickOutside);
+    }, []);
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
+        list.forEach((listItem)=>{
+            if ('path' in listItem && pathname === listItem.path || 'slug' in listItem && searchParams.get('sort') === listItem.slug) {
+                setActive(listItem.title);
+            }
+        });
+    }, [
+        pathname,
+        list,
+        searchParams
+    ]);
     return <div className="relative" ref={ref}>
       <div onClick={()=>{
         setOpenSelect(!openSelect);

diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
@@ -5,7 +5,14 @@ export default function App() {
     useEffect(()=>{
         console.log('Hello World');
     }, []);
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]);
     const a = useMemo(()=>{
         return 1;
     }, []);

diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
@@ -5,7 +5,7 @@ const Component = ({ children, fallback })=>{
         false,
         ()=>null
     ];
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>setMounted(true), []);
     if (!mounted) {
         return fallback ?? /* @__PURE__ */ jsx(Fragment, {});
     }

diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
@@ -1,8 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import * as React from 'react';
 export default function App() {
-    null;
-    null;
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
+        console.log('Hello World');
+    }, []);
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]);
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);

diff --git a/docs/02-app/01-building-your-application/01-routing/14-middleware.mdx b/docs/02-app/01-building-your-application/01-routing/14-middleware.mdx
@@ -573,7 +573,7 @@ export default async function middleware(req) {
 
 ## Runtime
 
-Middleware currently only supports the [Edge runtime](/docs/app/building-your-application/rendering/edge-and-nodejs-runtimes). The Node.js runtime can not be used.
+Middleware currently only supports APIs compatible with the [Edge runtime](/docs/app/building-your-application/rendering/edge-and-nodejs-runtimes). APIs exclusive to Node.js are [unsupported](/docs/app/api-reference/edge#unsupported-apis).
 
 ## Version History
 

diff --git a/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx b/docs/02-app/01-building-your-application/02-data-fetching/01-fetching.mdx
@@ -275,14 +275,14 @@ interface Post {
 }
 
 async function getPost(id: string) {
-  let res = await fetch(`https://api.example.com/posts/${id}`)
+  let res = await fetch(`https://api.vercel.app/blog/${id}`)
   let post: Post = await res.json()
   if (!post) notFound()
   return post
 }
 
 export async function generateStaticParams() {
-  let posts = await fetch('https://api.example.com/posts').then((res) =>
+  let posts = await fetch('https://api.vercel.app/blog').then((res) =>
     res.json()
   )
 
@@ -315,14 +315,14 @@ export default async function Page({ params }: { params: { id: string } }) {
 import { notFound } from 'next/navigation'
 
 async function getPost(id) {
-  let res = await fetch(`https://api.example.com/posts/${id}`)
+  let res = await fetch(`https://api.vercel.app/blog/${id}`)
   let post = await res.json()
   if (!post) notFound()
   return post
 }
 
 export async function generateStaticParams() {
-  let posts = await fetch('https://api.example.com/posts').then((res) =>
+  let posts = await fetch('https://api.vercel.app/blog').then((res) =>
     res.json()
   )
 

diff --git a/...-building-your-application/02-data-fetching/03-server-actions-and-mutations.mdx b/...-building-your-application/02-data-fetching/03-server-actions-and-mutations.mdx
@@ -66,7 +66,7 @@ export async function create() {}
 import { create } from '@/app/actions'
 
 export function Button() {
-  return <button onClick={create}>Create</button>
+  return <button onClick={() => create()}>Create</button>
 }
 ```
 
@@ -76,7 +76,7 @@ export function Button() {
 import { create } from '@/app/actions'
 
 export function Button() {
-  return <button onClick={create}>Create</button>
+  return <button onClick={() => create()}>Create</button>
 }
 ```
 
@@ -450,7 +450,7 @@ The [`useFormStatus`](https://react.dev/reference/react-dom/hooks/useFormStatus)
 ```tsx filename="app/submit-button.tsx" highlight={6} switcher
 'use client'
 
-import { useFormStatus } from 'react'
+import { useFormStatus } from 'react-dom'
 
 export function SubmitButton() {
   const { pending } = useFormStatus()
@@ -466,7 +466,7 @@ export function SubmitButton() {
 ```jsx filename="app/submit-button.js" highlight={6} switcher
 'use client'
 
-import { useFormStatus } from 'react'
+import { useFormStatus } from 'react-dom'
 
 export function SubmitButton() {
   const { pending } = useFormStatus()

diff --git a/.../02-app/01-building-your-application/06-optimizing/12-third-party-libraries.mdx b/.../02-app/01-building-your-application/06-optimizing/12-third-party-libraries.mdx
@@ -128,7 +128,7 @@ export function EventButton() {
   return (
     <div>
       <button
-        onClick={() => sendGTMEvent('event', 'buttonClicked', { value: 'xyz' })}
+        onClick={() => sendGTMEvent({ event: 'buttonClicked', value: 'xyz' })}
       >
         Send Event
       </button>