Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make sure link can render without router #15604

Merged
merged 2 commits into from
Jul 29, 2020

Conversation

ijjk
Copy link
Member

@ijjk ijjk commented Jul 28, 2020

This ensures rendering next/link doesn't fail without being nested under the router context.

Closes: #15543

@ijjk
Copy link
Member Author

ijjk commented Jul 28, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
buildDuration 14.4s 14.4s -5ms
nodeModulesSize 65.5 MB 65.5 MB ⚠️ +89 B
Page Load Tests Overall increase ✓
vercel/next.js canary ijjk/next.js fix/link-rendering Change
/ failed reqs 0 0
/ total time (seconds) 2.542 2.534 -0.01
/ avg req/sec 983.56 986.69 +3.13
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.628 1.496 -0.13
/error-in-render avg req/sec 1535.4 1670.96 +135.56
Client Bundles (main, webpack, commons)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..b7a9.js gzip 10.2 kB 10.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
main-c5a676d..82de.js gzip 6.75 kB 6.75 kB
webpack-488d..c0e7.js gzip 751 B 751 B
Overall change 56.8 kB 56.8 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..dule.js gzip 6.09 kB 6.09 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
main-079bffd..dule.js gzip 5.83 kB 5.83 kB
webpack-4f62..dule.js gzip 751 B 751 B
Overall change 51.8 kB 51.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
polyfills-05..1236.js gzip 30.8 kB 30.8 kB
Overall change 30.8 kB 30.8 kB
Client Pages Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-8f5f611..1f7b.js gzip 1.28 kB 1.28 kB
_error-a98d9..5cb7.js gzip 3.45 kB 3.45 kB
hooks-f7f3d0..7465.js gzip 887 B 887 B
index-08fb3f..c0e9.js gzip 227 B 227 B
link-ddd176e..5566.js gzip 1.29 kB 1.3 kB ⚠️ +10 B
routerDirect..8aa1.js gzip 284 B 284 B
withRouter-f..e777.js gzip 284 B 284 B
Overall change 7.71 kB 7.72 kB ⚠️ +10 B
Client Pages Modern Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-669dbe5..dule.js gzip 626 B 626 B
_error-d5979..dule.js gzip 2.3 kB 2.3 kB
hooks-805c40..dule.js gzip 387 B 387 B
index-6ba5a4..dule.js gzip 226 B 226 B
link-69bc264..dule.js gzip 1.25 kB 1.25 kB ⚠️ +7 B
routerDirect..dule.js gzip 284 B 284 B
withRouter-d..dule.js gzip 282 B 282 B
Overall change 5.36 kB 5.36 kB ⚠️ +7 B
Client Build Manifests
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_buildManifest.js gzip 275 B 274 B -1 B
_buildManife..dule.js gzip 281 B 282 B ⚠️ +1 B
Overall change 556 B 556 B
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
index.html gzip 947 B 947 B
link.html gzip 951 B 952 B ⚠️ +1 B
withRouter.html gzip 937 B 937 B
Overall change 2.83 kB 2.84 kB ⚠️ +1 B

Diffs

Diff for _buildManifest.js
@@ -6,7 +6,7 @@ self.__BUILD_MANIFEST = {
   "/hooks": [
     "static\u002Fchunks\u002Fpages\u002Fhooks-8001dc76075832ee8949.js"
   ],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-47d000d5b33907ab0cd4.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a9269e283072f7ef2b5f.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-2e9bfd441bd88cd3382e.js"
   ],
Diff for _buildManifest.module.js
@@ -9,7 +9,7 @@ self.__BUILD_MANIFEST = {
     "static\u002Fchunks\u002Fpages\u002Fhooks-56fa58a6f0993d7d36d7.module.js"
   ],
   "/link": [
-    "static\u002Fchunks\u002Fpages\u002Flink-3c6dc1a0ec3e820dcde5.module.js"
+    "static\u002Fchunks\u002Fpages\u002Flink-9be23e1ed7374cb42e26.module.js"
   ],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-368af3dfef3c9cd99dc3.module.js"
Diff for link-3c6dc1a..e5.module.js
@@ -207,19 +207,17 @@
         var [childElm, setChildElm] = _react.default.useState();
 
         var router = (0, _router.useRouter)();
+        var pathname = (router && router.pathname) || "/";
 
         var { href, as } = _react.default.useMemo(() => {
-          var resolvedHref = (0, _router2.resolveHref)(
-            router.pathname,
-            props.href
-          );
+          var resolvedHref = (0, _router2.resolveHref)(pathname, props.href);
           return {
             href: resolvedHref,
             as: props.as
-              ? (0, _router2.resolveHref)(router.pathname, props.as)
+              ? (0, _router2.resolveHref)(pathname, props.as)
               : resolvedHref
           };
-        }, [router.pathname, props.href, props.as]);
+        }, [pathname, props.href, props.as]);
 
         _react.default.useEffect(() => {
           if (p && IntersectionObserver && childElm && childElm.tagName) {
Diff for link-47d000d..907ab0cd4.js
@@ -216,21 +216,22 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
           setChildElm = _react$default$useSta2[1];
 
         var router = (0, _router.useRouter)();
+        var pathname = (router && router.pathname) || "/";
 
         var _react$default$useMem = _react["default"].useMemo(
             function() {
               var resolvedHref = (0, _router2.resolveHref)(
-                router.pathname,
+                pathname,
                 props.href
               );
               return {
                 href: resolvedHref,
                 as: props.as
-                  ? (0, _router2.resolveHref)(router.pathname, props.as)
+                  ? (0, _router2.resolveHref)(pathname, props.as)
                   : resolvedHref
               };
             },
-            [router.pathname, props.href, props.as]
+            [pathname, props.href, props.as]
           ),
           href = _react$default$useMem.href,
           as = _react$default$useMem.as;
Diff for link.html
@@ -36,7 +36,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/pages/link-3c6dc1a0ec3e820dcde5.module.js"
+      href="/_next/static/chunks/pages/link-9be23e1ed7374cb42e26.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -146,13 +146,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-47d000d5b33907ab0cd4.js"
+      src="/_next/static/chunks/pages/link-a9269e283072f7ef2b5f.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-3c6dc1a0ec3e820dcde5.module.js"
+      src="/_next/static/chunks/pages/link-9be23e1ed7374cb42e26.module.js"
       async=""
       crossorigin="anonymous"
       type="module"

Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
buildDuration 16.1s 15.8s -282ms
nodeModulesSize 65.5 MB 65.5 MB ⚠️ +89 B
Client Bundles (main, webpack, commons)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..b7a9.js gzip 10.2 kB 10.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
main-c5a676d..82de.js gzip 6.75 kB 6.75 kB
webpack-488d..c0e7.js gzip 751 B 751 B
Overall change 56.8 kB 56.8 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..dule.js gzip 6.09 kB 6.09 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
main-079bffd..dule.js gzip 5.83 kB 5.83 kB
webpack-4f62..dule.js gzip 751 B 751 B
Overall change 51.8 kB 51.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
polyfills-05..1236.js gzip 30.8 kB 30.8 kB
Overall change 30.8 kB 30.8 kB
Client Pages Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-8f5f611..1f7b.js gzip 1.28 kB 1.28 kB
_error-a98d9..5cb7.js gzip 3.45 kB 3.45 kB
hooks-f7f3d0..7465.js gzip 887 B 887 B
index-08fb3f..c0e9.js gzip 227 B 227 B
link-ddd176e..5566.js gzip 1.29 kB N/A N/A
routerDirect..8aa1.js gzip 284 B 284 B
withRouter-f..e777.js gzip 284 B 284 B
link-6f8445b..99e1.js gzip N/A 1.3 kB N/A
Overall change 7.71 kB 7.72 kB ⚠️ +10 B
Client Pages Modern Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-669dbe5..dule.js gzip 626 B 626 B
_error-d5979..dule.js gzip 2.3 kB 2.3 kB
hooks-805c40..dule.js gzip 387 B 387 B
index-6ba5a4..dule.js gzip 226 B 226 B
link-69bc264..dule.js gzip 1.25 kB N/A N/A
routerDirect..dule.js gzip 284 B 284 B
withRouter-d..dule.js gzip 282 B 282 B
link-91516ae..dule.js gzip N/A 1.25 kB N/A
Overall change 5.36 kB 5.36 kB ⚠️ +7 B
Client Build Manifests
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_buildManifest.js gzip 275 B 274 B -1 B
_buildManife..dule.js gzip 281 B 282 B ⚠️ +1 B
Overall change 556 B 556 B
Serverless bundles Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_error.js 1.02 MB 1.02 MB
404.html 4.18 kB 4.18 kB
hooks.html 3.82 kB 3.82 kB
index.js 1.02 MB 1.02 MB
link.js 1.06 MB 1.06 MB ⚠️ +32 B
routerDirect.js 1.05 MB 1.05 MB
withRouter.js 1.05 MB 1.05 MB
Overall change 5.2 MB 5.2 MB ⚠️ +32 B
Commit: 1d2eaf9

Copy link
Member

@Timer Timer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@ijjk
Copy link
Member Author

ijjk commented Jul 29, 2020

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
buildDuration 13s 13.1s ⚠️ +64ms
nodeModulesSize 65.5 MB 65.5 MB ⚠️ +89 B
Page Load Tests Overall decrease ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
/ failed reqs 0 0
/ total time (seconds) 2.369 2.379 ⚠️ +0.01
/ avg req/sec 1055.19 1050.68 ⚠️ -4.51
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.46 1.582 ⚠️ +0.12
/error-in-render avg req/sec 1712.83 1580.6 ⚠️ -132.23
Client Bundles (main, webpack, commons)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..b7a9.js gzip 10.2 kB 10.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
main-c5a676d..82de.js gzip 6.75 kB 6.75 kB
webpack-488d..c0e7.js gzip 751 B 751 B
Overall change 56.8 kB 56.8 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..dule.js gzip 6.09 kB 6.09 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
main-079bffd..dule.js gzip 5.83 kB 5.83 kB
webpack-4f62..dule.js gzip 751 B 751 B
Overall change 51.8 kB 51.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
polyfills-05..1236.js gzip 30.8 kB 30.8 kB
Overall change 30.8 kB 30.8 kB
Client Pages Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-8f5f611..1f7b.js gzip 1.28 kB 1.28 kB
_error-a98d9..5cb7.js gzip 3.45 kB 3.45 kB
hooks-f7f3d0..7465.js gzip 887 B 887 B
index-08fb3f..c0e9.js gzip 227 B 227 B
link-ddd176e..5566.js gzip 1.29 kB 1.3 kB ⚠️ +10 B
routerDirect..8aa1.js gzip 284 B 284 B
withRouter-f..e777.js gzip 284 B 284 B
Overall change 7.71 kB 7.72 kB ⚠️ +10 B
Client Pages Modern Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-669dbe5..dule.js gzip 626 B 626 B
_error-d5979..dule.js gzip 2.3 kB 2.3 kB
hooks-805c40..dule.js gzip 387 B 387 B
index-6ba5a4..dule.js gzip 226 B 226 B
link-69bc264..dule.js gzip 1.25 kB 1.25 kB ⚠️ +7 B
routerDirect..dule.js gzip 284 B 284 B
withRouter-d..dule.js gzip 282 B 282 B
Overall change 5.36 kB 5.36 kB ⚠️ +7 B
Client Build Manifests
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_buildManifest.js gzip 275 B 274 B -1 B
_buildManife..dule.js gzip 281 B 282 B ⚠️ +1 B
Overall change 556 B 556 B
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
index.html gzip 947 B 947 B
link.html gzip 951 B 952 B ⚠️ +1 B
withRouter.html gzip 937 B 937 B
Overall change 2.83 kB 2.84 kB ⚠️ +1 B

Diffs

Diff for _buildManifest.js
@@ -6,7 +6,7 @@ self.__BUILD_MANIFEST = {
   "/hooks": [
     "static\u002Fchunks\u002Fpages\u002Fhooks-8001dc76075832ee8949.js"
   ],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-47d000d5b33907ab0cd4.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-a9269e283072f7ef2b5f.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-2e9bfd441bd88cd3382e.js"
   ],
Diff for _buildManifest.module.js
@@ -9,7 +9,7 @@ self.__BUILD_MANIFEST = {
     "static\u002Fchunks\u002Fpages\u002Fhooks-56fa58a6f0993d7d36d7.module.js"
   ],
   "/link": [
-    "static\u002Fchunks\u002Fpages\u002Flink-3c6dc1a0ec3e820dcde5.module.js"
+    "static\u002Fchunks\u002Fpages\u002Flink-9be23e1ed7374cb42e26.module.js"
   ],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-368af3dfef3c9cd99dc3.module.js"
Diff for link-3c6dc1a..e5.module.js
@@ -207,19 +207,17 @@
         var [childElm, setChildElm] = _react.default.useState();
 
         var router = (0, _router.useRouter)();
+        var pathname = (router && router.pathname) || "/";
 
         var { href, as } = _react.default.useMemo(() => {
-          var resolvedHref = (0, _router2.resolveHref)(
-            router.pathname,
-            props.href
-          );
+          var resolvedHref = (0, _router2.resolveHref)(pathname, props.href);
           return {
             href: resolvedHref,
             as: props.as
-              ? (0, _router2.resolveHref)(router.pathname, props.as)
+              ? (0, _router2.resolveHref)(pathname, props.as)
               : resolvedHref
           };
-        }, [router.pathname, props.href, props.as]);
+        }, [pathname, props.href, props.as]);
 
         _react.default.useEffect(() => {
           if (p && IntersectionObserver && childElm && childElm.tagName) {
Diff for link-47d000d..907ab0cd4.js
@@ -216,21 +216,22 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
           setChildElm = _react$default$useSta2[1];
 
         var router = (0, _router.useRouter)();
+        var pathname = (router && router.pathname) || "/";
 
         var _react$default$useMem = _react["default"].useMemo(
             function() {
               var resolvedHref = (0, _router2.resolveHref)(
-                router.pathname,
+                pathname,
                 props.href
               );
               return {
                 href: resolvedHref,
                 as: props.as
-                  ? (0, _router2.resolveHref)(router.pathname, props.as)
+                  ? (0, _router2.resolveHref)(pathname, props.as)
                   : resolvedHref
               };
             },
-            [router.pathname, props.href, props.as]
+            [pathname, props.href, props.as]
           ),
           href = _react$default$useMem.href,
           as = _react$default$useMem.as;
Diff for link.html
@@ -36,7 +36,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/pages/link-3c6dc1a0ec3e820dcde5.module.js"
+      href="/_next/static/chunks/pages/link-9be23e1ed7374cb42e26.module.js"
       as="script"
       crossorigin="anonymous"
     />
@@ -146,13 +146,13 @@
       type="module"
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-47d000d5b33907ab0cd4.js"
+      src="/_next/static/chunks/pages/link-a9269e283072f7ef2b5f.js"
       async=""
       crossorigin="anonymous"
       nomodule=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-3c6dc1a0ec3e820dcde5.module.js"
+      src="/_next/static/chunks/pages/link-9be23e1ed7374cb42e26.module.js"
       async=""
       crossorigin="anonymous"
       type="module"

Serverless Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
buildDuration 14.6s 13.9s -729ms
nodeModulesSize 65.5 MB 65.5 MB ⚠️ +89 B
Client Bundles (main, webpack, commons)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..b7a9.js gzip 10.2 kB 10.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
main-c5a676d..82de.js gzip 6.75 kB 6.75 kB
webpack-488d..c0e7.js gzip 751 B 751 B
Overall change 56.8 kB 56.8 kB
Client Bundles (main, webpack, commons) Modern
vercel/next.js canary ijjk/next.js fix/link-rendering Change
677f882d2ed8..dule.js gzip 6.09 kB 6.09 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
main-079bffd..dule.js gzip 5.83 kB 5.83 kB
webpack-4f62..dule.js gzip 751 B 751 B
Overall change 51.8 kB 51.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary ijjk/next.js fix/link-rendering Change
polyfills-05..1236.js gzip 30.8 kB 30.8 kB
Overall change 30.8 kB 30.8 kB
Client Pages Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-8f5f611..1f7b.js gzip 1.28 kB 1.28 kB
_error-a98d9..5cb7.js gzip 3.45 kB 3.45 kB
hooks-f7f3d0..7465.js gzip 887 B 887 B
index-08fb3f..c0e9.js gzip 227 B 227 B
link-ddd176e..5566.js gzip 1.29 kB N/A N/A
routerDirect..8aa1.js gzip 284 B 284 B
withRouter-f..e777.js gzip 284 B 284 B
link-6f8445b..99e1.js gzip N/A 1.3 kB N/A
Overall change 7.71 kB 7.72 kB ⚠️ +10 B
Client Pages Modern Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_app-669dbe5..dule.js gzip 626 B 626 B
_error-d5979..dule.js gzip 2.3 kB 2.3 kB
hooks-805c40..dule.js gzip 387 B 387 B
index-6ba5a4..dule.js gzip 226 B 226 B
link-69bc264..dule.js gzip 1.25 kB N/A N/A
routerDirect..dule.js gzip 284 B 284 B
withRouter-d..dule.js gzip 282 B 282 B
link-91516ae..dule.js gzip N/A 1.25 kB N/A
Overall change 5.36 kB 5.36 kB ⚠️ +7 B
Client Build Manifests
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_buildManifest.js gzip 275 B 274 B -1 B
_buildManife..dule.js gzip 281 B 282 B ⚠️ +1 B
Overall change 556 B 556 B
Serverless bundles Overall increase ⚠️
vercel/next.js canary ijjk/next.js fix/link-rendering Change
_error.js 1.02 MB 1.02 MB
404.html 4.18 kB 4.18 kB
hooks.html 3.82 kB 3.82 kB
index.js 1.02 MB 1.02 MB
link.js 1.06 MB 1.06 MB ⚠️ +32 B
routerDirect.js 1.05 MB 1.05 MB
withRouter.js 1.05 MB 1.05 MB
Overall change 5.2 MB 5.2 MB ⚠️ +32 B
Commit: 033d448

@kodiakhq kodiakhq bot merged commit 86ba29f into vercel:canary Jul 29, 2020
@timneutkens timneutkens deleted the fix/link-rendering branch July 29, 2020 07:09
LauraBeatris pushed a commit to LauraBeatris/next.js that referenced this pull request Sep 1, 2020
This ensures rendering `next/link` doesn't fail without being nested under the router context.

Closes: vercel#15543
@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Cannot test <Link> outside of a Page on Next v9.5.0 (Enzyme + Jest)
2 participants