Ensure Interpolation works with rewrites #17872
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Stats from current PRDefault Server Mode (Increase detected
|
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| buildDuration | 13.4s | 13.3s | -51ms |
| nodeModulesSize | 63.4 MB | 63.4 MB |
Page Load Tests Overall increase ✓
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| / failed reqs | 0 | 0 | ✓ |
| / total time (seconds) | 2.62 | 2.557 | -0.06 |
| / avg req/sec | 954.15 | 977.88 | +23.73 |
| /error-in-render failed reqs | 0 | 0 | ✓ |
| /error-in-render total time (seconds) | 1.538 | 1.552 | |
| /error-in-render avg req/sec | 1625.19 | 1611.25 |
Client Bundles (main, webpack, commons) Overall decrease ✓
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| 677f882d2ed8..133b.js gzip | 11.1 kB | 11.1 kB | -4 B |
| framework.HASH.js gzip | 39 kB | 39 kB | ✓ |
| main-3fae807..efe0.js gzip | 7.3 kB | 7.3 kB | ✓ |
| webpack-e067..f178.js gzip | 751 B | 751 B | ✓ |
| Overall change | 58.1 kB | 58.1 kB | -4 B |
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| 677f882d2ed8..dule.js gzip | 6.9 kB | 6.91 kB | |
| framework.HA..dule.js gzip | 39 kB | 39 kB | ✓ |
| main-8ac5189..dule.js gzip | 6.29 kB | 6.29 kB | ✓ |
| webpack-07c5..dule.js gzip | 751 B | 751 B | ✓ |
| Overall change | 52.9 kB | 52.9 kB |
Legacy Client Bundles (polyfills)
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| polyfills-4b..e242.js gzip | 31 kB | 31 kB | ✓ |
| Overall change | 31 kB | 31 kB | ✓ |
Client Pages
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _app-9a0b9e1..b37e.js gzip | 1.28 kB | 1.28 kB | ✓ |
| _error-ed1b0..8fbd.js gzip | 3.44 kB | 3.44 kB | ✓ |
| hooks-89731c..c609.js gzip | 887 B | 887 B | ✓ |
| index-17468f..5d83.js gzip | 227 B | 227 B | ✓ |
| link-409b283..e3ab.js gzip | 1.32 kB | 1.32 kB | ✓ |
| routerDirect..924c.js gzip | 284 B | 284 B | ✓ |
| withRouter-7..c13d.js gzip | 284 B | 284 B | ✓ |
| Overall change | 7.73 kB | 7.73 kB | ✓ |
Client Pages Modern
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _app-75d3a82..dule.js gzip | 625 B | 625 B | ✓ |
| _error-4469a..dule.js gzip | 2.29 kB | 2.29 kB | ✓ |
| hooks-cbf13f..dule.js gzip | 387 B | 387 B | ✓ |
| index-b9a643..dule.js gzip | 226 B | 226 B | ✓ |
| link-92d3016..dule.js gzip | 1.28 kB | 1.28 kB | ✓ |
| routerDirect..dule.js gzip | 284 B | 284 B | ✓ |
| withRouter-f..dule.js gzip | 282 B | 282 B | ✓ |
| Overall change | 5.37 kB | 5.37 kB | ✓ |
Client Build Manifests
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _buildManifest.js gzip | 323 B | 323 B | ✓ |
| _buildManife..dule.js gzip | 329 B | 329 B | ✓ |
| Overall change | 652 B | 652 B | ✓ |
Rendered Page Sizes Overall decrease ✓
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| index.html gzip | 1 kB | 1 kB | -1 B |
| link.html gzip | 1.01 kB | 1.01 kB | -2 B |
| withRouter.html gzip | 995 B | 994 B | -1 B |
| Overall change | 3.01 kB | 3 kB | -4 B |
Diffs
Diff for 677f882d2ed8..f527f314d.js
@@ -680,10 +680,10 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
/***/ elyg: /***/ function(module, exports, __webpack_require__) {
"use strict";
- var _slicedToArray = __webpack_require__("J4zp");
-
var _regeneratorRuntime = __webpack_require__("o0o1");
+ var _slicedToArray = __webpack_require__("J4zp");
+
var _asyncToGenerator = __webpack_require__("yXPU");
var _classCallCheck = __webpack_require__("lwsE");
@@ -1249,9 +1249,14 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
_options$shallow,
shallow,
resolvedAs,
+ resolvedSource,
+ _ref3,
+ _ref4,
potentialHref,
parsedAs,
asPathname,
+ parsedSource,
+ asSource,
routeRegex,
routeMatch,
shouldInterpolate,
@@ -1373,6 +1378,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
// pages to allow building the data URL correctly
resolvedAs = as;
+ resolvedSource = "";
if (false) {
}
@@ -1383,7 +1389,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
);
if (!(0, _isDynamic.isDynamicRoute)(route)) {
- _context.next = 50;
+ _context.next = 53;
break;
}
@@ -1391,14 +1397,22 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
resolvedAs
);
asPathname = parsedAs.pathname;
+ parsedSource = (0,
+ _parseRelativeUrl.parseRelativeUrl)(as);
+ asSource = parsedSource.pathname;
routeRegex = (0, _routeRegex.getRouteRegex)(route);
routeMatch = (0, _routeMatcher.getRouteMatcher)(
routeRegex
)(asPathname);
- shouldInterpolate = route === asPathname;
- interpolatedAs = shouldInterpolate
- ? interpolateAs(route, asPathname, query)
- : {};
+ shouldInterpolate = resolvedSource
+ ? resolvedSource === asSource &&
+ (0, _isDynamic.isDynamicRoute)(resolvedSource)
+ : route === asPathname;
+ interpolatedAs = !shouldInterpolate
+ ? {}
+ : resolvedSource
+ ? interpolateAs(resolvedSource, asSource, query)
+ : interpolateAs(route, asPathname, query);
if (
!(
@@ -1406,7 +1420,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
(shouldInterpolate && !interpolatedAs.result)
)
) {
- _context.next = 49;
+ _context.next = 52;
break;
}
@@ -1417,7 +1431,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
});
if (!(missingParams.length > 0)) {
- _context.next = 47;
+ _context.next = 50;
break;
}
@@ -1448,11 +1462,11 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
)
);
- case 47:
- _context.next = 50;
+ case 50:
+ _context.next = 53;
break;
- case 49:
+ case 52:
if (shouldInterpolate) {
as = (0, _utils.formatWithValidation)(
Object.assign({}, parsedAs, {
@@ -1468,10 +1482,10 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
Object.assign(query, routeMatch);
}
- case 50:
+ case 53:
Router.events.emit("routeChangeStart", as);
- _context.prev = 51;
- _context.next = 54;
+ _context.prev = 54;
+ _context.next = 57;
return this.getRouteInfo(
route,
pathname,
@@ -1480,7 +1494,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
shallow
);
- case 54:
+ case 57:
routeInfo = _context.sent;
(error = routeInfo.error),
(props = routeInfo.props),
@@ -1495,7 +1509,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
props.pageProps.__N_REDIRECT
)
) {
- _context.next = 65;
+ _context.next = 68;
break;
}
@@ -1504,7 +1518,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
// it's not
if (!destination.startsWith("/")) {
- _context.next = 63;
+ _context.next = 66;
break;
}
@@ -1514,7 +1528,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
this._resolveHref(parsedHref, pages);
if (!pages.includes(parsedHref.pathname)) {
- _context.next = 63;
+ _context.next = 66;
break;
}
@@ -1528,14 +1542,14 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
)
);
- case 63:
+ case 66:
window.location.href = destination;
return _context.abrupt(
"return",
new Promise(function() {})
);
- case 65:
+ case 68:
Router.events.emit("beforeHistoryChange", as);
this.changeState(
method,
@@ -1547,7 +1561,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
if (false) {
}
- _context.next = 70;
+ _context.next = 73;
return this.set(
route,
pathname,
@@ -1559,9 +1573,9 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
else throw e;
});
- case 70:
+ case 73:
if (!error) {
- _context.next = 73;
+ _context.next = 76;
break;
}
@@ -1572,28 +1586,28 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
);
throw error;
- case 73:
+ case 76:
if (false) {
}
Router.events.emit("routeChangeComplete", as);
return _context.abrupt("return", true);
- case 78:
- _context.prev = 78;
- _context.t0 = _context["catch"](51);
+ case 81:
+ _context.prev = 81;
+ _context.t0 = _context["catch"](54);
if (!_context.t0.cancelled) {
- _context.next = 82;
+ _context.next = 85;
break;
}
return _context.abrupt("return", false);
- case 82:
+ case 85:
throw _context.t0;
- case 83:
+ case 86:
case "end":
return _context.stop();
}
@@ -1601,7 +1615,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
},
_callee,
this,
- [[51, 78]]
+ [[54, 81]]
);
})
);Diff for 677f882d2ed8..c9.module.js
@@ -1131,6 +1131,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
// pages to allow building the data URL correctly
var resolvedAs = as;
+ var resolvedSource = "";
if (false) {
var potentialHref;
@@ -1141,14 +1142,21 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
if ((0, _isDynamic.isDynamicRoute)(route)) {
var parsedAs = (0, _parseRelativeUrl.parseRelativeUrl)(resolvedAs);
var asPathname = parsedAs.pathname;
+ var parsedSource = (0, _parseRelativeUrl.parseRelativeUrl)(as);
+ var asSource = parsedSource.pathname;
var routeRegex = (0, _routeRegex.getRouteRegex)(route);
var routeMatch = (0, _routeMatcher.getRouteMatcher)(routeRegex)(
asPathname
);
- var shouldInterpolate = route === asPathname;
- var interpolatedAs = shouldInterpolate
- ? interpolateAs(route, asPathname, query)
- : {};
+ var shouldInterpolate = resolvedSource
+ ? resolvedSource === asSource &&
+ (0, _isDynamic.isDynamicRoute)(resolvedSource)
+ : route === asPathname;
+ var interpolatedAs = !shouldInterpolate
+ ? {}
+ : resolvedSource
+ ? interpolateAs(resolvedSource, asSource, query)
+ : interpolateAs(route, asPathname, query);
if (!routeMatch || (shouldInterpolate && !interpolatedAs.result)) {
var missingParams = Object.keys(routeRegex.groups).filter(Diff for index.html
@@ -24,7 +24,7 @@
/>
<link
rel="preload"
- href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
as="script"
crossorigin="anonymous"
/>
@@ -121,13 +121,13 @@
type="module"
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.17d128b4c94f527f314d.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.6efb941d059179ac9db0.js"
async=""
crossorigin="anonymous"
nomodule=""
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
async=""
crossorigin="anonymous"
type="module"Diff for link.html
@@ -24,7 +24,7 @@
/>
<link
rel="preload"
- href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
as="script"
crossorigin="anonymous"
/>
@@ -126,13 +126,13 @@
type="module"
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.17d128b4c94f527f314d.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.6efb941d059179ac9db0.js"
async=""
crossorigin="anonymous"
nomodule=""
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
async=""
crossorigin="anonymous"
type="module"Diff for withRouter.html
@@ -24,7 +24,7 @@
/>
<link
rel="preload"
- href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ href="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
as="script"
crossorigin="anonymous"
/>
@@ -121,13 +121,13 @@
type="module"
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.17d128b4c94f527f314d.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.6efb941d059179ac9db0.js"
async=""
crossorigin="anonymous"
nomodule=""
></script>
<script
- src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.e790c6fbd72bc7c72cc9.module.js"
+ src="/_next/static/chunks/677f882d2ed86fa3467b8979053c1a4c3f8bc4df.fabfa61c49960e847836.module.js"
async=""
crossorigin="anonymous"
type="module"Serverless Mode (Increase detected ⚠️ )
General Overall increase ⚠️
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| buildDuration | 15.3s | 15.5s | |
| nodeModulesSize | 63.4 MB | 63.4 MB |
Client Bundles (main, webpack, commons) Overall decrease ✓
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| 677f882d2ed8..133b.js gzip | 11.1 kB | N/A | N/A |
| framework.HASH.js gzip | 39 kB | 39 kB | ✓ |
| main-3fae807..efe0.js gzip | 7.3 kB | 7.3 kB | ✓ |
| webpack-e067..f178.js gzip | 751 B | 751 B | ✓ |
| 677f882d2ed8..a8c1.js gzip | N/A | 11.1 kB | N/A |
| Overall change | 58.1 kB | 58.1 kB | -4 B |
Client Bundles (main, webpack, commons) Modern Overall increase ⚠️
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| 677f882d2ed8..dule.js gzip | 6.9 kB | N/A | N/A |
| framework.HA..dule.js gzip | 39 kB | 39 kB | ✓ |
| main-8ac5189..dule.js gzip | 6.29 kB | 6.29 kB | ✓ |
| webpack-07c5..dule.js gzip | 751 B | 751 B | ✓ |
| 677f882d2ed8..dule.js gzip | N/A | 6.91 kB | N/A |
| Overall change | 52.9 kB | 52.9 kB |
Legacy Client Bundles (polyfills)
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| polyfills-4b..e242.js gzip | 31 kB | 31 kB | ✓ |
| Overall change | 31 kB | 31 kB | ✓ |
Client Pages
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _app-9a0b9e1..b37e.js gzip | 1.28 kB | 1.28 kB | ✓ |
| _error-ed1b0..8fbd.js gzip | 3.44 kB | 3.44 kB | ✓ |
| hooks-89731c..c609.js gzip | 887 B | 887 B | ✓ |
| index-17468f..5d83.js gzip | 227 B | 227 B | ✓ |
| link-409b283..e3ab.js gzip | 1.32 kB | 1.32 kB | ✓ |
| routerDirect..924c.js gzip | 284 B | 284 B | ✓ |
| withRouter-7..c13d.js gzip | 284 B | 284 B | ✓ |
| Overall change | 7.73 kB | 7.73 kB | ✓ |
Client Pages Modern
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _app-75d3a82..dule.js gzip | 625 B | 625 B | ✓ |
| _error-4469a..dule.js gzip | 2.29 kB | 2.29 kB | ✓ |
| hooks-cbf13f..dule.js gzip | 387 B | 387 B | ✓ |
| index-b9a643..dule.js gzip | 226 B | 226 B | ✓ |
| link-92d3016..dule.js gzip | 1.28 kB | 1.28 kB | ✓ |
| routerDirect..dule.js gzip | 284 B | 284 B | ✓ |
| withRouter-f..dule.js gzip | 282 B | 282 B | ✓ |
| Overall change | 5.37 kB | 5.37 kB | ✓ |
Client Build Manifests
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _buildManifest.js gzip | 323 B | 323 B | ✓ |
| _buildManife..dule.js gzip | 329 B | 329 B | ✓ |
| Overall change | 652 B | 652 B | ✓ |
Serverless bundles Overall increase ⚠️
| vercel/next.js canary | umarsenpai/next.js interpolate-rewrites | Change | |
|---|---|---|---|
| _error.js | 1.06 MB | 1.06 MB | ✓ |
| 404.html | 4.34 kB | 4.34 kB | ✓ |
| hooks.html | 3.92 kB | 3.92 kB | ✓ |
| index.js | 1.06 MB | 1.06 MB | ✓ |
| link.js | 1.1 MB | 1.1 MB | |
| routerDirect.js | 1.1 MB | 1.1 MB | |
| withRouter.js | 1.1 MB | 1.1 MB | |
| Overall change | 5.41 MB | 5.41 MB |
umarsenpai
requested review from
ijjk,
lfades,
Timer and
timneutkens
as code owners
ijjk
reviewed
Oct 14, 2020
| @@ -1,6 +1,10 @@ | |||
| module.exports = { | |||
| rewrites() { | |||
| return [ | |||
| { | |||
| source: '/item/:itemId', | |||
| destination: '/product/[productId]', | |||
There was a problem hiding this comment.
This rewrite is invalid, dynamic route interpolation is meant to be a client-side feature as shown in the docs here https://nextjs.org/docs/routing/introduction#linking-to-dynamic-paths
For this rewrite to be valid it should map to the dynamic route providing all values in the destination and not the dynamic route itself. e.g. the destination here should be /product/:itemId
Responded on the initial issue with more details here #17810 (comment)
|
I'm going to close this per #17872 (comment) further discussion can be continued on #17810 if needed, thanks for taking the time to open a PR! |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This ensures that interpolation also works with rewrites. Currently, Next throws error if we do not provide all the dynamic params of destination path of a rewrite with
next/link. Even when we pass all the params, the destination path is interpolated and displayed as URL on browser instead of source path.More information here: #17810