From 4cdb585962b4f17be55848740d6e34106d730217 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Sun, 15 Aug 2021 19:49:21 +0800 Subject: [PATCH 1/9] Fix: wrong link error message (#28127) Fixes: #28126 ## Bug - [x] Related issues linked using `fixes #number` - [x] Integration tests added - [x] Errors have helpful link attached, see `contributing.md` --- packages/next/client/link.tsx | 2 +- test/acceptance/ReactRefreshLogBox.dev.test.js | 10 ++++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/next/client/link.tsx b/packages/next/client/link.tsx index 9419739564ee..eccc96500275 100644 --- a/packages/next/client/link.tsx +++ b/packages/next/client/link.tsx @@ -237,7 +237,7 @@ function Link(props: React.PropsWithChildren) { throw new Error( `Multiple children were passed to with \`href\` of \`${props.href}\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children` + (typeof window !== 'undefined' - ? "\nOpen your browser's console to view the Component stack trace." + ? " \nOpen your browser's console to view the Component stack trace." : '') ) } diff --git a/test/acceptance/ReactRefreshLogBox.dev.test.js b/test/acceptance/ReactRefreshLogBox.dev.test.js index 5256e3c707c8..be8482a140c9 100644 --- a/test/acceptance/ReactRefreshLogBox.dev.test.js +++ b/test/acceptance/ReactRefreshLogBox.dev.test.js @@ -1130,6 +1130,16 @@ test(' with multiple children', async () => { expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Multiple children were passed to with \`href\` of \`/\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children"` ) + expect( + await session.evaluate( + () => + document + .querySelector('body > nextjs-portal') + .shadowRoot.querySelector( + '#nextjs__container_errors_desc a:nth-of-type(1)' + ).href + ) + ).toMatch('https://nextjs.org/docs/messages/link-multiple-children') await cleanup() }) From d5dc968134db912e9ae5e8bf9659c0af461c58dc Mon Sep 17 00:00:00 2001 From: Lee Robinson Date: Sun, 15 Aug 2021 13:44:00 -0400 Subject: [PATCH 2/9] Improve React Strict Mode documentation. (#28139) The current text linked wasn't obvious. Plus, the best description of what Strict Mode is was at the bottom of the document. --- docs/api-reference/next.config.js/react-strict-mode.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/api-reference/next.config.js/react-strict-mode.md b/docs/api-reference/next.config.js/react-strict-mode.md index d442b81ac1ad..b844bf84506f 100644 --- a/docs/api-reference/next.config.js/react-strict-mode.md +++ b/docs/api-reference/next.config.js/react-strict-mode.md @@ -6,7 +6,9 @@ description: The complete Next.js runtime is now Strict Mode-compliant, learn ho > **Suggested**: We strongly suggest you enable Strict Mode in your Next.js application to better prepare your application for the future of React. -The Next.js runtime is now Strict Mode-compliant. To opt-in to Strict Mode, configure the following option in your `next.config.js`: +React's [Strict Mode](https://reactjs.org/docs/strict-mode.html) is a development mode only feature for highlighting potential problems in an application. It helps to identify unsafe lifecycles, legacy API usage, and a number of other features. + +The Next.js runtime is Strict Mode-compliant. To opt-in to Strict Mode, configure the following option in your `next.config.js`: ```js // next.config.js @@ -15,9 +17,7 @@ module.exports = { } ``` -If you or your team are not ready to use Strict Mode in your entire application, that's OK! You can incrementally migrate on a page-by-page basis [using ``](https://reactjs.org/docs/strict-mode.html). - -React's Strict Mode is a development mode only feature for highlighting potential problems in an application. It helps to identify unsafe lifecycles, legacy API usage, and a number of other features. +If you or your team are not ready to use Strict Mode in your entire application, that's OK! You can incrementally migrate on a page-by-page basis using ``. ## Related From 97f9b64cf63d8950d97b94a66059324952e6814d Mon Sep 17 00:00:00 2001 From: Maia Teegarden Date: Sun, 15 Aug 2021 11:44:28 -0700 Subject: [PATCH 3/9] Add setup for m1 build (#28138) * Add setup for m1 build * Add workflow to cache key Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> --- .github/workflows/build_native.yml | 10 +++++++++- .github/workflows/build_test_deploy.yml | 10 +++++++++- 2 files changed, 18 insertions(+), 2 deletions(-) diff --git a/.github/workflows/build_native.yml b/.github/workflows/build_native.yml index ad179aacb34a..dcf21e7da8fd 100644 --- a/.github/workflows/build_native.yml +++ b/.github/workflows/build_native.yml @@ -50,7 +50,15 @@ jobs: uses: actions/cache@v2 with: path: packages/next/native/** - key: next-swc-nightly-2021-03-25-${{ matrix.target }}-${{ hashFiles('packages/next/build/swc/**') }} + key: next-swc-nightly-2021-03-25-${{ matrix.target }}-${{ hashFiles('.github/workflows/build_native.yml', 'packages/next/build/swc/**') }} + - name: Cross build aarch64 setup + if: ${{ matrix.target == 'aarch64-apple-darwin' && steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} + run: | + sudo rm -Rf /Library/Developer/CommandLineTools/SDKs/*; + export CC=$(xcrun -f clang); + export CXX=$(xcrun -f clang++); + SYSROOT=$(xcrun --sdk macosx --show-sdk-path); + export CFLAGS="-isysroot $SYSROOT -isystem $SYSROOT"; - name: 'Build' if: steps.binary-cache.outputs.cache-hit != true run: yarn build-native --target ${{ matrix.target }} diff --git a/.github/workflows/build_test_deploy.yml b/.github/workflows/build_test_deploy.yml index 27f7e23aad80..e4ccd0d23b7c 100644 --- a/.github/workflows/build_test_deploy.yml +++ b/.github/workflows/build_test_deploy.yml @@ -352,7 +352,15 @@ jobs: if: ${{ steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} with: path: packages/next/native/next-swc.*.node - key: next-swc-nightly-2021-03-25-${{ matrix.target }}-${{ hashFiles('packages/next/build/swc/**') }} + key: next-swc-nightly-2021-03-25-${{ matrix.target }}-${{ hashFiles('.github/workflows/build_test_deploy.yml', 'packages/next/build/swc/**') }} + - name: Cross build aarch64 setup + if: ${{ matrix.target == 'aarch64-apple-darwin' && steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} + run: | + sudo rm -Rf /Library/Developer/CommandLineTools/SDKs/*; + export CC=$(xcrun -f clang); + export CXX=$(xcrun -f clang++); + SYSROOT=$(xcrun --sdk macosx --show-sdk-path); + export CFLAGS="-isysroot $SYSROOT -isystem $SYSROOT"; - name: 'Build' if: ${{ steps.binary-cache.outputs.cache-hit != 'true' && steps.docs-change.outputs.DOCS_CHANGE != 'docs only change' }} run: yarn build-native --target ${{ matrix.target }} From ebe3d93f59b0749c9ac740c2f866c64d6adad763 Mon Sep 17 00:00:00 2001 From: Maia Teegarden Date: Sun, 15 Aug 2021 11:46:11 -0700 Subject: [PATCH 4/9] v11.1.1-canary.8 --- lerna.json | 2 +- packages/create-next-app/package.json | 2 +- packages/eslint-config-next/package.json | 4 ++-- packages/eslint-plugin-next/package.json | 2 +- packages/next-bundle-analyzer/package.json | 2 +- packages/next-codemod/package.json | 2 +- packages/next-env/package.json | 2 +- packages/next-mdx/package.json | 2 +- packages/next-plugin-storybook/package.json | 2 +- packages/next-polyfill-module/package.json | 2 +- packages/next-polyfill-nomodule/package.json | 2 +- packages/next/package.json | 12 ++++++------ packages/react-dev-overlay/package.json | 2 +- packages/react-refresh-utils/package.json | 2 +- 14 files changed, 20 insertions(+), 20 deletions(-) diff --git a/lerna.json b/lerna.json index b0a3060e8555..8cdce0298d40 100644 --- a/lerna.json +++ b/lerna.json @@ -17,5 +17,5 @@ "registry": "https://registry.npmjs.org/" } }, - "version": "11.1.1-canary.7" + "version": "11.1.1-canary.8" } diff --git a/packages/create-next-app/package.json b/packages/create-next-app/package.json index bc44e36d0e41..4679434de840 100644 --- a/packages/create-next-app/package.json +++ b/packages/create-next-app/package.json @@ -1,6 +1,6 @@ { "name": "create-next-app", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "keywords": [ "react", "next", diff --git a/packages/eslint-config-next/package.json b/packages/eslint-config-next/package.json index 198f1e0347f6..a9864e67c737 100644 --- a/packages/eslint-config-next/package.json +++ b/packages/eslint-config-next/package.json @@ -1,6 +1,6 @@ { "name": "eslint-config-next", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "ESLint configuration used by NextJS.", "main": "index.js", "license": "MIT", @@ -9,7 +9,7 @@ "directory": "packages/eslint-config-next" }, "dependencies": { - "@next/eslint-plugin-next": "11.1.1-canary.7", + "@next/eslint-plugin-next": "11.1.1-canary.8", "@rushstack/eslint-patch": "^1.0.6", "@typescript-eslint/parser": "^4.20.0", "eslint-import-resolver-node": "^0.3.4", diff --git a/packages/eslint-plugin-next/package.json b/packages/eslint-plugin-next/package.json index 69791beb4296..efa5d529ddda 100644 --- a/packages/eslint-plugin-next/package.json +++ b/packages/eslint-plugin-next/package.json @@ -1,6 +1,6 @@ { "name": "@next/eslint-plugin-next", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "ESLint plugin for NextJS.", "main": "lib/index.js", "license": "MIT", diff --git a/packages/next-bundle-analyzer/package.json b/packages/next-bundle-analyzer/package.json index a81b127fda78..b7010a541872 100644 --- a/packages/next-bundle-analyzer/package.json +++ b/packages/next-bundle-analyzer/package.json @@ -1,6 +1,6 @@ { "name": "@next/bundle-analyzer", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "main": "index.js", "license": "MIT", "repository": { diff --git a/packages/next-codemod/package.json b/packages/next-codemod/package.json index 62954bfba447..077a146cf9c1 100644 --- a/packages/next-codemod/package.json +++ b/packages/next-codemod/package.json @@ -1,6 +1,6 @@ { "name": "@next/codemod", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "license": "MIT", "dependencies": { "chalk": "4.1.0", diff --git a/packages/next-env/package.json b/packages/next-env/package.json index 3785eed69618..703232d02100 100644 --- a/packages/next-env/package.json +++ b/packages/next-env/package.json @@ -1,6 +1,6 @@ { "name": "@next/env", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "keywords": [ "react", "next", diff --git a/packages/next-mdx/package.json b/packages/next-mdx/package.json index 503997a89ae0..3e7440ba8888 100644 --- a/packages/next-mdx/package.json +++ b/packages/next-mdx/package.json @@ -1,6 +1,6 @@ { "name": "@next/mdx", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "main": "index.js", "license": "MIT", "repository": { diff --git a/packages/next-plugin-storybook/package.json b/packages/next-plugin-storybook/package.json index a5c315d38c7c..ab1650ff13fe 100644 --- a/packages/next-plugin-storybook/package.json +++ b/packages/next-plugin-storybook/package.json @@ -1,6 +1,6 @@ { "name": "@next/plugin-storybook", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "repository": { "url": "vercel/next.js", "directory": "packages/next-plugin-storybook" diff --git a/packages/next-polyfill-module/package.json b/packages/next-polyfill-module/package.json index a82678b92e34..8d0c115d430f 100644 --- a/packages/next-polyfill-module/package.json +++ b/packages/next-polyfill-module/package.json @@ -1,6 +1,6 @@ { "name": "@next/polyfill-module", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "A standard library polyfill for ES Modules supporting browsers (Edge 16+, Firefox 60+, Chrome 61+, Safari 10.1+)", "main": "dist/polyfill-module.js", "license": "MIT", diff --git a/packages/next-polyfill-nomodule/package.json b/packages/next-polyfill-nomodule/package.json index 2b95e3ab3880..85b5a5c8dfd0 100644 --- a/packages/next-polyfill-nomodule/package.json +++ b/packages/next-polyfill-nomodule/package.json @@ -1,6 +1,6 @@ { "name": "@next/polyfill-nomodule", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "A polyfill for non-dead, nomodule browsers.", "main": "dist/polyfill-nomodule.js", "license": "MIT", diff --git a/packages/next/package.json b/packages/next/package.json index cb8bfb1c53f5..c3b0b0001dfd 100644 --- a/packages/next/package.json +++ b/packages/next/package.json @@ -1,6 +1,6 @@ { "name": "next", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "The React Framework", "main": "./dist/server/next.js", "license": "MIT", @@ -65,10 +65,10 @@ "dependencies": { "@babel/runtime": "7.12.5", "@hapi/accept": "5.0.2", - "@next/env": "11.1.1-canary.7", - "@next/polyfill-module": "11.1.1-canary.7", - "@next/react-dev-overlay": "11.1.1-canary.7", - "@next/react-refresh-utils": "11.1.1-canary.7", + "@next/env": "11.1.1-canary.8", + "@next/polyfill-module": "11.1.1-canary.8", + "@next/react-dev-overlay": "11.1.1-canary.8", + "@next/react-refresh-utils": "11.1.1-canary.8", "@node-rs/helper": "1.2.1", "assert": "2.0.0", "ast-types": "0.13.2", @@ -153,7 +153,7 @@ "@babel/traverse": "^7.12.10", "@babel/types": "7.12.12", "@napi-rs/cli": "1.1.0", - "@next/polyfill-nomodule": "11.1.1-canary.7", + "@next/polyfill-nomodule": "11.1.1-canary.8", "@taskr/clear": "1.1.0", "@taskr/esnext": "1.1.0", "@taskr/watch": "1.1.0", diff --git a/packages/react-dev-overlay/package.json b/packages/react-dev-overlay/package.json index 0bae8cc60315..5251270588dc 100644 --- a/packages/react-dev-overlay/package.json +++ b/packages/react-dev-overlay/package.json @@ -1,6 +1,6 @@ { "name": "@next/react-dev-overlay", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "A development-only overlay for developing React applications.", "repository": { "url": "vercel/next.js", diff --git a/packages/react-refresh-utils/package.json b/packages/react-refresh-utils/package.json index a9c0e02ff8f7..8a1618e314c9 100644 --- a/packages/react-refresh-utils/package.json +++ b/packages/react-refresh-utils/package.json @@ -1,6 +1,6 @@ { "name": "@next/react-refresh-utils", - "version": "11.1.1-canary.7", + "version": "11.1.1-canary.8", "description": "An experimental package providing utilities for React Refresh.", "repository": { "url": "vercel/next.js", From 76cc01f6b5f7dd1f81a2394add9a7875fff243c1 Mon Sep 17 00:00:00 2001 From: Tim Neutkens Date: Sun, 15 Aug 2021 21:26:02 +0200 Subject: [PATCH 5/9] Add support for Jaeger trace target (#28129) Adds support for Jaeger next to Zipkin as a trace target. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## 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. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes --- packages/next/telemetry/trace/report/index.ts | 3 + .../next/telemetry/trace/report/to-jaeger.ts | 90 +++++++++++++++++++ packages/next/telemetry/trace/shared.ts | 1 + 3 files changed, 94 insertions(+) create mode 100644 packages/next/telemetry/trace/report/to-jaeger.ts diff --git a/packages/next/telemetry/trace/report/index.ts b/packages/next/telemetry/trace/report/index.ts index 2f8130cab963..216b0e430029 100644 --- a/packages/next/telemetry/trace/report/index.ts +++ b/packages/next/telemetry/trace/report/index.ts @@ -1,6 +1,7 @@ import { TARGET, SpanId } from '../shared' import reportToConsole from './to-console' import reportToZipkin from './to-zipkin' +import reportToJaeger from './to-jaeger' import reportToTelemetry from './to-telemetry' type Reporter = ( @@ -28,6 +29,8 @@ if (target === TARGET.CONSOLE) { report = reportToConsole } else if (target === TARGET.ZIPKIN) { report = reportToZipkin +} else if (target === TARGET.JAEGER) { + report = reportToJaeger } else { report = reportToTelemetry } diff --git a/packages/next/telemetry/trace/report/to-jaeger.ts b/packages/next/telemetry/trace/report/to-jaeger.ts new file mode 100644 index 000000000000..7d94ebff3104 --- /dev/null +++ b/packages/next/telemetry/trace/report/to-jaeger.ts @@ -0,0 +1,90 @@ +import retry from 'next/dist/compiled/async-retry' +import { randomBytes } from 'crypto' +import fetch from 'node-fetch' +import * as Log from '../../../build/output/log' + +let traceId = process.env.TRACE_ID +let batch: ReturnType | undefined + +const localEndpoint = { + serviceName: 'nextjs', + ipv4: '127.0.0.1', + port: 9411, +} +// Jaeger supports Zipkin's reporting API +const zipkinUrl = `http://${localEndpoint.ipv4}:${localEndpoint.port}` +const jaegerWebUiUrl = `http://${localEndpoint.ipv4}:16686` +const zipkinAPI = `${zipkinUrl}/api/v2/spans` + +type Event = { + traceId: string + parentId?: string + name: string + id: string + timestamp: number + duration: number + localEndpoint: typeof localEndpoint + tags?: Object +} + +// Batch events as zipkin allows for multiple events to be sent in one go +function batcher(reportEvents: (evts: Event[]) => void) { + const events: Event[] = [] + let timeout: ReturnType | undefined + return (event: Event) => { + events.push(event) + // setTimeout is used instead of setInterval to ensure events sending does not block exiting the program + if (!timeout) { + timeout = setTimeout(() => { + reportEvents(events.slice()) + events.length = 0 + timeout = undefined + }, 1500) + } + } +} + +const reportToLocalHost = ( + name: string, + duration: number, + timestamp: number, + id: string, + parentId?: string, + attrs?: Object +) => { + if (!traceId) { + traceId = process.env.TRACE_ID = randomBytes(8).toString('hex') + Log.info( + `Jaeger trace will be available on ${jaegerWebUiUrl}/trace/${traceId}` + ) + } + + if (!batch) { + batch = batcher((events) => { + // Ensure ECONNRESET error is retried 3 times before erroring out + retry( + () => + // Send events to zipkin + fetch(zipkinAPI, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(events), + }), + { minTimeout: 500, retries: 3, factor: 1 } + ).catch(console.log) + }) + } + + batch({ + traceId, + parentId, + name, + id, + timestamp, + duration, + localEndpoint, + tags: attrs, + }) +} + +export default reportToLocalHost diff --git a/packages/next/telemetry/trace/shared.ts b/packages/next/telemetry/trace/shared.ts index 08fc14a3170e..74be1e29198f 100644 --- a/packages/next/telemetry/trace/shared.ts +++ b/packages/next/telemetry/trace/shared.ts @@ -3,6 +3,7 @@ export enum TARGET { CONSOLE = 'CONSOLE', ZIPKIN = 'ZIPKIN', + JAEGER = 'JAEGER', TELEMETRY = 'TELEMETRY', } From 639b4d7d1f9f78e7ae080fb7cdf8dfd6d0845fdc Mon Sep 17 00:00:00 2001 From: Oscar Fuentes Date: Sun, 15 Aug 2021 19:51:06 -0700 Subject: [PATCH 6/9] doc: fix typo (#28146) Given the context of the surrounding sentence, I believe the intention here was to use the word `increasing`. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## 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. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes --- docs/authentication.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/authentication.md b/docs/authentication.md index 4dd8981496a0..f0170d95cdc1 100644 --- a/docs/authentication.md +++ b/docs/authentication.md @@ -101,7 +101,7 @@ const Profile = ({ user }) => { export default Profile ``` -An advantage of this pattern is preventing a flash of unauthenticated content before redirecting. It's important to note fetching user data in `getServerSideProps` will block rendering until the request to your authentication provider resolves. To prevent creating a bottleneck and decreasing your TTFB ([Time to First Byte](https://web.dev/time-to-first-byte/)), you should ensure your authentication lookup is fast. Otherwise, consider [static generation](#authenticating-statically-generated-pages). +An advantage of this pattern is preventing a flash of unauthenticated content before redirecting. It's important to note fetching user data in `getServerSideProps` will block rendering until the request to your authentication provider resolves. To prevent creating a bottleneck and increasing your TTFB ([Time to First Byte](https://web.dev/time-to-first-byte/)), you should ensure your authentication lookup is fast. Otherwise, consider [static generation](#authenticating-statically-generated-pages). ## Authentication Providers From 876cbbaf01cef39566e9a35e72e641f57a01f6e0 Mon Sep 17 00:00:00 2001 From: Aryan Beezadhur <34424160+AryanBeezadhur@users.noreply.github.com> Date: Mon, 16 Aug 2021 04:01:57 +0100 Subject: [PATCH 7/9] Replace CSS tag with JS import (#28143) Replaces `` tag import with JS import to fix ESLint warning: https://nextjs.org/docs/messages/no-css-tags --- examples/with-loading/pages/_app.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/examples/with-loading/pages/_app.js b/examples/with-loading/pages/_app.js index f61239140652..93ccb4a38dc1 100644 --- a/examples/with-loading/pages/_app.js +++ b/examples/with-loading/pages/_app.js @@ -1,8 +1,8 @@ import { useEffect } from 'react' import Link from 'next/link' -import Head from 'next/head' import { useRouter } from 'next/router' import NProgress from 'nprogress' +import '../public/nprogress.css' export default function App({ Component, pageProps }) { const router = useRouter() @@ -29,10 +29,6 @@ export default function App({ Component, pageProps }) { return ( <> - - {/* Import CSS for nprogress */} - -