Without `top: 0` the route announcer triggers subtle layout shift in
Blink/Chrome.
BTW, this mostly (possibly only?) occurs on pages with specific overflow
proprty combinations on `<html/>` and `<body/>`, and only when rendering
inside a custom element like the `<next-route-announcer />` portal.
(Changing the portal into `<div/>` seems to make the layout shift
disappear, but that would be far more invasive change than just adding
`top:0`.)
---------
Co-authored-by: Shu Ding <g@shud.in>
It's currently not clear that `@vercel/otel` is just a simple wrapper
when you are trying things out. So I added an excellent example of how
to instrument create an OpenTelemetry setup.
The only FUD I have here is that people won't skip that `Manual
OpenTelemetry setup` and try to understand it. But I try to describe
this at the beginning of that section.
I'll also try to update `@vercel/otel` readme to be more transparent on
what it does.
For now, this isn't a strong requirement as normal `fetch` requests will
still work with `react@next`. But in the future, form related props e.g.
`action=` and `formAction=` requires the experimental build.
Fixes NEXT-954.
Reverts vercel/next.js#48038
fix NEXT-926
---
The root cause was that when copying the package.json, I removed all
fields except for a few (such as `exports`) but missed the `browser`
field. That caused the client bundle to resolve to the Node.js version
of React DOM, and then we had the `async_hooks` error. Added it back in
99c9b9e51f8b0d4e4503ece9d07bce09161f3341.
I reproduced the error with next-site earlier and confirmed that this
fix is good.
### What?
Report additional telemetry related to cached fetches:
- Fetch Index number to group related fetches (cache-get, cache-set,
origin)
- Origin URL map cache key to original upstream URL
### Why?
This is needed for fetch cache telemetry on the Vercel platform.
### How?
Telemetry is provided through optional parameters added to the fetch
call configuration. It is similar to the `next: {revalidate: X}` and
`{next: { internal: true }}` fields.
The origin URL and fetch index are calculated in the patch-fetch
function and are passed down to the caching classes as needed. These
fields are optional and ignored by the `FileSystemCache`.
### What?
Our current logic of detecting if a route allows dynamic params or not
(`fallback`) is flawed, and this PR fixes it.
### Why?
Right now, if no `generateStaticParams` is specified we return
`fallback: undefined` during dev. However, for an app with multiple
params, it may have multiple `generateStaticParams` defined in different
levels. If some level isn't covered by any `generateStaticParams`, we
still can't determine the fallback value.
### How?
I added a naive implementation to check if all params are covered by
`generateStaticParams` in the current or inner layers.
Closes NEXT-946
### What?
Add `.vscode` to `.eslintignore`.
### Why?
We ignore `.vscode` folder in our tests, but Next.js itself creates it
so manually running tests locally will causing them to be added. That
causes ESLint to fail because it checks JSON files inside `.vscode`
folder.
### What?
This PR makes the parent layout of parallel routes re-render when the
parallel route segments are different or when either of them has a
refetch marker.
Example:
```
.
└── app/
├── page.ts
├── layout.ts
├── foo/
│ └── page.ts
└── @modal/
├── default.js
└── foo/
└── page.ts
```
Here if you navigated to `/foo` from `/`, `@modal/foo/page` would never
get re-rendered because the tree would only re-render from
`foo/page.ts`.
This PR adds a check that checks the router state on navigation to see
if the parallel route segments diverge on navigation. Here we would be
checking that `@modal/default` is different from `@modal/page` so we
would re-render.
Also added some logic to make sure that refetch routes are processed
first when handling parallel routes.
### Why?
See example
Closes NEXT-966
Fixes #
<!-- Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change(s) that you're making:
## For Contributors
### Improving Documentation or adding/fixing Examples
- The "examples guidelines" are followed from our contributing doc
https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md
- Make sure the linting passes by running `pnpm build && pnpm lint`. See
https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md
### Fixing a bug
- Related issues linked using `fixes #number`
- Tests added. See:
https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md
### Adding a feature
- Implements an existing feature request or RFC. Make sure the feature
request has been accepted for implementation before opening a PR. (A
discussion must be opened, see
https://github.com/vercel/next.js/discussions/new?category=ideas)
- Related issues/discussions are linked using `fixes #number`
- e2e tests added
(https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Documentation added
- Telemetry added. In case of a feature if it's used or not.
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md
## For Maintainers
- Minimal description (aim for explaining to someone not on the team to
understand the PR)
- When linking to a Slack thread, you might want to share details of the
conclusion
- Link both the Linear (Fixes NEXT-xxx) and the GitHub issues
- Add review comments if necessary to explain to the reviewer the logic
behind a change
### What?
### Why?
### How?
Closes NEXT-
Fixes #
-->
This accomplishes 2 things:
1. binds the turbopack dev server to the IPv6 unspecified address
2. initializes our router with the same hostname/port of the turobpack
server
The first matches the behavior of the Node.js dev server. The IPv6
unspecified address is similar to IPv4's `0.0.0.0` address, allowing us
to accept connection from anywhere. Importantly, it _also_ allows
accepting IPv4 connections, making this address truly universal.
The second means the `request` parameter to any middleware will have the
correct origin, and the request's URL can be used to craft fetch
requests to API endpoints. `new URL(req.url).origin` will be the origin
of the turbopack dev server.
Fixes https://github.com/vercel/turbo/issues/4456
Fixes WEB-855
With the addition of the query prefix we can hit the max length for PCRE
named matches so this reduces the prefix length and ensures we go
through the param name validation still
x-ref: https://twitter.com/simonecervini/status/1644123851003928579
### What?
Change the caching logic for fetch-cache to only cache successful
responses.
### Why?
Currently fetch-cache will cache any response, without checking the http
status code. But situations like 500 and 304 and others should not be
cached, because we want to re-fetch from the origin.
### How?
Add an extra check before deciding to call `incrementalCache.set()`
---------
Co-authored-by: JJ Kasper <jj@jjsweb.site>
This ensures the prefix for route params is stripped when pulled from
the revalidate headers. Also updates tests accordingly.
x-ref: https://github.com/vercel/next.js/pull/47930
The first implementation had limitation wrt to static routes so this is
a "simpler" approach to making interception work. This also fixes a few
bugs.
In this PR:
- changed the computation of the referrer route to now live on the
client state, since it's the only place where you can accurately keep
track of that. One router state was not sufficient, we needed a delta of
two states to guess which route had changed when having parallel routes
in the tree.
- uses rewrites as the basis for interception now instead of route
handlers, this means that we have to do some sketchy logic to make the
rules work since they only handle regexes whereas we have
`path/like/[this]`
- dev server now reloads rewrites as well when needed
<!-- Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change(s) that you're making:
## For Contributors
### Improving Documentation or adding/fixing Examples
- The "examples guidelines" are followed from our contributing doc
https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md
- Make sure the linting passes by running `pnpm build && pnpm lint`. See
https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md
### Fixing a bug
- Related issues linked using `fixes #number`
- Tests added. See:
https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md
### Adding a feature
- Implements an existing feature request or RFC. Make sure the feature
request has been accepted for implementation before opening a PR. (A
discussion must be opened, see
https://github.com/vercel/next.js/discussions/new?category=ideas)
- Related issues/discussions are linked using `fixes #number`
- e2e tests added
(https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs
- Documentation added
- Telemetry added. In case of a feature if it's used or not.
- Errors have a helpful link attached, see
https://github.com/vercel/next.js/blob/canary/contributing.md
## For Maintainers
- Minimal description (aim for explaining to someone not on the team to
understand the PR)
- When linking to a Slack thread, you might want to share details of the
conclusion
- Link both the Linear (Fixes NEXT-xxx) and the GitHub issues
- Add review comments if necessary to explain to the reviewer the logic
behind a change
### What?
### Why?
### How?
Closes NEXT-
Fixes #
-->
- Removed duplicate information
- Add links into official docs to explain `http.*` attributes
- Properly explain what `next.page` means.
fix NEXT-945
---------
Co-authored-by: Lee Robinson <me@leerob.io>
### What?
Fix missing `,` in loader tree code.
also adds `unsupported` as category of implicit metadata issue
### Why?
The loader tree to JS generated invalid code when there there where two
non-page files in a directory.
fixes WEB-861