Skip to content

Commit

Permalink
Merge branch 'canary' into fix-36435
Browse files Browse the repository at this point in the history
  • Loading branch information
SukkaW authored Apr 26, 2022
2 parents 707aa09 + e97a648 commit 0e5e5c3
Show file tree
Hide file tree
Showing 39 changed files with 789 additions and 29 deletions.
2 changes: 1 addition & 1 deletion lerna.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,5 +16,5 @@
"registry": "https://registry.npmjs.org/"
}
},
"version": "12.1.6-canary.7"
"version": "12.1.6-canary.8"
}
2 changes: 1 addition & 1 deletion packages/create-next-app/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "create-next-app",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"keywords": [
"react",
"next",
Expand Down
4 changes: 2 additions & 2 deletions packages/eslint-config-next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "eslint-config-next",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "ESLint configuration used by NextJS.",
"main": "index.js",
"license": "MIT",
Expand All @@ -9,7 +9,7 @@
"directory": "packages/eslint-config-next"
},
"dependencies": {
"@next/eslint-plugin-next": "12.1.6-canary.7",
"@next/eslint-plugin-next": "12.1.6-canary.8",
"@rushstack/eslint-patch": "1.0.8",
"@typescript-eslint/parser": "5.19.0",
"eslint-import-resolver-node": "0.3.4",
Expand Down
2 changes: 1 addition & 1 deletion packages/eslint-plugin-next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/eslint-plugin-next",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "ESLint plugin for NextJS.",
"main": "lib/index.js",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-bundle-analyzer/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/bundle-analyzer",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"main": "index.js",
"license": "MIT",
"repository": {
Expand Down
2 changes: 1 addition & 1 deletion packages/next-codemod/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/codemod",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"license": "MIT",
"dependencies": {
"chalk": "4.1.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-env/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/env",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"keywords": [
"react",
"next",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-mdx/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/mdx",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"main": "index.js",
"license": "MIT",
"repository": {
Expand Down
2 changes: 1 addition & 1 deletion packages/next-plugin-storybook/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/plugin-storybook",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"repository": {
"url": "vercel/next.js",
"directory": "packages/next-plugin-storybook"
Expand Down
2 changes: 1 addition & 1 deletion packages/next-polyfill-module/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/polyfill-module",
"version": "12.1.6-canary.7",
"version": "12.1.6-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",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-polyfill-nomodule/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/polyfill-nomodule",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "A polyfill for non-dead, nomodule browsers.",
"main": "dist/polyfill-nomodule.js",
"license": "MIT",
Expand Down
2 changes: 1 addition & 1 deletion packages/next-swc/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/swc",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"private": true,
"scripts": {
"build-native": "napi build --platform --cargo-name next_swc_napi native",
Expand Down
18 changes: 13 additions & 5 deletions packages/next/client/link.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,18 +30,21 @@ type InternalLinkProps = {
prefetch?: boolean
locale?: string | false
legacyBehavior?: boolean
// e: any because as it would otherwise overlap with existing types
/**
* requires experimental.newNextLinkBehavior
*/
onMouseEnter?: (e: React.MouseEvent) => void
onMouseEnter?: (e: any) => void
// e: any because as it would otherwise overlap with existing types
/**
* requires experimental.newNextLinkBehavior
*/
onClick?: (e: React.MouseEvent) => void
onClick?: (e: any) => void
}

export type LinkProps = InternalLinkProps &
React.AnchorHTMLAttributes<HTMLAnchorElement>
// TODO: Include the full set of Anchor props
// adding this to the publicly exported type currently breaks existing apps
export type LinkProps = InternalLinkProps
type LinkPropsRequired = RequiredKeys<LinkProps>
type LinkPropsOptional = OptionalKeys<InternalLinkProps>

Expand Down Expand Up @@ -116,7 +119,12 @@ function linkClicked(
})
}

function Link(props: React.PropsWithChildren<LinkProps>) {
function Link(
props: React.PropsWithChildren<
Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> &
LinkProps
>
) {
const {
legacyBehavior = Boolean(process.env.__NEXT_NEW_LINK_BEHAVIOR) !== true,
} = props
Expand Down
14 changes: 7 additions & 7 deletions packages/next/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "next",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "The React Framework",
"main": "./dist/server/next.js",
"license": "MIT",
Expand Down Expand Up @@ -69,7 +69,7 @@
]
},
"dependencies": {
"@next/env": "12.1.6-canary.7",
"@next/env": "12.1.6-canary.8",
"caniuse-lite": "^1.0.30001332",
"postcss": "8.4.5",
"styled-jsx": "5.0.1"
Expand Down Expand Up @@ -117,11 +117,11 @@
"@hapi/accept": "5.0.2",
"@napi-rs/cli": "2.4.4",
"@napi-rs/triples": "1.1.0",
"@next/polyfill-module": "12.1.6-canary.7",
"@next/polyfill-nomodule": "12.1.6-canary.7",
"@next/react-dev-overlay": "12.1.6-canary.7",
"@next/react-refresh-utils": "12.1.6-canary.7",
"@next/swc": "12.1.6-canary.7",
"@next/polyfill-module": "12.1.6-canary.8",
"@next/polyfill-nomodule": "12.1.6-canary.8",
"@next/react-dev-overlay": "12.1.6-canary.8",
"@next/react-refresh-utils": "12.1.6-canary.8",
"@next/swc": "12.1.6-canary.8",
"@peculiar/webcrypto": "1.3.1",
"@taskr/clear": "1.1.0",
"@taskr/esnext": "1.1.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/next/server/lib/squoosh/impl.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ type EncoderKey = keyof typeof supportedFormats
// Fixed in Node.js 16.5.0 and newer.
// See https://github.com/nodejs/node/pull/39337
// Eventually, remove this delay when engines is updated.
// See https://git.io/JCTr0
// See https://github.com/vercel/next.js/blob/1bcc923439f495a1717421e06af7e64c6003072c/packages/next/package.json#L249-L251
const FIXED_VERSION = '16.5.0'
const DELAY_MS = 1000
let _promise: Promise<void> | undefined
Expand Down
2 changes: 1 addition & 1 deletion packages/react-dev-overlay/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/react-dev-overlay",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "A development-only overlay for developing React applications.",
"repository": {
"url": "vercel/next.js",
Expand Down
2 changes: 1 addition & 1 deletion packages/react-refresh-utils/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@next/react-refresh-utils",
"version": "12.1.6-canary.7",
"version": "12.1.6-canary.8",
"description": "An experimental package providing utilities for React Refresh.",
"repository": {
"url": "vercel/next.js",
Expand Down
2 changes: 1 addition & 1 deletion test/e2e/new-link-behavior/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ async function matchLogs(browser, includes: string) {
return found
}

const appDir = path.join(__dirname, './app')
const appDir = path.join(__dirname, 'app')

describe('New Link Behavior', () => {
let next: NextInstance
Expand Down
46 changes: 46 additions & 0 deletions test/e2e/new-link-behavior/material-ui.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import { createNext, FileRef } from 'e2e-utils'
import { NextInstance } from 'test/lib/next-modes/base'
import webdriver from 'next-webdriver'
import path from 'path'

const appDir = path.join(__dirname, 'material-ui')

describe('New Link Behavior with material-ui', () => {
let next: NextInstance

beforeAll(async () => {
next = await createNext({
files: {
pages: new FileRef(path.join(appDir, 'pages')),
src: new FileRef(path.join(appDir, 'src')),
'next.config.js': new FileRef(path.join(appDir, 'next.config.js')),
},
dependencies: {
'@emotion/cache': 'latest',
'@emotion/react': 'latest',
'@emotion/server': 'latest',
'@emotion/styled': 'latest',
'@mui/icons-material': 'latest',
'@mui/material': 'latest',
next: 'latest',
'prop-types': 'latest',
react: 'latest',
'react-dom': 'latest',
eslint: 'latest',
'eslint-config-next': 'latest',
},
})
})
afterAll(() => next.destroy())

it('should render MuiLink with <a>', async () => {
const browser = await webdriver(next.url, `/`)
const element = await browser.elementByCss('a[href="/about"]')

const color = await element.getComputedCss('color')
expect(color).toBe('rgb(25, 133, 123)')

const text = await element.text()
expect(text).toBe('Go to the about page')
})
})
6 changes: 6 additions & 0 deletions test/e2e/new-link-behavior/material-ui/next.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
module.exports = {
reactStrictMode: true,
experimental: {
newNextLinkBehavior: true,
},
}
27 changes: 27 additions & 0 deletions test/e2e/new-link-behavior/material-ui/pages/_app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import * as React from 'react'
import Head from 'next/head'
import { ThemeProvider } from '@mui/material/styles'
import CssBaseline from '@mui/material/CssBaseline'
import { CacheProvider } from '@emotion/react'
import theme from '../src/theme'
import createEmotionCache from '../src/createEmotionCache'

// Client-side cache, shared for the whole session of the user in the browser.
const clientSideEmotionCache = createEmotionCache()

export default function MyApp(props) {
const { Component, emotionCache = clientSideEmotionCache, pageProps } = props

return (
<CacheProvider value={emotionCache}>
<Head>
<meta name="viewport" content="initial-scale=1, width=device-width" />
</Head>
<ThemeProvider theme={theme}>
{/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
<CssBaseline />
<Component {...pageProps} />
</ThemeProvider>
</CacheProvider>
)
}
88 changes: 88 additions & 0 deletions test/e2e/new-link-behavior/material-ui/pages/_document.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
import * as React from 'react'
import Document, { Html, Head, Main, NextScript } from 'next/document'
import createEmotionServer from '@emotion/server/create-instance'
import theme from '../src/theme'
import createEmotionCache from '../src/createEmotionCache'

export default class MyDocument extends Document {
render() {
return (
<Html lang="en">
<Head>
{/* PWA primary color */}
<meta name="theme-color" content={theme.palette.primary.main} />
<link rel="shortcut icon" href="/static/favicon.ico" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
/>
{/* Inject MUI styles first to match with the prepend: true configuration. */}
{this.props.emotionStyleTags}
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}

// `getInitialProps` belongs to `_document` (instead of `_app`),
// it's compatible with static-site generation (SSG).
MyDocument.getInitialProps = async (ctx) => {
// Resolution order
//
// On the server:
// 1. app.getInitialProps
// 2. page.getInitialProps
// 3. document.getInitialProps
// 4. app.render
// 5. page.render
// 6. document.render
//
// On the server with error:
// 1. document.getInitialProps
// 2. app.render
// 3. page.render
// 4. document.render
//
// On the client
// 1. app.getInitialProps
// 2. page.getInitialProps
// 3. app.render
// 4. page.render

const originalRenderPage = ctx.renderPage

// You can consider sharing the same emotion cache between all the SSR requests to speed up performance.
// However, be aware that it can have global side effects.
const cache = createEmotionCache()
const { extractCriticalToChunks } = createEmotionServer(cache)

ctx.renderPage = () =>
originalRenderPage({
enhanceApp: (App) =>
function EnhanceApp(props) {
return <App emotionCache={cache} {...props} />
},
})

const initialProps = await Document.getInitialProps(ctx)
// This is important. It prevents emotion to render invalid HTML.
// See https://github.com/mui/material-ui/issues/26561#issuecomment-855286153
const emotionStyles = extractCriticalToChunks(initialProps.html)
const emotionStyleTags = emotionStyles.styles.map((style) => (
<style
data-emotion={`${style.key} ${style.ids.join(' ')}`}
key={style.key}
// eslint-disable-next-line react/no-danger
dangerouslySetInnerHTML={{ __html: style.css }}
/>
))

return {
...initialProps,
emotionStyleTags,
}
}
Loading

0 comments on commit 0e5e5c3

Please sign in to comment.