archive/rsnext
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fixes issue with makeStylesheetInert (#32027)

Browse source 
Fixes https://github.com/vercel/next.js/issues/32024

Fixing makeStylesheetInert.
Fixes log import.



## Bug

- [x] 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 by running `yarn lint`


Co-authored-by: Devin Wall <87490815+DevinWallKcl@users.noreply.github.com>
This commit is contained in:
Devin Wall 2022-01-03 15:35:57 -05:00 committed by GitHub
parent 52cf7fe51e
commit d0e72fd9fa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 68 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
packages/next/pages/_document.tsx
View file

@ -452,21 +452,30 @@ export class Head extends Component<
makeStylesheetInert(node: ReactNode): ReactNode[] {
return React.Children.map(node, (c: any) => {
if (
c.type === 'link' &&
c.props['href'] &&
c?.type === 'link' &&
c?.props?.href &&
OPTIMIZED_FONT_PROVIDERS.some(({ url }) =>
c.props['href'].startsWith(url)
c?.props?.href?.startsWith(url)
)
) {
const newProps = { ...(c.props || {}) }
newProps['data-href'] = newProps['href']
newProps['href'] = undefined
const newProps = {
...(c.props || {}),
'data-href': c.props.href,
href: undefined,
}
return React.cloneElement(c, newProps)
} else if (c?.props?.children) {
const newProps = {
...(c.props || {}),
children: this.makeStylesheetInert(c.props.children),
}
return React.cloneElement(c, newProps)
} else if (c.props && c.props['children']) {
c.props['children'] = this.makeStylesheetInert(c.props['children'])
}
return c
})
}).filter(Boolean)
}
render() {

36
test/integration/font-optimization/fixtures/make-stylesheet-inert-regression/pages/_document.js Normal file
View file

@ -0,0 +1,36 @@
import Document, { Html, Head, Main, NextScript } from 'next/document'
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
<Html>
<Head>
<>
{false && <script data-href="test"></script>}
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossOrigin
/>
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap"
rel="stylesheet"
/>
</>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument

8
test/integration/font-optimization/fixtures/make-stylesheet-inert-regression/pages/index.js Normal file
View file

@ -0,0 +1,8 @@
export default function Home() {
return (
<h1>
Falsey values contained in an element contained in Head should not result
in an error!
</h1>
)
}

6
test/integration/font-optimization/test/index.test.js
View file

@ -328,4 +328,10 @@ describe('Font Optimization', () => {
const { code } = await nextBuild(appDir)
expect(code).toBe(0)
})
test('makeStylesheetInert regression', async () => {
const appDir = join(fixturesDir, 'make-stylesheet-inert-regression')
const { code } = await nextBuild(appDir)
expect(code).toBe(0)
})
})