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.

Sign up for GitHub

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

Jump to bottom

Add helpful error for link with multiple children #25657

Merged
merged 3 commits into from
May 31, 2021
Merged

Add helpful error for link with multiple children #25657

merged 3 commits into from
May 31, 2021

Conversation

timneutkens
Copy link
Member

Makes sure a helpful error is shown for <Link> with multiple children

Bug

  • Related issues linked using fixes #number
  • Integration tests added

Feature

  • Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
  • Related issues linked using fixes #number
  • Integration tests added
  • Documentation added
  • Telemetry added. In case of a feature if it's used or not.

Documentation / Examples

  • Make sure the linting passes

@timneutkens timneutkens changed the title fix/add helpful error for link children Add helpful error for link with multiple children May 31, 2021
@ijjk
Copy link
Member

ijjk commented May 31, 2021

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
buildDuration 11.8s 11.7s -108ms
buildDurationCached 3.3s 3.4s ⚠️ +151ms
nodeModulesSize 46.7 MB 46.7 MB ⚠️ +1.21 kB
Page Load Tests Overall increase ✓
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.187 2.211 ⚠️ +0.02
/ avg req/sec 1143.08 1130.91 ⚠️ -12.17
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.162 1.14 -0.02
/error-in-render avg req/sec 2150.84 2193.26 +42.42
Client Bundles (main, webpack, commons)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
framework-HASH.js gzip 39.3 kB 39.3 kB ✓
main-HASH.js gzip 19.4 kB 19.4 kB ✓
webpack-HASH.js gzip 804 B 804 B ✓
Overall change 59.5 kB 59.5 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB ✓
Overall change 31.1 kB 31.1 kB ✓
Client Pages Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_app-HASH.js gzip 1.02 kB 1.02 kB ✓
_error-HASH.js gzip 3.06 kB 3.06 kB ✓
amp-HASH.js gzip 526 B 526 B ✓
css-HASH.js gzip 334 B 334 B ✓
hooks-HASH.js gzip 890 B 890 B ✓
index-HASH.js gzip 262 B 262 B ✓
link-HASH.js gzip 1.64 kB 1.65 kB ⚠️ +4 B
routerDirect..HASH.js gzip 331 B 331 B ✓
withRouter-HASH.js gzip 329 B 329 B ✓
bb14e60e810b..30f.css gzip 125 B 125 B ✓
Overall change 8.52 kB 8.53 kB ⚠️ +4 B
Client Build Manifests
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_buildManifest.js gzip 392 B 392 B ✓
Overall change 392 B 392 B ✓
Rendered Page Sizes Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
index.html gzip 561 B 561 B ✓
link.html gzip 568 B 569 B ⚠️ +1 B
withRouter.html gzip 557 B 557 B ✓
Overall change 1.69 kB 1.69 kB ⚠️ +1 B

Diffs

Diff for _buildManifest.js 
@@ -12,7 +12,7 @@ self.__BUILD_MANIFEST = {
   "/hooks": [
     "static\u002Fchunks\u002Fpages\u002Fhooks-ac434c51eeb0f395a39d.js"
   ],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-47f6aa1a34adbbacdbbf.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-4fe890c54542b20b55c4.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-2ffbe1bc5bc0c7d0c63f.js"
   ],
Diff for link-HASH.js 
@@ -136,7 +136,12 @@
           );
         } // This will return the first child, if multiple are provided it will throw an error
 
-        var child = _react.Children.only(children);
+        var child;
+
+        if (false) {
+        } else {
+          child = _react.Children.only(children);
+        }
 
         var childRef = child && typeof child === "object" && child.ref;
Diff for link.html 
@@ -27,7 +27,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/pages/link-47f6aa1a34adbbacdbbf.js"
+      href="/_next/static/chunks/pages/link-4fe890c54542b20b55c4.js"
       as="script"
     />
   </head>
@@ -69,7 +69,7 @@
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-47f6aa1a34adbbacdbbf.js"
+      src="/_next/static/chunks/pages/link-4fe890c54542b20b55c4.js"
       async=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" async=""></script>
Serverless Mode
General Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
buildDuration 13.8s 13.4s -427ms
buildDurationCached 4.2s 4.2s ⚠️ +1ms
nodeModulesSize 46.7 MB 46.7 MB ⚠️ +1.21 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
framework-HASH.js gzip 39.3 kB 39.3 kB ✓
main-HASH.js gzip 19.4 kB 19.4 kB ✓
webpack-HASH.js gzip 804 B 804 B ✓
Overall change 59.5 kB 59.5 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB ✓
Overall change 31.1 kB 31.1 kB ✓
Client Pages Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_app-HASH.js gzip 1.02 kB 1.02 kB ✓
_error-HASH.js gzip 3.06 kB 3.06 kB ✓
amp-HASH.js gzip 526 B 526 B ✓
css-HASH.js gzip 334 B 334 B ✓
hooks-HASH.js gzip 890 B 890 B ✓
index-HASH.js gzip 262 B 262 B ✓
link-HASH.js gzip 1.64 kB 1.65 kB ⚠️ +4 B
routerDirect..HASH.js gzip 331 B 331 B ✓
withRouter-HASH.js gzip 329 B 329 B ✓
bb14e60e810b..30f.css gzip 125 B 125 B ✓
Overall change 8.52 kB 8.53 kB ⚠️ +4 B
Client Build Manifests
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_buildManifest.js gzip 392 B 392 B ✓
Overall change 392 B 392 B ✓
Serverless bundles
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_error.js 16.9 kB 16.9 kB ✓
404.html 2.42 kB 2.42 kB ✓
500.html 2.41 kB 2.41 kB ✓
amp.amp.html 10.8 kB 10.8 kB ✓
amp.html 1.61 kB 1.61 kB ✓
css.html 1.79 kB 1.79 kB ✓
hooks.html 1.67 kB 1.67 kB ✓
index.js 17.2 kB 17.2 kB ✓
link.js 17.4 kB 17.4 kB ✓
routerDirect.js 17.4 kB 17.4 kB ✓
withRouter.js 17.4 kB 17.4 kB ✓
Overall change 107 kB 107 kB ✓
Webpack 4 Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
buildDuration 10.7s 10.8s ⚠️ +105ms
buildDurationCached 4.6s 4.6s ⚠️ +26ms
nodeModulesSize 46.7 MB 46.7 MB ⚠️ +1.21 kB
Page Load Tests Overall increase ✓
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
/ failed reqs 0 0 ✓
/ total time (seconds) 2.317 2.22 -0.1
/ avg req/sec 1078.97 1126.17 +47.2
/error-in-render failed reqs 0 0 ✓
/error-in-render total time (seconds) 1.216 1.149 -0.07
/error-in-render avg req/sec 2055.29 2175.52 +120.23
Client Bundles (main, webpack, commons)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
677f882d2ed8..HASH.js gzip 13.3 kB 13.3 kB ✓
framework.HASH.js gzip 39 kB 39 kB ✓
main-HASH.js gzip 7.26 kB 7.26 kB ✓
webpack-HASH.js gzip 751 B 751 B ✓
Overall change 60.3 kB 60.3 kB ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB ✓
Overall change 31.3 kB 31.3 kB ✓
Client Pages Overall increase ⚠️
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_app-HASH.js gzip 1.28 kB 1.28 kB ✓
_error-HASH.js gzip 3.74 kB 3.74 kB ✓
amp-HASH.js gzip 536 B 536 B ✓
css-HASH.js gzip 339 B 339 B ✓
hooks-HASH.js gzip 887 B 887 B ✓
index-HASH.js gzip 227 B 227 B ✓
link-HASH.js gzip 1.63 kB 1.63 kB ⚠️ +2 B
routerDirect..HASH.js gzip 303 B 303 B ✓
withRouter-HASH.js gzip 302 B 302 B ✓
e025d2764813..52f.css gzip 125 B 125 B ✓
Overall change 9.37 kB 9.37 kB ⚠️ +2 B
Client Build Manifests
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
_buildManifest.js gzip 420 B 420 B ✓
Overall change 420 B 420 B ✓
Rendered Page Sizes
vercel/next.js canary timneutkens/next.js fix/add-helpful-error-for-link-children Change
index.html gzip 612 B 612 B ✓
link.html gzip 619 B 619 B ✓
withRouter.html gzip 606 B 606 B ✓
Overall change 1.84 kB 1.84 kB ✓

Diffs

Diff for _buildManifest.js 
@@ -12,7 +12,7 @@ self.__BUILD_MANIFEST = {
   "/hooks": [
     "static\u002Fchunks\u002Fpages\u002Fhooks-f1cc32851f5e866a7e78.js"
   ],
-  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-4b26731d43b4caf43737.js"],
+  "/link": ["static\u002Fchunks\u002Fpages\u002Flink-b1edcc58b3477620bce2.js"],
   "/routerDirect": [
     "static\u002Fchunks\u002Fpages\u002FrouterDirect-e9bdf4dc22ca5dd5d885.js"
   ],
Diff for link-HASH.js 
@@ -194,7 +194,12 @@ _N_E = (window["webpackJsonp_N_E"] = window["webpackJsonp_N_E"] || []).push([
           );
         } // This will return the first child, if multiple are provided it will throw an error
 
-        var child = _react.Children.only(children);
+        var child;
+
+        if (false) {
+        } else {
+          child = _react.Children.only(children);
+        }
 
         var childRef = child && typeof child === "object" && child.ref;
Diff for link.html 
@@ -32,7 +32,7 @@
     />
     <link
       rel="preload"
-      href="/_next/static/chunks/pages/link-4b26731d43b4caf43737.js"
+      href="/_next/static/chunks/pages/link-b1edcc58b3477620bce2.js"
       as="script"
     />
   </head>
@@ -78,7 +78,7 @@
       async=""
     ></script>
     <script
-      src="/_next/static/chunks/pages/link-4b26731d43b4caf43737.js"
+      src="/_next/static/chunks/pages/link-b1edcc58b3477620bce2.js"
       async=""
     ></script>
     <script src="/_next/static/BUILD_ID/_buildManifest.js" async=""></script>
Commit: f071327

@kodiakhq kodiakhq bot merged commit 9890565 into vercel:canary May 31, 2021
@mbifulco
Copy link

mbifulco commented Jun 2, 2021

I just wanted to give @timneutkens a shout-out for this PR... he did a great job of proactively finding me asking for help on twitter (without tagging him/next/vercel/etc), put together a simple and effective PR, and patiently responded to my follow-up questions.

This is a truly outstanding experience - thank you Tim! I'm looking forward to being able to contribute to the project myself... and I'm nearly done with my site conversion! 🙌

@sync-by-unito sync-by-unito bot mentioned this pull request Jun 16, 2021
Closed
flybayer pushed a commit to blitz-js/next.js that referenced this pull request Jun 16, 2021
@timneutkens
Add helpful error for link with multiple children (vercel#25657)
9f859bb 
Makes sure a helpful error is shown for `<Link>` with multiple children



## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.

## Documentation / Examples

- [ ] Make sure the linting passes
@vercel vercel locked as resolved and limited conversation to collaborators Jan 28, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@ijjk ijjk ijjk approved these changes

@divmain divmain Awaiting requested review from divmain

@lfades lfades Awaiting requested review from lfades

@shuding shuding Awaiting requested review from shuding

Assignees
No one assigned
Labels
type: next
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@timneutkens @ijjk @mbifulco